こんにちは。CData Software Japan リードエンジニアの杉本です。
今日はノーコードアプリケーション開発プラットフォームの Bubble と CData Connectを組み合わせて、Kintoneのデータにアクセスする方法を紹介したいと思います。
- CData Connect とは?
- Bubble への SaaS データ連携
- 完成イメージ
- CData Connect でkintone をOData エンドポイントを構成
- Bubble API Connector の構成
- UIを構成する
- CData Connect の利用記事
ちなみにこの記事は CData Software Advent Calendar 2020、1日目の記事です。
CData Connect とは?
CData Connect は、SaaS ベースで提供されるデータハブサービスです。Salesforce、NetSuite、Dynamics、Marketo、kintone など多様なSaaS、ElasticsearchやMongoDBなどのNoSQL・データストアに対してBI、アナリティクス、iPaaS、ノーコード開発プラットフォームからアクセスするための仮想エンドポイントです。
連携方法が異なるSaaS や NoSQL をMySQL、SQL Server、OData の3種類のインターフェースに仮想化することで、データ連携をシンプルに実現します。
"SQL as a Service" といっていいかもしれません。
Bubble への SaaS データ連携
Bubble は、Plugin という形式で Salesforce や Asana などいろいろなデータの連携をサポートしています。
とはいえ、今回取り上げるような Kintone や Sansan といった国産SaaSなど、対応していないデータソースも数多く存在します。
この不足をCData Connect を活用してカバーすることが可能です。
完成イメージ
この記事では以下のような kintone のアプリに登録されているデータをシームレスにBubbleで表示するUIを構成します。
以下のように Bubble 上で簡単にデータを呼び出せます。
CData Connect でkintone をOData エンドポイントを構成
CData Connect (旧CloudHub) のアカウントを取得します。CData Connect はSaaS ですので、アカウントを取得したらインストールやホスティングなどなく、ブラウザからログインすることですぐに使用開始です。
早速ブラウザからCData Connect にログインします。「DATABASE」タブから仮想データベースを設定していきます。まずは接続するデータソースのアイコンをクリックします。
データソース接続画面が開くので、データソース毎の認証情報を入力します。kintone の場合はURL、User、Password を入力することでkintone データにアクセスすることができます。
次に「ENDPOINTS」タブで、このデータをどのインターフェースのエンドポイントして公開するかを選択します。デフォルトで、OData、MySQL wire protocol、TDS(SQL Server) wire Protocol がすべて有効になっています。
必要があればアクセスを許可する信頼されたIP アドレスを指定することも可能です。
今回はOData エンドポイントとしてkintone データを公開しますので、「ODATA」 タブから公開するデータを選択します。先ほど接続時に作成したKintone2 を公開するので、データベースとして選択します。
kintone のアプリが一覧で表示されますので、利用するアプリにチェックを入れて選択します。
テーブル(アプリ)を選択したら、次はテーブルに含まれるカラム(フィールド)をどこまで公開するかをチェックします。またOData でアクセスできる処理をGET、POST、PUT、DELETE にチェックを入れることで指定します。
「API」タブでOData エンドポイントが生成されていることを確認します。CData Connect がOData エンドポイントのドキュメントを自動生成してくれます。
最後に公開したデータにアクセスできるユーザーとトークンを作成します。「USERS」タブからユーザーを作成するとトークンが生成されます。
このようにノーコードでkintone をOData エンドポイントとして公開できました。
Bubble API Connector の構成
それでは Bubble側でCData Connectに連携するための API Connector を構成します。
まず、Bubble の Pluginsタブに移動して「Add Pluings」をクリックします。
一覧の中から「API Connector」を検索し、インストールしてください。
インストール後、連携設定の画面が出てくるので、任意の名称を入力し、Header情報に「x-cdata-authtoken」と予め取得したCData Connect のTokenを設定します。
続いて、Kintoneのエンドポイントを呼び出す定義を追加します。
「GET」リクエストで、CData Connectで定義したAPIエンドポイントのURLを入力してください。
最後に「Initialize call」を行い、データ項目の型情報を調整します。
特に変更がなければデフォルトのままでOKです。
以上で Bubble から CData Connectへの連携設定は完了です。
UIを構成する
それではBubble でKintone のデータを呼び出してみましょう。
今回はExcel Likeなテーブルを表示できるUIコンポーネントでデータを呼び出してみます。
Add Pluingsで「Excel-like HandsonTable」を追加します。
あとは、このUIコンポーネントを配置して、CData ConnectをバインドするだけでOKです。
以下のGIFアニメにやり方をまとめてみました。
このような形で各種APIの認証やJSONのフォーマット、リクエスト方法に詳しくなくても、それぞれのツールから呼び出しやすい形でデータを扱えるのがCData Connectの特徴です。
今回はKintone のデータを呼び出しましたが、SalesforceでもDynamics 365でもHubSpotでもこのアプローチは変わりません。
CData Connect の利用記事
CData Connect は、他にもSAP Analytics Cloud、Amazon QuickSight、Google Data Studio など多くのNoCode サービス、クラウドBI、iPaaS から利用が可能です。是非、お試しください。