테스트 사이트 - 개발 중인 베타 버전입니다

인스타그램 가져오기

· 1년 전 · 1987 · 4

인스타그램 피드 가져오기 구현하다가 여기 저기 코드를 보고 참고하여 짜집기 형식으로 만들었습니다.

더 좋은 코드와 깔끔한 코드가 있으면 해당 코드가 좋습니다. 

구현하다 보니 깔끔하지는 않습니다.

 

팁게시판이나 q&a 게시판에도 자세한 사항이 없어서 찾아보고 구현하면서 알아낸것을 올립니다.

 

1. 인스타그램 토큰은 장기토큰도 최대 3개월(주기적 갱신 필요)

2. 1달마다 날짜를 계산하여 그누보드 환경설정 여분필드에 토큰 및 날짜 저장

3. 그누보드 환경설정 여분필드 1값에는 토큰값/여분필드 2값에는 날짜 값 초기 저장

4. 1달마다 오늘 날짜 비교 후 자동 갱신

 

 <style type="text/css">
    #instafeed-container {width:1200px;margin:0 auto;height:620px;overflow:hidden; margin-bottom:50px;}
    #instafeed-container a img{ border:#ddd solid 1px;border-radius:4px;width: 23.3%; height:300px; margin:5px;}
    .inst_tit {width:1200px;margin:0 auto;text-align:center;padding:10px 0 5px 0;font-size:26px;color:#b10f0f;font-weight:500;}
    .is_tt {width:1200px;margin:0 auto;text-align:center;font-size:18px;margin-bottom:20px;}

    @media (max-width: 991px) {
        #instafeed-container {width:100%;margin:0 auto;height:320px;overflow:hidden; margin-bottom:50px;}
        #instafeed-container a img{ border:#ddd solid 1px;width: 22%; height:150px; border-radius:3px;margin:5px;}
        .inst_tit {width:100%;margin:0 auto;text-align:center;padding:20px 0 0px 0;font-size:24px;color:#b10f0f;font-weight:500;}
        .is_tt {width:100%;margin:0 auto;text-align:center;font-size:17px;margin-bottom:20px;}        
    }
</style>

 

 

 

 

<div id="instafeed-container"></div>

<script src="https://cdn.jsdelivr.net/gh/stevenschobert/instafeed.js@2.0.0rc1/src/instafeed.min.js"></script>
<script type="text/javascript">
    
/*관리자화면 여분필드1값에 토큰값 먼저 넣어야 합니다.*/    
var token = "<?php echo $config['cf_1'] ?>";

var userFeed = new Instafeed({
    get:'user',
    target: "instafeed-container",
    resolution: 'low_resolution',
    accessToken: token
});
userFeed.run();
    

    
/*관리자화면 여분필드2값에 날짜값 먼저 넣어야 합니다.*/ 
<?php
    $today = date("Y-m-d");
    $one_date = date("Y-m-d", strtotime("+1 months", strtotime($config['cf_2'])));   
    $ins_token = '';
    
    if($one_date<$today) {
        
        /*error_reporting(E_ALL);
        ini_set('display_errors', '1');*/
        
        
        
        $url = "https://graph.instagram.com/refresh_access_token?grant_type=ig_refresh_token&access_token=".$config['cf_1'];
        
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 3);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $response = curl_exec($ch);
        curl_close($ch);
        
        $res = json_decode($response);
        $ins_token = $res->access_token;
        
        $inskey_update_query = "UPDATE g5_config set cf_1 = '{$ins_token}', cf_2 = '{$today}' ";
        sql_query($inskey_update_query);   
    }

?>

 

참고링크

https://sunny13.tistory.com/21
https://blog.naver.com/mikong22/221498829280
https://sir.kr/g5_tip/15369
https://roundfigure.tistory.com/36
https://developers.facebook.com/docs/instagram-basic-display-api/guides/long-lived-access-tokens?locale=ko_KR

https://www.youtube.com/watch?v=vPmB0ol-TS4&t=226s

https://gnustudy.com/bbs/board.php?bo_table=gnu_tip&wr_id=212

 

 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 4개

공유 감사드립니다!

감사합니다.

좋은 정보 감사합니다. 꼭 활용해볼께요.

감사합니다.

게시글 목록

번호 제목
24318
24317
24315
24309
24294
24293
24277
24262
24260
24253
24251
24236
24233
24228
24226
24221
24214
24203
24201
24199
24196
24195
24194
24192
24191
24187
24185
24183
24172
24168