Hiroku × Tableau × Instagram

2020.12.27
この記事は約3分で読めます。
sponsored link

はじめの準備

・Hiroku accountを作成（手順）
・FacebookページとInstagramの連携（手順）
・Facebook developer accountを作成（手順）
・以下の順に従いMy Appを作成
  1. Facebook developer accountのサイトにサインイン
  2. 右上の「My App」をクリック
  3. 遷移先のページ右上の「Create App」(緑色のボタン)をクリック
  4. 「Manage Business Integrations」(画像1)をクリック
  5. 詳細を設定(画像2)し、メールアドレス入力後「Create App」(青色のボタン)をクリック
  6. 左のサイドバー＞Settings＞Basic「Client ID」「Client Secret」をメモ(画像3)
  7. 次のステップへ

※画像1

※画像2

※画像3

GithubのWeb Data Connecterに接続

GigiさんのInstagram-wdc (github)へ遷移し、画面最下部にある「Deploy to Heroku」(紫色のボタン)をクリックします。

  • App name：自分が分かれば何でも
  • CLIENT_ID：先ほどメモしたMy AppのClient ID
  • CLIENT_SECRET：先ほどメモしたMy AppのClient Secret
  • REDIRECT_URL：”your-app-name”の部分を書き換え

上の入力が完了した方は「Deploy app」(紫色のボタン)をクリックしてください。

次にREDIRECT_URLの一部（”redirect”より前）をコピーし、My Appの管理画面サイドバー＞Settings＞Basic＞「App Domains」「Privacy Policy URL」の両方にペースト。

ペースト後に右下の保存(青色のボタン)をクリックすると以下のような画面になります。

ここまでたどり着けた方は、左のサイドバーにある「PRODUCT＋」というマークをクリックします。

そして右上のFacebook Login＞Set Upを選択します。

そして左のサイドバーの「Settings」をクリックし、Valid OAuth Redirect URlsに先ほどのREDIRECL_URLを入力します。

※私の場合は”https://wdc0.herokuapp.com/redirect”です。

他の項目のON/OFFは変更しなくて良いので、そのまま右下の保存(青色のボタン)をクリックしてください。

Herokuの画面に戻り最下部までスクロールし「Manage App」(紫色のボタン)を選択すると、管理画面に飛ぶので右上の「Open App」(紫色のボタン)をクリックします。

すると下のような黄色のInstagram Web Data Connector画面が表示されるので、それをTableauのWEBデータコネクタのURLにコピペします。

※私の場合、該当URLは”https://wdc0.herokuapp.com”です。

 

そして後は、自身のFacebookアカウントとそれに紐づけられたInstagramアカウントを接続すれば完了となります。

後は認証作業なので割愛させていただきます。お疲れ様でした。

sponsored link