인스타그램 access_token 질문입니다. 채택완료
kujira
8년 전
조회 2,328
인스타그램의 사진들을 저희 사이트에서 노출시키고 싶어 api를 이용하려고 하는데요
현제 진행상황은 사진 불러오는것까지 잘 되고있습니다.
페이지를 열면 엑세스토큰을 발급받아야 되는데 그게 안되는것 같습니다.
일단 제가 만든 소스는 이렇습니다.
뭐가 문제일까요;;;;
</p><p><?</p><p> $curl = curl_init("<a href="<a href="https://api.instagram.com/oauth/access_token" target="_blank" rel="noopener noreferrer">https://api.instagram.com/oauth/access_token</a>"><a href="https://api.instagram.com/oauth/access_token" target="_blank" rel="noopener noreferrer">https://api.instagram.com/oauth/access_token</a></a>"); </p><p> curl_setopt($curl,CURLOPT_POST,true); </p><p> curl_setopt($curl,CURLOPT_POSTFIELDS,array(</p><p> 'client_id' => '',</p><p> 'client_secret' => '',</p><p> 'grant_type' => 'authorization_code',</p><p> 'redirect_uri' => '<a href="<a href="http://www.thewedd.com/include/aass.htm" target="_blank" rel="noopener noreferrer">http://www.thewedd.com/include/aass.htm</a>"><a href="http://www.thewedd.com/include/aass.htm" target="_blank" rel="noopener noreferrer">http://www.thewedd.com/include/aass.htm</a></a>',</p><p> 'code' => $_GET['code']</p><p> )); </p><p> curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1); </p><p> curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);</p><p> $result = curl_exec($curl);</p><p> curl_close($curl);</p><p>
</p><p> $result = json_decode($result,true);</p><p> </p><p> print_r( $result[access_token] );</p><p> </p><p> ?></p><p><html></p><p><span style="white-space:pre"> </span><head><span style="white-space:pre"> </span></p><p><span style="white-space:pre"> </span><meta http-equiv="Content-Type" conent="text/html"; charset="euc-kr"></p><p><span style="white-space:pre"> </span><title>.</title></p><p><span style="white-space:pre"> </span><style type="text/css"> </p><p><span style="white-space:pre"> </span>#instaPics { </p><p><span style="white-space:pre"> </span> max-width: 1100px; </p><p><span style="white-space:pre"> </span> overflow: hidden; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span>img {width:181px;height:181px}</p><p><span style="white-space:pre"> </span>.insta-box { </p><p><span style="white-space:pre"> </span> position: relative; </p><p><span style="white-space:pre"> </span> width: 181px; </p><p><span style="white-space:pre"> </span> height: 181px; </p><p><span style="white-space:pre"> </span> float: left; </p><p><span style="white-space:pre"> </span> margin: 2px; </p><p><span style="white-space:pre"> </span> border: none; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span>.image-layer { </p><p><span style="white-space:pre"> </span> overflow: hidden; </p><p><span style="white-space:pre"> </span> width: 100%; </p><p><span style="white-space:pre"> </span> height: 100%; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span>.image-layer img { </p><p><span style="white-space:pre"> </span> max-width: 100%; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span>.caption-layer { </p><p><span style="white-space:pre"> </span> display: none; </p><p><span style="white-space:pre"> </span> position: absolute; </p><p><span style="white-space:pre"> </span> top: 0; </p><p><span style="white-space:pre"> </span> background: rgba(255,255,255,0.8); </p><p><span style="white-space:pre"> </span> height: 100%; </p><p><span style="white-space:pre"> </span> width: 100%; </p><p><span style="white-space:pre"> </span> padding: 10px; </p><p><span style="white-space:pre"> </span> box-sizing: border-box; </p><p><span style="white-space:pre"> </span> font-size: 9px; </p><p><span style="white-space:pre"> </span> color: #333; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span>.insta-likes { </p><p><span style="white-space:pre"> </span> float: right; </p><p><span style="white-space:pre"> </span>} </p><p><span style="white-space:pre"> </span></style> </p><p><span style="white-space:pre"> </span><script src='//code.jquery.com/jquery-1.11.0.min.js'></script></p><p><span style="white-space:pre"> </span><script type="text/javascript"> </p><p><span style="white-space:pre"> </span> jQuery(function($) { </p><p><span style="white-space:pre"> </span> var tocken = "<?=$result[access_token]?>"; <span style="white-space:pre"> </span></p><p><span style="white-space:pre"> </span> var count = "30"; </p><p><span style="white-space:pre"> </span> $.ajax({ </p><p><span style="white-space:pre"> </span> type: "GET", </p><p><span style="white-space:pre"> </span> dataType: "jsonp", </p><p><span style="white-space:pre"> </span> cache: false, </p><p><span style="white-space:pre"> </span> url: "<a href="<a href="https://api.instagram.com/v1/users/self/media/recent/?access_token=" target="_blank" rel="noopener noreferrer">https://api.instagram.com/v1/users/self/media/recent/?access_token=</a>"><a href="https://api.instagram.com/v1/users/self/media/recent/?access_token=" target="_blank" rel="noopener noreferrer">https://api.instagram.com/v1/users/self/media/recent/?access_token=</a></a>" + tocken + "&count=" + count, success: function(response) { </p><p><span style="white-space:pre"> </span> if ( response.data.length > 0 ) { </p><p><span style="white-space:pre"> </span> for(var i = 0; i < response.data.length; i++) { </p><p><span style="white-space:pre"> </span> var insta = '<div class="insta-box">'; </p><p><span style="white-space:pre"> </span> insta += "<a target='_blank' href='" + response.data[i].link + "'>"; </p><p><span style="white-space:pre"> </span> insta += "<div class'image-layer'>"; </p><p><span style="white-space:pre"> </span> //insta += "<img src='" + response.data[i].images.thumbnail.url + "'>"; </p><p><span style="white-space:pre"> </span> insta += '<img src="' + response.data[i].images.thumbnail.url + '">'; </p><p><span style="white-space:pre"> </span> insta += "</div>"; </p><p><span style="white-space:pre"> </span> //console.log(response.data[i].caption.text); </p><p><span style="white-space:pre"> </span> if ( response.data[i].caption !== null ) { </p><p><span style="white-space:pre"> </span> insta += "<div class='caption-layer'>"; </p><p><span style="white-space:pre"> </span> if ( response.data[i].caption.text.length > 0 ) { </p><p><span style="white-space:pre"> </span>insta += "<p class='insta-caption'>" + response.data[i].caption.text + "</p>" //내용</p><p><span style="white-space:pre"> </span> } </p><p><span style="white-space:pre"> </span> insta += "<span class='insta-likes'>" + response.data[i].comments.count + "댓글 " + response.data[i].likes.count + " Likes</span>"; //comment=댓글, likes=좋아요</p><p><span style="white-space:pre"> </span> insta += "</div>"; </p><p><span style="white-space:pre"> </span> } </p><p><span style="white-space:pre"> </span> insta += "</a>"; </p><p><span style="white-space:pre"> </span> insta += "</div>"; </p><p><span style="white-space:pre"> </span> $("#instaPics").append(insta); </p><p><span style="white-space:pre"> </span> } </p><p><span style="white-space:pre"> </span> } </p><p><span style="white-space:pre"> </span> $(".insta-box").hover(function(){ </p><p><span style="white-space:pre"> </span> $(this).find(".caption-layer").css({"backbround" : "rgba(255,255,255,0.7)", "display":"block"}); </p><p><span style="white-space:pre"> </span> }, function(){ </p><p><span style="white-space:pre"> </span> $(this).find(".caption-layer").css({"display":"none"}); </p><p><span style="white-space:pre"> </span> }); </p><p><span style="white-space:pre"> </span> } </p><p><span style="white-space:pre"> </span>}); </p><p><span style="white-space:pre"> </span>}); </p><p><span style="white-space:pre"> </span></script> </p><p><span style="white-space:pre"> </span></head></p><p><span style="white-space:pre"> </span><body></p><p><span style="white-space:pre"> </span><div id="instaPics"></div></p><p><span style="white-space:pre"> </span></body></p><p></html></p><p>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
답변을 작성하려면 로그인이 필요합니다.
로그인