【2022年最新】instagram基本表示APIの申請方法について図解!

プログラミング

どうもイトサル(@itosaru)です。

instagram基本表示APIを使ってみたいです。
それにあたってどのように申請すればいいのか教えてください。

この記事ではinstagram基本表示APIの申請手順について画像を踏まえて説明していきます。

なお、この記事のゴールはAPIを実行するうえで必要なAccess Tokenを発行することまでです。


申請に必要なもの

instagram基本表示APIの申請をするにあたって必要なものが3つあります。

  • Facebookアカウント
  • instagramアカウント
  • Facebook(Meta)の開発者登録

Facebookの開発者登録はこちらの記事を参考に実施してください。

【2022年最新】Facebook(Meta)開発者の登録方法を図解!
Facebookに関するアプリの開発やinstagramのAPIを利用するためにFacebook(Meta)の開発者登録をする必要があります。この記事ではその開発者登録の手順について画像を踏まえて説明します。

申請の手順

ここかはらinstagram基本表示APIを使う上で必要な手順について説明していきます。

なお申請手順は結構長く、そして複雑です。

途中で飽きたらいったん休憩しつつ進めていきましょう。

Meta for Developerでアプリを作成する

まずはMeta for Developerでアプリを作成します。

》Meta for Developer

なお、アプリを作成するにあたって事前に開発者登録が必要です。

開発者登録が済んでいない場合はこちらの記事を参考に開発者登録をしましょう。

【2022年最新】Facebook(Meta)開発者の登録方法を図解!
Facebookに関するアプリの開発やinstagramのAPIを利用するためにFacebook(Meta)の開発者登録をする必要があります。この記事ではその開発者登録の手順について画像を踏まえて説明します。

1.画面右上の[マイアプリ]をクリックします。

2.[アプリを作成]をクリックします。

3.アプリタイプを選択で「生産者」を選択して[次へ]をクリックします。

4.アプリの表示名を入力して[アプリを作成]をクリックします。

5.Facebookアカウントのパスワードの入力がもとめられます。パスワードを入力して[送信]をクリックします。

パスワードの認証が通ればアプリの作成は完了です。続いてアプリの設定を行いましょう。

アプリの設定をする

1.作成したアプリ画面の「instagram Basic Display」の[追加]をクリックします。

2.画面下に「アプリの設定を更新してください。」のメッセージが表示されます。「設定」の文字がリンクになっているのでクリックします。

3.設定画面が表示されます。プライバシーポリシーのURLとユーザーデータ削除にそれぞれ情報を入力しましょう。

イトサル
イトサル

私はユーザーデータ削除のURLは特別用意していなかったので、ひとまずプライバシーポリシーのURLを記載しました。

4.画面を下にスクロールすると[+プラットフォームを追加]が表示されるのでクリックします。

5.プラットフォーム選択画面が表示されます。今回は「Website」だけ選択して[次へ]をクリックします。

6.するとウェブサイトの項目が表示されます。サイトURLを入力して[変更を保存]をクリックします。

クリックすると画面右上に一瞬だけ「変更を保存しました」という内容のメッセージが表示されます。そのメッセージが表示されたら設定は完了です。続いてinstagram基本APIの追加手順を行いましょう。

アプリにinstagram基本表示APIを追加する

1.画面左のメニューからをクリックします。

2.下に表示される「Basic Display」をクリックします。

3.[Create New App]をクリックします。

4.アプリの表示名を入力して[アプリを作成]をクリックします。

5.instagram基本表示APIが追加されるとinstagramアプリIDなどが表示される画面が表示されます。

ここに表示された「instagramアプリID」と「instagram App Secret」は後で使用するのでメモ帳などに控えておきましょう。

そのまま画面を下にスクロールしましょう。

6.「クライアントOAuth設定」、「承認を取り消す」、「データの削除リクエスト」の項目が表示されます。それぞれURLを入力して[変更を保存]をクリックします。

イトサル
イトサル

何を入力すればいいんだろうと迷うと思いますが、

現時点ではすべて自分のサイトURLでよさそうです。

公式サイトにこのような記載がありました。

「https://developers.facebook.com/docs/instagram-basic-display-api/getting-started」より抜粋

保存が完了したらinstagram基本APIの追加は完了です。引き続きテストユーザーを追加する手順を行いましょう。

テストユーザー(instagramアカウント)を追加する

続いてinstagram基本APIを実行するためのテストユーザーをアプリに追加しましょう。

ここで言うテストユーザーとはinstagramで登録しているアカウントのことを指します。

1.画面左メニューから「役割」をクリックします。

2.さらに下に表示される「役割」をクリックします。

3.画面下のほうにあるをクリックします。

4.テスターを追加する子画面が表示されます。自分のinstagramのユーザー名を追加します。

5.入力したユーザーのアカウント情報が表示されます。問題なければ[送信]をクリックします。

6.instagramテスターに先ほど入力したimstagramアカウントが表示されれば完了です。続いてinstagramで操作を行います。

