refirio.org

Memo

メモ > 技術 > サービス: Instagram
既存ユーザ名の取得
Instagram API について事前調査
Instagram API の使用例
Facebookページとの連携
ショップの開設
戻る
■既存ユーザ名の取得

例えば example というユーザ名を取得済みで、これを別のアカウントで使用したい場合、

1. 移行元のユーザ名を「example_」に変更
2. 移行先のユーザ名を「example」に変更

とすればいい
変更は、「設定 → プロフィール編集」で行える

ただし、「example_」に変更しても「このユーザーネームは使用できません。」のエラーになった
以下でも触れられているように、変更直後は取得できない

インスタグラムでユーザーネーム（ID）を変更する方法 | knowl
https://knowl.jp/instagram-how-to-change-user-name

Instagramのユーザーネーム変更画面には、以下のように表示されている

ほとんどの場合、14日間はユーザー名をfacehalo_japanに戻すことができます。詳しくはこちら


「詳しくはこちら」のリンク先は以下

Instagramのユーザーネームを以前使用していた名前に変更できますか。 | Instagramヘルプセンター
https://help.instagram.com/876876079327341以下の条件を満たせば、ほとんどの場合、Instagramのユーザーネームを以前使用していた名前に戻すことができます。

・そのユーザーネームがInstagramの新しい利用者によって取得されていない。
・あなたが所有していないアクティブなInstagramアカウントからそのユーザーネームが最近削除されていない。


実際に試すと確かに14日間は「このユーザーネームは使用できません。」のエラーが続き、
その間ユーザ側の表示は「このページはご利用いただけません。」となった
14日を過ぎると、別のアカウントからユーザ名を取得できた

上記のとおりアカウントを表示できなくなる期間が長いので、
運用中アカウントのユーザ名の取得はあまり現実的ではない

■Instagram API について事前調査
■APIの廃止

Instagram API は2020年の初頭には使えなくなるらしい

Instagram API仕様変更・終了・廃止関連の情報まとめ。インスタの写真をWebサイトで直接表示していた方は要注意！ | Arrown
https://arrown-blog.com/instagram-api-policy-changed/

その後もInstagramからデータを取得したければ、Instagram Graph API を使う必要があるらしい
Graph API を使うにはInstagramのアカウントをビジネスアカウントにする必要があるらしい
また、ビジネスアカウントにするためにはFacebookアカウントと連携させる必要があるらしい（InstagramはFacebookに買収されている）

Instagram Graph APIの基本的な使い方・Webサイトにインスタの写真を埋め込みする方法 | Arrown
https://arrown-blog.com/instagram-graph-api/

Instagramをビジネスアカウントに変更する方法。Instagram Graph APIを使用するなら必見！ | Arrown
https://arrown-blog.com/instagram-business-account/

「Instagram API」が廃止に！代替の「Instagram Graph API」に移行しよう！ | Simple Web Design | Analog Studio
https://web.analogstd.com/tips/posts/api/instagram-grapgh-api-facebook.php■2020年7月に確認した内容

開発者ページには以下が案内されていた

Instagram Developer Documentation
https://www.instagram.com/developer/

・Instagram Legacy API は2020年6月29日に無効化され、APIを利用できなくなった
・代わりにInstagram Basic Display APIとInstagram Graph APIに頼る必要がある
・必要なパーミッションについては、App Reviewプロセスを通じて承認を申請する必要がある

恐らく

・Facebookページを作成
・Instagramビジネスアカウントを取得
・FacebookページとInstagramアカウントを接続
・Facebook管理者ツールでFacebookアプリを作成
・API用のアクセストークンを取得
・有効期限無制限のアクセストークンを取得
・InstagramのAPIを使えるようになるので、プログラムの作成を行う

という手順が必要だと思われる

Instagram Graph APIの使い方とサイトに埋め込む方法 v5.0対応【2020年3月最新版】 | 西尾市・岡崎市・名古屋のホームページ制作はネイビーモバイル
https://navymobile.co.jp/instagram-graph-api

InstagramAPIからInstagram Basic Display APIへの移行 - Qiita
https://qiita.com/harapeko_momiji/items/446ab28c4f5c937d0962■2022年10月に確認した内容

ゼロから始めるInstagram Graph API Ver12.0 2022年版 - dtn.jp運営ブログ
https://blog.dtn.jp/2022/02/02/instagram-graph-api-ver12/

Instagram Graph APIを使い、ハッシュタグ検索と投稿データ取得をしてみた - dtn.jp運営ブログ
https://blog.dtn.jp/2022/02/03/trending-instagram-graph-api/

