今更ながらinstagramAPIの仕様変更への対応について備忘録
InstagramAPIの仕様変更前倒し
Facebook社の個人情報不正流出事件が原因!?
ゴールデンウィーク(2018年5月)を、どう過ごそうかと考えていた2018年4月中旬。ふと長らく更新していなかった自分のブログを確認すると、PCサイドバーに設置していた、Instagramの最新投稿が表示されなくなっていた…。
※この記事も5月くらいには書こうかと思っていたが、8月になってしまった。とりあえず備忘録として記事を投稿する。
WEBサイトに投稿を表示させるレベルの用途しかなかったのでSandbox mode で利用していたので、制限を超えるリクエストがあったのか?!と、一瞬…本当に一瞬だけ頭を過りましたが、ほとんど更新もしていなく、それ以前にアクセス数もなかったので、そんな訳はない。
2018年4月4日に発表されたinstagramAPIの仕様変更が原因だった。
以前からのアナウンスでは、2018年夏、冬に順次機能が利用できなくなるということでしたが、2018年3月のFacebook利用者の個人データが不正に第三者のデータ分析会社に流出したという事件が起こった影響だろう。
※ちなみに最初の報道では5000万人とされていましたが、8700万人に上る個人データが流出したとされている。
さて困った…。
とりあえずぐぐってみると、既に解決策がいろいろなサイトでアップされている!
やっぱり皆さん困っている…。というか、気付くのが遅かった。
SandBoxモードで他ユーザーの承認が得られれば、自分が管理しているWEBサイトで写真一覧等を表示することが可能でしたが、それが2018/4/4以降出来なくなったようです。
当サイトは自分のInstagramアカウントの画像をPCレイアウトのサイドバーに表示しているが、それが消えてしまったのは@のあとに続くユーザーネームで指定してしまっていたから!そこを、ユーザーIDに変更すれば大丈夫との事。
【Instagram APIアクセストークンの取り方】
Instagramのデベロッパーサイトにアクセスし、自身のinstagramのアカウントのIDパスワードでログイン。
【デベロッパーサイト】
https://www.instagram.com/developer/
①ログイン後、ページ最上部の『Manage Clients』をクリックする。
『Manage Clients』ページで移動したら、緑色の『Register a New Client』ボタンを押す。
下記のように各項目を入力。
まず、「Details」タブから。
Aplication Name : はなんでも結構ですが、アルファベットで入力。
例)hogehoge_instaapi など
Description : は説明部分になりますので、文字列を入力。
例)hogehoge_site instagram API など
Website URL : こちらは http://hogehoge.com/と入力。(最後の「/」スラッシュまで)
Valid redirect URL :URLの確認で、上記同様 、http://hogehoge.com/ と入力する。
私はロボットではありませんにチェックを入れる。
次に「Security」タブをクリック。
『Disable implicit OAuth』のチェックを外してください。
外したら「私はロボットではありません」にチェックが入っていることを確認して「Register」を押す。
入力が出来たらManage Clients が出来上がり、下記のように表示されます。
CLIENT ID は次の工程で利用しますのでコピーする。
https://www.instagram.com/oauth/authorize/?client_id=〇〇〇&redirect_uri=http://hogehoge.com/&response_type=token
?client_id=の後ろに先ほど取得したCLIENT IDを入れて、GooglechromeなどのウェブブラウザのURLバーに入力してアクセス。
緑色の『Authorize』ボタンを押せば、hogehoge.comサイトが表示、URL後ろに/token=12345678.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx とアドレスバーに表示されているはず。token=から先が大事な部分。
.(ドット)の前の「12345678」部分が自身のユーザーIDになる。
参考にしたサイト
Instagram API仕様変更・終了・廃止関連の情報まとめ。インスタの写真をWebサイトで直接表示していた方は要注意!
大変参考になりましたm(_ _)m
WordPress タイトルの下に注意事項(コメント)を挿入するアクションフック