Javascript 在instagram API中显示20多张照片

我一直在做一些研究，试图找出如何显示从instagram api导入的20多幅图像。我在这方面是新手，所以任何帮助都将不胜感激！只是想看看有没有解决办法？看到了一些关于添加分页的内容，可能会有所帮助。。如果是这样的话，关于如何做到这一点的详细信息也会很好

这是我到目前为止的代码

<script type="text/javascript">
    $.ajax({
        type: "GET",
        dataType: "jsonp",
        cache: false,
        url: "https://api.instagram.com/v1/tags/coffee/media/recent?client_id=[]&access_token=[]",
        success: function(data)  {
            for (var i = 0; i < 20; i++) {
                $(".instagram").append("<a class='big-square span2' target='_blank' href='" + data.data[i].link +"'><img src='" + data.data[i].images.low_resolution.url +"'></img></a>");
            }
        }
    });
</script>

$.ajax({
键入：“获取”，
数据类型：“jsonp”，
cache:false，
url:“https://api.instagram.com/v1/tags/coffee/media/recent?client_id=[]&访问\u令牌=[]”，
成功：功能（数据）{
对于（变量i=0；i<20；i++）{
$（“.instagram”）。追加（“”）；
}
}
});

尝试将

&count=N

添加到请求中，其中N是您想要的结果数。

Instagram的API上有20个图像限制，请查看此线程和我的答案：

编辑：另外，请查看

尝试此代码

$api = "https://api.instagram.com/v1/tags/snow/media/recent?client_id=".$client;  

function get_curl($url) {  
    if(function_exists('curl_init')) {  
        $ch = curl_init();  
        curl_setopt($ch, CURLOPT_URL,$url);  
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);  
        curl_setopt($ch, CURLOPT_HEADER, 0);  
        curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);  
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);   
        $output = curl_exec($ch);  
        echo curl_error($ch);  
        curl_close($ch);  
        return $output;  
    } else{  
        return file_get_contents($url);  
    }  
}

while ($api !== NULL) {
    $response = get_curl($api);
    foreach(json_decode($response)->data as $item){   
        $src = $item->images->standard_resolution->url;  
        $thumb = $item->images->thumbnail->url;  
        $url = $item->link;  

        $images[] = array(  
        "src" => htmlspecialchars($src),  
        "thumb" => htmlspecialchars($thumb),  
        "url" => htmlspecialchars($url)  
        );  
    echo "<a href='".$src."'><img src='".$thumb."'  width='150' height='150' border='0'></a> ";
    } 
    $api = json_decode($response)->pagination->next_url;
}

$api=”https://api.instagram.com/v1/tags/snow/media/recent?client_id=$client；
函数get_curl（$url）{
如果（函数_存在（'curl_init'））{
$ch=curl_init（）；
curl_setopt（$ch，CURLOPT_URL，$URL）；
curl_setopt（$ch，CURLOPT_RETURNTRANSFER，1）；
curl_setopt（$ch，CURLOPT_头，0）；
curl_setopt（$ch，CURLOPT_SSL_VERIFYHOST，0）；
curl_setopt（$ch，CURLOPT_SSL_VERIFYPEER，0）；
$output=curl\u exec（$ch）；
回波旋度误差（$ch）；
卷曲关闭（$ch）；
返回$output；
}否则{
返回文件获取内容（$url）；
}  
}
而（$api！==NULL）{
$response=get_curl（$api）；
foreach（json_decode（$response）->数据作为$item）{
$src=$item->images->standard_resolution->url；
$thumb=$item->图像->缩略图->url；
$url=$item->link；
$images[]=数组（
“src”=>htmlspecialchars（$src），
“thumb”=>htmlspecialchars（$thumb），
“url”=>htmlspecialchars（$url）
);  
回声“；
} 
$api=json_decode（$response）->分页->下一个url；
}

请参阅。它详细说明了端点的泛型，还列出了分页属性。简而言之，“分页”响应将包括一个

next\u url

，可用于检索下一组结果。随后检索所有下一个URL（只要结果中提供了它们）将获得完整的URL集