【インスタグラムAPI 2022】Instagram基本表示APIを使って投稿画像を取得して表示する・サイトに埋め込む・自動更新の設定方法【JavaScript】 | QooTechWEB
https://engineering.webstudio168.jp/2022/02/2022-instagram-api-js/

【2021最新】インスタグラムの埋め込み方法は？ツールや注意点について解説｜ECのミカタのニュース記事です
https://ecnomikata.com/ecnews/32961/

InstagramグラフAPIでハッシュタグやアカウント名を指定して投稿の取得。 | memo メモ [AG2WORKS]
https://memo.ag2works.tokyo/post-837/
> InstagramグラフAPIが提供する、自分以外のビジネスアカウントとクリエーターアカウントの情報取得ができる
> Business Discoveryの機能を使ってJSONデータを取得する。
> (取得できるのはビジネスアカウントかクリエイターアカウントになっているユーザーの投稿のみ。)

以下、廃止が発表される前に調べた内容

■自身のアカウントの写真を表示させるだけの場合

自身のアカウントの写真を表示させるだけ…ならサンドボックスモードが使えて、これなら審査は不要
できることは以下に限られる

・取得可能なのは、作成アプリケーションに対してユーザー登録したユーザーの最新の20投稿のデータ
  （タグで絞り込む場合「最新20件の中の特定のタグがついた画像」となる）
・1つのアプリにユーザー登録することができるのは最大10人まで
・データを呼び出せるのは1時間に500回まで

Instagram APIを使ってインスタグラムの画像をウェブサイト上に表示する | 株式会社チップディップ
https://www.tipdip.jp/tips_posts/production/1928/

Instagram APIを使ってWEBサイトに写真を表示させてみよう｜株式会社カポタスト
https://capotast.co.jp/article/detail/21/

Instagram APIのJavascriptでの使い方とSandbox modeで出来る範囲（2016年5月現在） | あらかぜ手帖
http://arakaze.ready.jp/archives/3431■他ユーザの写真も表示させる場合

InstagramのAPIは審査が非常に厳しいことで有名
「審査を通してくれるなら10万円払います」という案件もあるくらい。らしい
簡易に扱うためのWebサービスもあるが、写真のリンク先がInstagramではなく、その会社のサービス…など落とし穴に注意
「Instagram対応できます」と簡単に言うとトラブルの可能性が非常に高いと思われる

以下、ざっと調べた事例

Instagram APIの審査を通した人に話を聞いてみた。 - SNS研
http://socialmedia-marketing.argyle.jp/instagram/instagramapi/

注意
「一回で通ることは本当に稀だと思います。アーガイルは3ヶ月で７回落ちました」
「APIの審査を通してくれたら１０万円というクラウドソーシングの案件を見かけましたが絶対に見合わない」

Instagramの画像をwebサイトに表示させる３つの方法
http://insta-antenna.com/method-picture-display

注意
「比較的低コストで使える2つのサービスを紹介します」
「前述のCAMPiNは月額2万円〜ですが、こちらは月額5万円〜で、オプションを追加することでtwitterの投稿も収集可能です。」

instagramのアカウントページをブログパーツとしてサイトに貼る方法「InstaWidget」
https://webmist.info/instagram-blogparts/

注意
「利用するにあたって留意しなくてはいけない事は、
  プロフィール写真や各写真をクリックした時に飛ぶページは instagram 公式ではなく InstaWidget のページであるという事です」

■Instagram API の使用例

※サンドボックスモードで自身のアカウントの写真を表示させる

■開発者登録https://www.instagram.com/developer/
「Register Your Application」から開発者登録

ウェブサイト: http://refirio.org/
Phone number: （自身の電話番号）
What do you want to build with the API?: Display Picture on my website.

「I accept the API Terms of Use and Brand Guidelines」にチェックを入れて「Sign up」

■クライアント（アプリケーション）登録

再度「Register Your Application」をクリックするとクライアントの管理ページへ移動する
「Register a New Client」からクライアントを登録する

Detailsタブ
Application Name: Display Pictures
Description: Display Picture on refirio.org
Website URL: http://refirio.org/
Valid redirect URIs: http://refirio.org/memos/instagram/picture/

Securityタブ
Disable implicit OAuth: （チェックを外す…が、それでいいのかは要調査）
Type the words above: （画像の文字を入力）

それぞれ入力して「Register」
以下のように、アプリケーションの情報が表示される

Display Pictures
CLIENT ID	xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
CLIENT STATUS	Sandbox Mode

