

STAFF BLOG
Instagram Graph APIを使ってインスタグラムの投稿画像をWebサイトに埋め込む方法1

2020年7月以降、instagramの旧APIが廃止され、新しく、Instagram Graph APIに置き換わりました。
今回は、Instagram Graph APIを使ってWEBサイトに、インスタグラムの投稿画像を表示するために必要な、アクセストークンの取得方法と、InstagramビジネスアカウントIDの取得方法をご説明します。
1.事前準備
-ご用意いただくもの-
- Facebookアカウント
- Instagramアカウント
- Instagramのスマートフォンアプリ
2.Instagramのアカウントをビジネスアカウントに切り替え
スマートフォンアプリから、Instagramのアカウントを、プロアカウントに切り替えます。(おそらくPCではできなかったです)
- メニューより「設定」→「アカウント」→「プロアカウントに切り替える」を選択
- 「クリエイター」または「ビジネス」どちらかを選択
3.InstagramアカウントとFacebookページを紐付けする
Facebookページを開く(ない場合は新規作成)。
その作成したFacebookページより「設定」→「Instagram」→「アカウントをリンク」

4.Facebookアプリを作成する
https://developers.facebook.com/
「マイアプリ」→「アプリの作成」→「ビジネス統合の管理」にてInstagramを追加。

5.アクセストークンを取得する(1回目)
下記を確認し、「Generate Access Token」をクリック
- Facebookアプリ→4で作成したFacebookアプリ名
- ユーザまたはページ→ユーザトークン
- アクセス許可→
- pages_show_list
- business_management
- instagram_basic
- pages_read_engagement pages_manage_posts
「以下のアクセス許可に、Facebookでは使用が許可されていないものがあります。」が別窓で表示されたらOKを押す。アクセストークンをメモする。(アクセストークン1とする)
6.アクセストークンを取得する(2回目)
4で作成したFacebookアプリを開き、設定→ベーシックをクリック
記載の、「アプリID」「app secret」をメモする。

先ほどの「アプリID」「app secret」、5で作成した「アクセストークン」を使い、 下記にアクセスする。
access_tokenが表示されるのでメモする。(アクセストークン2とする)
https://graph.facebook.com/v6.0/oauth/access_token?grant_type=fb_exchange_token&client_id=[アプリidをコピペ]&client_secret=[app secretをコピペ]&fb_exchange_token=[アクセストークン1をコピペ]
メモしたアクセストークンを使い、 下記にアクセスする。
https://graph.facebook.com/v6.0/me?access_token=[アクセストークン2をコピペ]
するとJSON形式でIDが表示されるので、そのIDをメモする。
7.アクセストークンを取得する(3回目)
https://graph.facebook.com/v6.0/[6で取得したidをコピペ]/accounts?access_token=[6で取得したアクセストークン2をコピペ]
下記のJSONが表示されるので、記載の access_tokenをメモする。(アクセストークン3とする)

8.InstagramビジネスアカウントIDを確認する
https://developers.facebook.com/tools/explorer/ に再度アクセス。 上の入力窓にme?fields=accounts{instagram_business_account,name}をコピペして送信ボタンをクリック。
{
"instagram_business_account": {
"id": "ここの文字列をコピーする"
},
"name": "",
"id": ""
},
CATEGORY
関連記事
2021.01.10 動画制作
After Effectsでアニメーションをループさせる
2021.01.10 動画制作
Premiere Proでぼかしをトラッキングする
2021.01.10 動画制作
Premiere Proで作成した映像をMedia Encoderで書き出すとLUTが反映されていない時の解決方法
2021.01.10 動画制作
Premiere Proでモーションブラーをかける
2021.01.10 動画制作
Premiere ProにLUTを追加する
2020.11.25 PHPプログラム
Instagram Graph APIを使ってインスタグラムの投稿画像をWebサイトに埋め込む方法1