BLOG

ローコード

【現場で使える Bubble #2】Data APIの使い方：効率的にデータを操作する方法

2024-09-05

皆さま、ごきげんよう！tocです。

前回の 【現場で使える Bubble #1】WUって？課金仕様とプロダクトに合わせたプラン選択はいかがだったでしょうか？Bubbleの基本を抑えるために、非常に重要な内容でしたね。

まだご覧になっていない方は、ぜひチェックしてみてください！

さて、今回は【現場で使える Bubble】第2弾として、Data APIに焦点を当ててお話しします。APIの活用は、Bubbleアプリを外部サービスと連携させる上で欠かせないスキルです。そして、内部のデータ操作にも便利な機能です。特にData APIは、データのやり取りをシンプルかつ効率的に行えるので、ぜひ押さえておきたいポイントです。

それでは、さっそく始めましょう！

イントロダクション
1. 概要
2. 目的
Data APIの基本
1. APIの設定方法
2. エンドポイントの説明
Authentication
1. 認証なし
2. 管理者として
3. ユーザーとして
エラーハンドリング
1. エラーハンドリング
まとめ

1. イントロダクション

概要

BubbleのData APIは、Bubbleアプリのデータにアクセスし、操作するための強力なツールです。

Bubbleはローコードプラットフォームとして、アプリの開発を効率化するための多くの機能を提供していますが、その中でもData APIは、外部アプリやサービスとBubbleアプリのデータを連携させるのに役立ちます。

Data APIを利用することで、データの取得、追加、更新、削除などの操作をプログラムから行うことができます。

目的

Data APIを利用する理由はいくつかあります。

外部アプリとの連携: 他のアプリやサービスとBubbleアプリのデータを統合する際、Data APIを利用することでシームレスに連携が可能です。例えば、外部のCRMシステムや分析ツールとデータを連携させることができます。また、Bubble内部のアプリ同士でデータをやり取りしたい場合も、Data APIを使用してデータの取得や操作が簡単に行えます。
モバイルアプリとの統合: Bubbleで作成したWebアプリとモバイルアプリを統合する場合、Data APIを利用することで、モバイルアプリからデータの取得や更新を行うことができます。
自動化と効率化: Data APIを使用することで、手動で行っていたデータ操作を自動化することができます。これにより、作業の効率化やエラーの削減が可能になります。

Data APIを使いこなすことで、Bubbleアプリのデータをより柔軟に操作し、さまざまなニーズに対応することができます。

2. Data APIの基本

APIの設定方法

BubbleでData APIを有効にするための手順は以下の通りです。これにより、アプリのデータに外部からアクセスできるようになります。

Bubbleのエディタにアクセス: Bubbleアプリのエディタにログインし、対象のアプリを開きます。
API設定ページを開く: 左側のメニューから「Settings」を選択し、「API」タブに移動します。このタブでAPIの設定を行います。
Data APIを有効にする: 「Data API」セクションの「Enable Data API」をオンにします。これにより、Data APIが有効になります。
Data Typeを公開: 「Data Types」セクションで、公開したいData Typeの「Expose data as a public API」をオンにします。これで選択したData TypeがAPI経由でアクセスできるようになります。
APIキーの確認: 必要に応じて、APIキーを生成し、保存します。APIキーはData APIを利用する際に必要になります。

今回はdemo_userフィールドのみ参照できるようにしました。

エンドポイントの説明

Data APIにはいくつかのエンドポイントが用意されており、それぞれ異なるデータ操作をサポートしています。以下は主なエンドポイントの説明です。

[yourapp]にはご自身のアプリ名を記載
Mainブランチなのでversion-test
[data_type]にはデータベース名を記載
[Unique id]には対象データのUnique idを記載

なお、今回はPostmanを使用してますが、同じアプリの内部で、API Connectorを使って自分のData APIを呼び出すことができます。

API Connectorの使い方については、こちらの記事で詳しく解説していますので、ぜひチェックしてみてください。

【Bubble 入門 #8】API Connector で外部サービスと連携しよう！はじめての Plugin インストール♪

データの取得 (GET)
- エンドポイント: https://[yourapp].bubbleapps.io/version-test/api/1.1/obj/[data_type]
- 説明: 指定したData Typeのすべてのデータを取得します。オプションでクエリパラメータを使ってデータをフィルタリングすることもできます。

データの追加 (POST)
- エンドポイント: https://[yourapp].bubbleapps.io/version-test/api/1.1/obj/[data_type]
- 説明: 新しいデータを指定したData Typeに追加します。リクエストボディにデータのフィールドを含める必要があります。

データの追加 (POST)
- エンドポイント: https://[yourapp].bubbleapps.io/version-test/api/1.1/obj/[data_type]
- 説明: 新しいデータを指定したData Typeに追加します。リクエストボディにデータのフィールドを含める必要があります。

データの部分的な更新 (PATCH)
- エンドポイント: https://[yourapp].bubbleapps.io/version-test/api/1.1/obj/[data_type]/[Unique id]
- 説明: 指定したIDのデータを更新します。リクエストボディに更新したいフィールドを含めます。指定していないフィールドはそのまま保持されます。

