こんにちは。
前に「WebサイトにInstagramの投稿を簡単に表示する方法」をご紹介しました。

WebサイトにInstagramの投稿を簡単に表示する方法
すごく簡単に出来るのですが、表示されない事が結構ありまして、Instagram(Facebook)が提供しているAPIを取得する方法も試してみる事にしました。
かなり面倒なのと、何やってるのかよくわからない…状態になってます。そしてAPIの仕様変更の頻度が高いらしく、こちらもメンテナンスがかなり大変そうです。なかなか一筋縄にはいかないですが、始めていきます。最終的には、APIで使用する【ビジネスアカウントID】と【アクセストークン(無期限)】をゲットするのが目的です。
前提条件
- Facebookアカウントがある事
- Facebook for Developerに登録済みである事
- Instagramアカウントがある事
Instagramでビジネスアカウントを作成
Instagramアプリの方から
\[設定\]-
\[アカウント\]に入ると、「プロアカウントに切り替える」とあるので選択します。
適切なカテゴリを選択します。
完了します。
プロアカウントに切り替えるか、と聞いてくるので、「OK」にします。
ビジネス、クリエイターのどちらかを選択します。
連絡先登録は今はスキップします。
Facebookにログインと出れば、完了です。スキップしてもログインしてもOKです。次はPCから作業します。
Facebookページ作成とInstagramアカウントを連携
個人のFacebookアカウントからページ作成をします。
以下はもう連携済みですが、ページの設定の
\[Instagram\]からInstagram連携をします。
アプリ作成
Facebook for Developerにアクセスして、アプリを作成します。
以下を入力します。
アプリを作成すると以下画面が出るので、InstagramグラフAPIを選びます。
アクセストークン発行①(有効期限1時間)
同じくFacebook for Developerにて、ツールよりグラフAPIエクスプローラを選択します。
アクセス許可に pages_show_list business_management instagram_basic instagram_manage_insights instagram_manage_comments instagram_content_publish public_profile を選択して、「Generate Access Token」にてトークンを取得します。
これが【第1アクセストークン】です。
アクセストークン発行②(有効期限2ヶ月)
ツールからアクセストークンデバッガーを選択します。
先ほど取得した、【第1アクセストークン】を入力して「デバック」をクリックします。
以下のように表示されるので、「アクセストークンの延長」をクリックします。
以下が表示されたら、「デバック」をクリックします。
パスワードを求められます。
その後表示されたページ上に【第2アクセストークン】があります。
アクセストークン発行③(無期限)
グラフAPIエクスプローラに戻って、【第2アクセストークン】を入力します。GETのURLに「me/accounts」と入力して「送信」をクリックします。dataのaccess_tokenが【第3アクセストークン】です。
無期限である事を確かめるには、アクセストークンデバッガーから【第3アクセストークン】を入力してデバッグします。
グラフAPIエクスプローラに戻って、【第3アクセストークン】を入力します。GETのURLに「me?fields=accounts{instagram_business_account}」と入力して「送信」をクリックします。エラーになります。。
本来はここで終わりのはずですが、、なぜかエラーになるのでもう少し頑張ります。
アクセストークン発行④(③エラー対応)
アクセストークンデバッガーで【第2アクセストークン】を入力してデバッグします。すると、なんという事でしょう。無期限トークンになっています。意味がわかりません。
というわけで、グラフAPIエクスプローラに戻って、【第2アクセストークン】を入力します。GETのURLに「me?fields=accounts{instagram_business_account}」と入力して「送信」をクリックします。
これで【ビジネスアカウントID】も取得できました。
最後に以下をブラウザにて入力して結果が返ってこれば終了です。【XXXX】の部分を書き換えてください。【】は不要です。
https://graph.facebook.com/v10.0/【ビジネスアカウントID】?fields=name%2Cmedia.limit(10)%7Bcaption%2Clike_count%2Cmedia_url%2Cpermalink%2Ctimestamp%2Cusername%7D&access_token=【第2アクセストークン】