0

Instagram APIはAPI呼び出しごとに35枚の画像を制限しているため、選択したInstagramの写真をハッシュタグでアルバムに表示するプロジェクトに取り組んでいます.AJAX（私は非常に苦手です）を使用するか、PHPとAJAX。ギャラリーのコードでアクセス トークンとユーザー ID を使用できるようにしたくないため、後者を選択しました。

    <?PHP
function jsongram($next=null){
    $userid = "xxx";
    $accessToken = "xxx";
    $url = ("https://api.instagram.com/v1/users/{$userid}/media/recent/?access_token={$accessToken}");

    if($url !== null) {
        $url .= '&max_id=' . $next;
    }

    //Also Perhaps you should cache the results as the instagram API is slow
    $cache = './'.sha1($url).'.json';
    //unlink($cache); // Clear the cache file if needed

    if(file_exists($cache) && filemtime($cache) > time() - 60*60){
        // If a cache file exists, and it is newer than 1 hour, use it
        $jsonData = json_decode(file_get_contents($cache));
    }else{
        $jsonData = json_decode((file_get_contents($url)));
        file_put_contents($cache,json_encode($jsonData));
    }


   ?>

<html>
<head>
</head>
<body>

<?php
    $data_array = array(); 
    foreach ($jsonData->data as $data){
      if (stripos($data->caption->text,'egypt') === false) {
      }
      else{
        $data_array[] = $data;
        $data = (str_split($data->caption->text)); 
        $data = (array_filter($data));  

      }
    }
    foreach ($data_array as $data):{
    $igimglow = $data->images->low_resolution->url;
    $igimgstd = $data->images->standard_resolution->url;
    $igimgthumb = $data->images->thumbnail->url;
    $igcaption = str_replace('#', '', (preg_replace('/(?:#[\w-]+\s*)+$/', '', $data->caption->text)));
    $igtime = date("F j, Y", $data->caption->created_time);
    $iglikes = $data->likes->count;
    $igcomments = $data->comments->count;
    $iglong = $data->location->longitude;
    $iglat = $data->location->latitude ;
    $igusername = $data->user->username;
    $igfullname = $data->user->full_name;
    $iglink = $data->link;
    $igfilter = $data->filter;
    $igtags = implode(',',$data->tags);
    ?>
            <img src="<?php echo ($igimglow);}?>">
            <?php endforeach ?>

<?php

    if(isset($jsonData->pagination->next_max_id)) {
        $result .= '<div><a href="?next=' . $jsonData->pagination->next_max_id . '">Next</a></div>';
    }

    return $result;
}
?>
    <div id="container">
        <?=jsongram(@$_GET['next']);?>
        <div id="result"></div>
    </div>
</body>
</html>

上記のコードの実際の例を次に示します。

http://johnricedesign.com/examples/pn.php

上図の2ページ目には「エジプト」のタグがつけられた写真が表示されています。同じページに自動的に読み込まれる「次へ」リンクを「さらに読み込む」ボタンに置​​き換えたいと思います-私の知る限り、AJAXを使用することが唯一の方法です。ただし、その方法も、どこから始めればよいかもわかりません。私が抱えている2番目の明らかな問題は、「エジプト」のキャプションを含まない写真を削除しているにもかかわらず、まだ多くの空白が残っていることです.AJAXが使用されると、修正はかなり簡単になるでしょう.

私はこれをしようとして、過去5日間髪を引っ張っています. あなたの助け、アドバイス、知恵、事前に大歓迎です。

4

1 に答える 1

1

access_token ではなく client_id で動作するように API を変更しました。元に戻すことができますが、効果はありません。

デモ: https://tjay.co/l/instagrampagination

ajax.php

<?php
function jsongram($next = null)
{
  $userid = "xxx";
  $accessToken = "xxx";
  $url = ("https://api.instagram.com/v1/users/{$userid}/media/recent/?client_id={$accessToken}");

  if ( !empty($next) ) {
    $url.= '&max_id=' . $next;
  }

  // Also Perhaps you should cache the results as the instagram API is slow
  $cache = './' . sha1($url) . '.json';

  // unlink($cache); // Clear the cache file if needed

  // If a cache file exists, and it is newer than 1 hour, use it
  if (file_exists($cache) && filemtime($cache) > time() - 60 * 60) {
      $jsonData = json_decode(file_get_contents($cache));
  } else {
    $jsonData = json_decode(file_get_contents($url));
    file_put_contents($cache, json_encode($jsonData));
  }

  return $jsonData;
}

function instaFormat($jsonData)
{
  $data_array = array();
  $response = array();

  foreach($jsonData->data as $data) {
    if ( !empty($data->caption->text) && stripos($data->caption->text, 'egypt') !== false ) { 
        $data_array[] = $data;
        $data = (str_split($data->caption->text));
        $data = (array_filter($data));
      }
  }

  $response['next'] = $jsonData->pagination->next_max_id;

  foreach($data_array as $data) {
      $igimglow = $data->images->low_resolution->url;
      // $igimgstd = $data->images->standard_resolution->url;
      // $igimgthumb = $data->images->thumbnail->url;
      // $igcaption = str_replace('#', '', (preg_replace('/(?:#[\w-]+\s*)+$/', '', $data->caption->text)));
      // $igtime = date("F j, Y", $data->caption->created_time);
      // $iglikes = $data->likes->count;
      // $igcomments = $data->comments->count;
      // $iglong = $data->location->longitude;
      // $iglat = $data->location->latitude;
      // $igusername = $data->user->username;
      // $igfullname = $data->user->full_name;
      // $iglink = $data->link;
      // $igfilter = $data->filter;
      // $igtags = implode(',', $data->tags);

      $response['data'][] = '<img src="'.$igimglow.'">';
  }

  return $response;
}

if ( isset($_POST['next']) ) {
  echo json_encode(instaFormat(jsongram($_POST['next'])));
  die();
}

index.php

<!doctype html>
<html>
  <body>
    <div data-pictures></div>

    <div><button type="button" data-get-next>Next</button></div>

    <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
    <script>
      jQuery(function($) {
        $(document).on('get-feed', function(e, next_id) {

          var data = {
            next: next_id
          };

          $.post('ajax.php', data, function(response) {
            var container = $('[data-pictures]');
            response = $.parseJSON(response);

            container.html('');
            $('[data-get-next]').attr('data-get-next', response.next);

            $.each(response.data, function(i, val) {
              $(val).appendTo(container);
            });
          });
        });

        $('[data-get-next]').click(function() {
          var next_id = $(this).attr('data-get-next');
          $.event.trigger('get-feed', next_id);
        });

        $.event.trigger('get-feed', 0);
      });
    </script>
  </body>
</html>
于 2014-11-16T12:09:44.113 に答える