「CLIENT ID」が発行されたことを確認する

■アクセストークンの取得

以下のURLにアクセスする
https://api.instagram.com/oauth/authorize/?client_id=【CLIENT ID】&redirect_uri=【Valid redirect URIs】&response_type=token
具体的には以下のようになる
https://api.instagram.com/oauth/authorize/?client_id=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx&redirect_uri...

This app is in sandbox mode and can only be authorized by sandbox users.
Hi _refirio, Display Pictures is requesting to do the following:
Access your basic informationYour media & profile info

と書かれたページに飛ぶので、「Authorize」をクリック

以下にリダイレクトされる。アクセストークンが取得される
http://refirio.org/memos/instagram/picture/#access_token=yyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

このトークンを使ってプログラムを作成する

■プログラム例（PHP）

最新の6件を表示する例（Instagramから取得する際に「&count=6」を付ければ、その時点で件数制限することもできる）

<?php

// アクセストークンからInstagramのデータをjsonで取得
$json = file_get_contents('https://api.instagram.com/v1/users/self/media/recent/?access_token=yyyyyyyyyyyyyyyyyyyyyyyyyyyyyy');
$json = mb_convert_encoding($json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN');

// JSONを配列に変換
$array = json_decode($json, true);

// 写真を表示
echo "<!DOCTYPE html>\n";
echo "<html>\n";
echo "<head>\n";
echo "<meta charset=\"utf-8\">\n";
echo "<title>Instagram</title>\n";
echo "</head>\n";
echo "<body>\n";
echo "<h1>Instagram</h1>\n";
echo "<p>\n";

$i = 0;
foreach ($array['data'] as $data) {
    echo "<a href=\"" . $data['link'] . "\" target=\"_blank\"><img src=\"" . $data['images']['thumbnail']['url'] . "\">\n";

    if (++$i >= 6) {
        break;
    }
}

echo "</p>\n";
echo "</body>\n";
echo "</html>\n";

exit;
■プログラム例（JavaScript）

Instagram APIを使ってみる | cly7796.net
http://cly7796.net/wp/javascript/try-using-the-instagram-api/<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
$(function() {
    $.ajax({
        url: 'https://api.instagram.com/v1/users/self/media/recent/?access_token=yyyyyyyyyyyyyyyyyyyyyyyyyyyyyy&count=6',
        dataType: 'jsonp',
        success: function(data) {
            var insert = '<ul>';
            for (var i = 0; i < data['data'].length; i++) {
                insert += '<li>';
                insert += '<a href="' + data['data'][i]['link'] + '" target="_blank">';
                insert += '<img src="' + data['data'][i]['images']['thumbnail']['url'] + '">';
                insert += '</a>';
                insert += '</li>';
            };
            insert += '</ul>';
            $('#instagram').append(insert);
        }
    });
});
</script>
<div id="instagram"></div>
■参考ページ

Instagram APIを使ってインスタグラムの画像をウェブサイト上に表示する | 株式会社チップディップ
https://www.tipdip.jp/tips_posts/production/1928/

注意
「Instagram APIのアクセストークンは有効期限を明確に指定していません。
  しかし、アクセストークンが永久に有効であると仮定しないでくださいという注意書きも行なっています。」

Wordpress & instagram API ハッシュタグで画像取得したいだけなのに…結局 Instagram Feed proが解決してくれた | それだよ
http://es.istgut.jp/web-tools/instagram-api.html

注意
「新API基準では、sandbox modeとやらで、取得できる画像が最新20件になったようです。
  これを特定のタグで絞り込んだら、「最新20件の中の特定のタグがついた画像」しか表示されないわけです。
  せめて、「特定のタグがついた最新20件」ならまだ救いはあったのに。」

■Facebookページとの連携

※未検証

Facebookとインスタグラムを一番簡単に連携できるおすすめの方法 - リスマガ【Web集客の教科書】
https://ppc-master.jp/labo/2019/02/fb_ig_link.html■ショップの開設

ざっと調べて出てきた概要
FacebookとInstgramのショップは内部的には同じもの？FacebookとInstgramのそれぞれにショップが表示されるようだが
また確認しておく

【保存版】Instagram「ShopNow（ショッピング機能）」を導入する設定方法を徹底解説 | Instagramラボ
https://www.sharecoto.co.jp/instagramlab/instagram_shopnow

Facebookショップとは？Facebook・Instgramのショッピング機能が大幅アップデート｜アナグラム株式会社
https://anagrams.jp/blog/what-is-facebook-shop/
Memo

Advertisement
