インスタをホームページに埋め込むために「Instagram Graph API」を使用して表示させる事に成功しました。
テストで画像・写真以外に「動画」と「IGTV(Instagram TV)」で投稿した所、その部分は表示されず空白になってしましました。
※IGTVとはインスタグラムの60分の動画を投稿できる機能です
インスタグラム「IGTV」とは? 特徴や使い方をまるっと解説
##試した事
html
1<script> 2 $(document).ready(function() { 3 $.ajax({ 4 type: 'GET', 5 url: 'https://your-server.jp/getInsta.php', //各自のサーバーを指定 6 dataType: 'jsonp', 7 success: function(json) { 8 // success 9 var j = json['media']['data']; 10 //console.log(j[0]['permalink']); 11 for (var i = 0; i < j.length; i++) { 12 $('#insta').append('<div class="card"><a href="' + j[i]['permalink'] + '" target="_blank"><img src="' + j[i]['media_url'] + '" alt="' + j[i]['caption'] + '" class="object_fit" ></a></div>'); 13 } 14 } 15 }); 16 }); 17</script>
php
1<?php 2$request_options = array( 3 'http' => array( 4 'method' => 'GET', 5 'header'=> "Authorization: Bearer XXXXXXXXXXXXX\r\n" 6 ) 7); 8$context = stream_context_create($request_options); 9$url = 'https://graph.facebook.com/v6.0/YYYYYYYYYYYYYY?fields=name,media.limit(10){caption,like_count,media_url,permalink,timestamp,username}'; 10$response_body = file_get_contents($url, false, $context); 11 12header( 'Content-Type: text/javascript; charset=utf-8' ); 13echo $_GET['callback'] . '(' . $response_body. ')';
XXXXXXXXXXXXXはアクセストークン。
YYYYYYYYYYYYYYはInstagramビジネスアカウントのID
##分からない事
「動画」と「IGTV(Instagram TV)」をInstagram Graph API経由で取得する方法
下記サイトを参考にしたのですが、理解できずに実装出来ない状態です。
Instagramの投稿に動画やIGTVが混ざっている時にAPIを使ってインスタのデータを表示したい場合の対処方法
どなたかこの解決方法を知っている方いらっしゃいましたらお教えください。
宜しくお願い致します。
【参考サイト】
・カラーミーショップにインスタ画像を埋め込む方法 (最新版)
あなたの回答
tips
プレビュー