データ可視化ソリューション「Reveal」から Typeform に接続する方法

CData API Server を使って、Reveal にTypeform データをフィードして、ビジュアライズを実現できます。コネクターによりリアルタイムデータ連携が可能になり、リフレッシュ操作で最新のデータを取得可能になります。この記事では、Reveal からTypeform のデータに接続しビジュアライズする方法を説明します。

API Server の設定

以下のリンクからAPI Server の無償トライアルをスタートしたら、セキュアなTypeform OData サービスを作成していきましょう。

Typeform への接続

Reveal からTypeform のデータを操作するには、まずTypeform への接続を作成・設定します。

1. API Server にログインして、「Connections」をクリック、さらに「接続を追加」をクリックします。
2. 「接続を追加」をクリックして、データソースがAPI Server に事前にインストールされている場合は、一覧から「Typeform」を選択します。
3. 事前にインストールされていない場合は、コネクタを追加していきます。コネクタ追加の手順は以下の記事にまとめてありますので、ご確認ください。
   CData コネクタの追加方法はこちら >>
4. それでは、Typeform への接続設定を行っていきましょう！

5. まず、Profile 接続プロパティにTypeForm プロファイルのディスク上の場所を設定します（例：C:\profiles\TypeForm.apip）。次に、ProfileSettings 接続プロパティにTypeForm の接続文字列を設定します（以下を参照）。

   TypeForm API プロファイル設定

   TypeForm への認証にはOAuth 標準を使用します。

   TypeForm に認証するには、まずTypeForm でOAuth アプリケーションを登録および設定する必要があります：https://admin.typeform.com/account#/section/tokens。アプリにはclient ID とclient secret が割り当てられ、接続文字列で設定できます。OAuth アプリケーションの設定の詳細については、https://developer.typeform.com/get-started/ をご参照ください。

   使用シナリオによって異なるリダイレクトURI が必要です：

   • CData デスクトップアプリケーション：CData デスクトップアプリケーション（Sync、API Server、ArcESB）は/src/oauthCallback.rst でOAuth トークンを受け入れます。ホストとポートはアプリケーションが使用するデフォルトポートと同じです。例えば、http://localhost:8019/ でCData Sync にアクセスする場合、リダイレクトURI はhttp://localhost:8019/src/oauthCallback.rst になります。
   • CData クラウドアプリケーション：CData クラウドアプリケーションはデスクトップ版と同様です。https://1.2.3.4/ でConnect AI にアクセスする場合、リダイレクトはhttps://1.2.3.4/src/oauthCallback.rst を使用します。
   • デスクトップアプリケーション：デスクトップアプリケーションを使用する場合、URI はhttps://localhost:33333 を推奨します。
   • Web アプリケーション：ドライバーを使用してWeb アプリケーションを開発する場合、https://my-website.com/oauth のような独自のURI を使用します。

   以下の接続プロパティを設定すると、接続の準備が整います：

   • AuthScheme：OAuth に設定します。
   • InitiateOAuth：GETANDREFRESH に設定します。InitiateOAuth を使用してOAuthAccessToken を取得するプロセスを管理できます。
   • OAuthClientId：アプリ設定で指定されているClient Id を設定します。
   • OAuthClientSecret：アプリ設定で指定されているClient Secret を設定します。
   • CallbackURL：アプリ設定で指定したRedirect URI を設定します。
6. 接続情報の入力が完了したら、「保存およびテスト」をクリックします。

まず、Profile 接続プロパティにTypeForm プロファイルのディスク上の場所を設定します（例：C:\profiles\TypeForm.apip）。次に、ProfileSettings 接続プロパティにTypeForm の接続文字列を設定します（以下を参照）。

TypeForm API プロファイル設定

TypeForm への認証にはOAuth 標準を使用します。

TypeForm に認証するには、まずTypeForm でOAuth アプリケーションを登録および設定する必要があります：https://admin.typeform.com/account#/section/tokens。アプリにはclient ID とclient secret が割り当てられ、接続文字列で設定できます。OAuth アプリケーションの設定の詳細については、https://developer.typeform.com/get-started/ をご参照ください。