instagramでテストの承認する

テスターの追加が完了したら、instagramのページを開きます。

》instagram公式ページ

instagramを開いたらプロフィール編集画面を開きましょう。

1.画面左メニューの「アプリとウェブサイト」をクリックします。

2.「テスターへのご招待」をクリックします。

3.テスター追加で送信したアプリ名の申請が表示されます。[承認する]をクリックします。

4.承認した年月日が表示されればinstagramでの承認作業は完了です。

Access Tokenを発行するために必要なコードのURLを作成・リクエストする

いよいよ手順も終盤です。

ただここから少し複雑なことをするのでしっかり内容を見て作業してください。

ここからはinstagram基本APIを使用するために必要なtoken(認証キーのようなもの)を作成します。

instagmram基本表示APIではAccess Tokenを発行する前段階として発行用のコードが必要です。

この手順ではその発行用コードを作成する手順について説明します。

1.発行用のコードを作成するためのURLを作成します。

作成するといっても下記のURLの一部を書き換えるだけでOKです。

https://api.instagram.com/oauth/authorize?client_id={app-id}&redirect_uri={redirect-uri}&scope=user_profile,user_media&response_type=code

太字にした{app-id}と[redirect-uri}を書き換えます。

  • app-id:「アプリにinstagram基本表示APIを追加する」手順5で表示されたinstagramアプリID
  • redirect-uri:「アプリにinstagram基本表示APIを追加する」手順6で入力した「クライアントOAuth設定」のURL

書き換えるとこんなイメージになります。

https://api.instagram.com/oauth/authorize?client_id=123456789012345&redirect_uri=https://itosaru.com/&scope=user_profile,user_media&response_type=code

2.書き換えたらコピーしてブラウザに貼り付けて[Enter]キーを押しましょう。
するとinstagramの認証ページが表示されます。[許可する]をクリックします。

3.[許可する]をクリックすると書き換えたredirect_uriのページが開きます。
そうしたらアドレスバーを見てみましょう。おそらくこんな感じになってると思います。

アドレスの後ろに?がついてcode=なんちゃらかんちゃらとついていますね。

code=の後に続く文字列がAccess Token発行に必要なコードです。

必要なコードだけコピーしても良いですがアドレスをコピーして先頭のURLを削ってもいいでしょう。

このコードを控えたらページを閉じてしまっても大丈夫です。

最後にtokenを発行する手順を実施します。

Access Tokenを発行する

最後に今まで控えておいた情報を使ってAccess Tokenを発行します。

Access Tokenの発行で使うものは使っているPCのOSによって異なります。

  • windowsの場合:コマンドプロンプト
  • macの場合:ターミナル

私はwindowsを使っているのでコマンドプロンプトを使用します。

1.最初にtokenを発行するためのコマンドを作成します。

イトサル
イトサル

「またよくわかんないやつ作るのかよ・・・」

と思うかもしれませんが、これが最後なので頑張ってください。

テンプレートはこちらです。

curl -X POST \ https://api.instagram.com/oauth/access_token \ -F client_id={app-id} \ -F client_secret={app-secret} \ -F grant_type=authorization_code \ -F redirect_uri={redirect-uri} \ -F code={code}

先ほどのコード作成のときと同じように太字にしたものをそれぞれ書き換えます。

  • app-id:「アプリにinstagram基本表示APIを追加する」手順5で表示されたinstagramアプリID
  • app-secret:「アプリにinstagram基本表示APIを追加する」手順5で表示されたinstagram App Secret([表示]をクリックすると確認できます)
  • redirect-uri:redirect-uri:「アプリにinstagram基本表示APIを追加する」手順6で入力した「クライアントOAuth設定」のURL
  • code:token発行用の文字列

書き換えたイメージはこちらです。

curl -X POST \ https://api.instagram.com/oauth/access_token \ -F client_id=123456789012345 \ -F client_secret=eb8c7xxxxxx \ -F grant_type=authorization_code \ -F redirect_uri=https://itosaru.com/ \ -F code=AQDp3TtBQQxxxxxx

このコマンドができたらコピーしましょう。

2.コマンドプロンプトを起動します。コマンドプロンプトはwindowの検索で「cmd」と打つと表示されます。

3.起動したら先ほどコピーしたコマンドを貼り付けて[Enter]キーを押しましょう。

するとこんな感じのものが表示されると思います。

ここに表示されたacceess_token、user_idがinstagram基本APIを使う上で必要なキー情報です。

それぞれをコピーしてメモ帳などに控えておきましょう。

これでinstagram基本APIを使う上で必要な申請手順はすべて完了です。

終わりに

この記事ではinstagram基本表示APIを使うにあたっての申請手順について説明しました。

コードの作成などの手順は公式スタートガイドのほうが分かりやすいかと思うので、必要に応じで手順を進めていきましょう。

ブラウザーをアップデートしてください | Facebook


コメント

タイトルとURLをコピーしました