---

顺便说一句，您可以尝试增加请求中的

count

参数。（根据您使用的Instagram库的不同，可以通过

选项

哈希或类似的方式提供这些内容。）这可能会为您节省一些额外的请求。不过，我刚才提到的页面没有指定最大计数值。我怀疑Instagram正在动态更改每个端点的最大值。

通过指定

count

参数并将其设置为所需的数字，您可以获得20多个项目

然而，Instagram还对您提出的每个请求施加了33个未记录的限制，因此，如果您收到的请求超过33个，则必须进行分页

---

然而，我写了这将帮助您分页，它甚至会过滤媒体的标签为您。所以请随意使用它

事实上，有机会获得接下来的20张照片，然后是接下来的20张，以此类推。。。 在JSON响应中有一个“分页””数组：

这是关于特定API调用的信息，对象“next\u url”显示了获取接下来20张图片的url，因此只需获取该url并为接下来的20张图片调用它

---

有关Instagram API的更多信息，请查看以下内容：

您可以使用Instagram提要库，如。它允许获取60个图像的提要（最多）

例如：

var feed=新Instafeed({
得到：“标记”，
标记名：“真棒”，
限额：20，
客户ID:'您的客户ID'
});
feed.run（）；

---

限制（数量）-要添加的图像的最大数量。最多60个。

2015年11月17日之前创建的任何应用程序将继续运行到2016年6月。2016年6月后，如果未通过审查流程获得批准，该应用程序将自动移动到沙箱模式。
沙盒模式是真实的Instagram数据（即Instagram应用程序中通常可见的数据），但具有以下条件：

• 沙盒中的应用程序限制为10个用户
• 数据仅限于10个用户和其中每个用户的20个最新媒体
• 降低API速率限制

---

如果您是沙盒用户，您最多只能获得20篇帖子 请阅读“API行为”下的内容 var token='您的_token'， userid=您的\u id， 照片数量=12张； $.ajax({ 网址：'https://api.instagram.com/v1/users/“+userid+”/media/recent'， 数据类型：“jsonp”， 键入：“GET”， 数据：{access_token:token，count:num_photos}， 成功：功能（数据）{ 控制台日志（数据）； }, 错误：函数（数据）{ } });

老问题。新答案。 这是2021年的解决方案

您需要使用来显示媒体项。（此答案不包括设置）

假设上述设置正确，您可以使用limit参数来控制API返回多少媒体结果

默认值为25（未设置限制），允许的最大值为100。（使用分页可能会得到更多的结果，但这也是离题的）

下面的cURL代码示例使用

---

我试过了，但它仍然只限制了我20岁。。现在我对分页的想法很感兴趣，我认为这是instagram最初的想法。

 "pagination":{
      "next_max_tag_id":"1411892342253728",
      "deprecation_warning":"next_max_id and min_id are deprecated for this endpoint; use min_tag_id and max_tag_id instead",
      "next_max_id":"1411892342253728",
      "next_min_id":"1414849145899763",
      "min_tag_id":"1414849145899763",
      "next_url":"https:\/\/api.instagram.com\/v1\/tags\/lemonbarclub\/media\/recent?client_id=xxxxxxxxxxxxxxxxxx\u0026max_tag_id=1411892342253728"
 }

<script type="text/javascript">
    var feed = new Instafeed({
        get: 'tagged',
        tagName: 'awesome',
        limit: 20,
        clientId: 'YOUR_CLIENT_ID'
    });
    feed.run();
</script>

<script>
    var token = 'your_token',
    userid = your_id,
    num_photos = 12;
    $.ajax({
            url: 'https://api.instagram.com/v1/users/'+userid+'/media/recent',
            dataType: 'jsonp',
            type: 'GET',
            data: {access_token: token, count: num_photos},
            success: function(data){
                console.log(data);
            },
            error: function(data){
            }
        });
</script>

GET https://graph.instagram.com/me
    ?fields={fields}
    &access_token={access-token}
    &limit={required number of items}