使用シナリオによって異なるリダイレクトURI が必要です：

• CData デスクトップアプリケーション：CData デスクトップアプリケーション（Sync、API Server、ArcESB）は/src/oauthCallback.rst でOAuth トークンを受け入れます。ホストとポートはアプリケーションが使用するデフォルトポートと同じです。例えば、http://localhost:8019/ でCData Sync にアクセスする場合、リダイレクトURI はhttp://localhost:8019/src/oauthCallback.rst になります。
• CData クラウドアプリケーション：CData クラウドアプリケーションはデスクトップ版と同様です。https://1.2.3.4/ でConnect AI にアクセスする場合、リダイレクトはhttps://1.2.3.4/src/oauthCallback.rst を使用します。
• デスクトップアプリケーション：デスクトップアプリケーションを使用する場合、URI はhttps://localhost:33333 を推奨します。
• Web アプリケーション：ドライバーを使用してWeb アプリケーションを開発する場合、https://my-website.com/oauth のような独自のURI を使用します。

以下の接続プロパティを設定すると、接続の準備が整います：

• AuthScheme：OAuth に設定します。
• InitiateOAuth：GETANDREFRESH に設定します。InitiateOAuth を使用してOAuthAccessToken を取得するプロセスを管理できます。
• OAuthClientId：アプリ設定で指定されているClient Id を設定します。
• OAuthClientSecret：アプリ設定で指定されているClient Secret を設定します。
• CallbackURL：アプリ設定で指定したRedirect URI を設定します。

API Server のユーザー設定

次に、API Server 経由でTypeform にアクセスするユーザーを作成します。「Users」ページでユーザーを追加・設定できます。やってみましょう。

1. 「Users」ページで ユーザーを追加をクリックすると、「ユーザーを追加」ポップアップが開きます。
2. 次に、「ロール」、「ユーザー名」、「権限」プロパティを設定し、「ユーザーを追加」をクリックします。
3. その後、ユーザーの認証トークンが生成されます。各ユーザーの認証トークンとその他の情報は「Users」ページで確認できます。

Typeform 用のAPI エンドポイントの作成

ユーザーを作成したら、Typeform のデータ用のAPI エンドポイントを作成していきます。

1. まず、「API」ページに移動し、 「 テーブルを追加」をクリックします。
2. アクセスしたい接続を選択し、次へをクリックします。
3. 接続を選択した状態で、各テーブルを選択して確認をクリックすることでエンドポイントを作成します。

OData のエンドポイントを取得

以上でTypeform への接続を設定してユーザーを作成し、API Server でTypeform データのAPI を追加しました。これで、OData 形式のTypeform データをREST API で利用できます。API Server の「API」ページから、API のエンドポイントを表示およびコピーできます。

ダッシュボードの作成

それでは実際に可視化を行っていきます。「Reveal」ではダッシュボードという単位でいくつかのグラフを配置して、構成していきます。

1. Revealにログインし、「新規」→「ダッシュボード」をクリックします。

2. データソースから「ODataフィード」を選択し

3. API ServerのAPIエンドポイントURLを指定し、資格情報を入力します。 URLは「https://XXXXXXX/api.rsc/」といったように末尾が「api.rsc」で終わっているものを入力します。

4. 資格情報は「汎用資格情報」を選択し、

5. あらかじめ作成しておいたAPI Serverのユーザー名と認証トークンをそれぞれ指定します。

6. 認証完了後、エンティティセットを選択する画面に移動するので、取得したい任意のエンティティセットを選択します。

7. これでダッシュボードを作成する準備が整いました。あとは Reveal の機能を使って、Typeform・API Serverから取得したデータを可視化・分析することができます。

8. 以下のようなグラフを作成することができました。

このように Typeform 内のデータをAPI を書くことなく Reveal 上で処理することができるようになります。

おわりに

これで、リアルタイムTypeform のデータから簡単なダッシュボードが作成できました。Typeform （および150 を超えるほかのソース）からのOData フィードの作成方法の詳細については、API Server のページにアクセスしてください。30 日間無料トライアルをダウンロードしてOData API を使用するツールでTypeform のデータをリアルタイムに活用しましょう。