データの削除 (DELETE)
- エンドポイント: https://[yourapp].bubbleapps.io/version-test/api/1.1/obj/[data_type]/[Unique id]
- 説明: 指定したIDのデータを削除します。

それぞれのエンドポイントは、このあと紹介するAPIキーと適切な認証が必要な場合があります。

3. Authentication

【Bubble 入門 #10】Current User で実現！プライバシーに配慮した安全なアプリの実装方法

でご紹介したプライバシールールでアクセス制限をすることができます。

ここでは、認証なしでの利用、管理者としての利用、そしてユーザーとしての利用の3つの方法について説明します。

認証なし

概要: 認証なしでData APIを利用する場合、公開データに対してAPIリクエストを行うことができます。この設定は、データが一般に公開されている場合や、特定のデータを誰でもアクセスできるようにする場合に適しています。

設定方法:

Data Typeの公開設定:
- Bubbleのエディタで、「Data」タブに移動し、「Data Types」を選択します。
- 公開したいData Typeを選び、「Expose data as a public API」オプションをオンにします。
APIのエンドポイントにアクセス:
- 公開設定を行ったData Typeに対して、GETリクエストを送信することで、誰でもデータにアクセスできるようになります。
  Everyone else(default permissions)のFind this in searchesにチェックをつけると誰でもデータが参照できます。

Find this in searchesのチェックを外すと情報が取得できなくなります。

管理者として

概要: 管理者権限でData APIを利用する場合、管理者のみがアクセスできるデータや操作が可能になります。これにより、特定の操作（データの追加、更新、削除など）が許可されます。

設定方法:

APIキーの生成:
- Bubbleのエディタで、「Settings」タブを開き、「API」セクションに移動します。
- 「API Key」を生成し、管理者用のアクセスキーとして使用します。
APIキーの設定:
- APIリクエストを送信する際に、生成したAPIキーをBearerトークンに含めることで、管理者権限での操作を行います。

使用例: 管理者として、特定のデータセットを更新したり、削除するためのリクエストを送信することで、データの管理を行うことができます。

ユーザーとして

概要: ユーザーとしてData APIを利用する場合、Bubbleアプリのユーザーとしてログインし、そのユーザーに関連するデータにアクセスします。これにより、ログインしたユーザー専用のデータに対して操作が行えます。

設定方法:

ユーザーのログイン:
- API設定ページからEnable Workflow API and backend workflowsにチェックをいれます。

「Workflow」タブで、「Log the user in」アクションを設定し、APIリクエストを通じてユーザーをログインさせます。

step 1では一時パスワードを割り当ててそのパスワードをresult of step 1を使ってstep2でログインしています。
上記で作成したWorkflowのAPIを実行するとresponseでtokenが確認できます。

認証済みのリクエスト:
- 上記で発行されたログインしたユーザーのtoken情報を利用して、APIリクエストを送信します。リクエストに必要な認証トークンをヘッダーに含めます。プライバシールールはログインしているユーザーはageのみ参照できるように設定します。

responseではageの情報のみ参照できるようになりました。

※ちなみに管理者権限では先ほどと変わらず全ての情報を取得できます。

使用例: ユーザーがログインした状態で、そのユーザー専用のデータに対してGETリクエストを送り、ユーザーのプロフィール情報を取得する場合などに利用します。

5. エラーハンドリング

エラーハンドリング

よくあるエラーとその対処法

400 Bad Request

説明: リクエストが不正である場合に返されます。例えば、必要なフィールドが欠けている場合や無効なデータが含まれている場合です。
対処法: リクエストの構造やデータ形式が正しいか再確認し、必要なフィールドがすべて含まれているか確認します。

エラーレスポンス例:

{
    "statusCode": 400,
    "body": {
        "status": "ERROR",
        "message": "Unrecognized field: status"
    }
}

401 Unauthorized

説明: 認証に失敗した場合に返されます。APIキーが無効であるか、適切な認証情報が提供されていない場合です。
対処法: APIキーが正しいか確認し、ヘッダーに正しく含められているか確認します。

エラーレスポンス例:

{
    "error_class": "Unauthorized",
    "args": {
        "code": "1725351443108x940384930437282700"
    },
    "message": null,
    "translation": "Invalid or expired token: test"
}

404 Not Found

説明: 指定したエンドポイントやデータが見つからない場合に返されます。リクエストしたリソースが存在しない場合です。
対処法: エンドポイントのURLやデータIDが正しいか再確認します。

エラーレスポンス例:

{
  "status": "error",
  "message": "Type not found hogehoge"
}

500 Internal Server Error

説明: サーバー内で予期しないエラーが発生した場合に返されます。サーバー側の問題である場合が多いです。
対処法: 一時的な問題の可能性があるため、リクエストを再試行するか、問題が続く場合はサポートに問い合わせます。

エラーレスポンス例:

{
    "error_class": "UnexpectedPostgresError",
    "args": {
        "code": "1725352451335x791448252480398300"
    },
    "message": "一時的な不具合により実行が中断されました。早急に問題の解消を進めておりますので、少し待って再度操作をお願いします。"
}