Instagram API 的 Ajax 分页尝试修复错误

Posted 2023-03-31

【中文标题】Instagram API 的 Ajax 分页尝试修复错误

【英文标题】：Ajax pagination for Instagram API tried to fix bug

【发布时间】：2012-10-31 20:23:11

【问题描述】：

我正在尝试修复 Instagram API 的 Ajax 分页

仅显示 20 张照片。 “加载更多”按钮不起作用。

在控制台中：

Uncaught ReferenceError: maxid is not defined

这里是 index.php：

 <script>
 $(document).ready(function() 
 $('#more').click(function() 
 var max_id = $(this).data('nextid');


 $.ajax(
 type: 'GET',
 url: 'ajax.php',
 data: 
 max_id: maxid
 ,
 dataType: 'json',
 cache: false,
 success: function(data) 
 // Output data
 $.each(data.images, function(i, src) 
 $('#photos').append('<li><img src="' + src + '"></li>');
 );

 // Store new maxid
 $('#more').data('maxid', data.next_id);
 
 );
 );
 );
</script>

<?php


 require_once 'instagram.class.php';


$instagram = new Instagram(array(
  'apiKey' => '*****',
  'apiSecret' => '*****',
  'apiCallback' => '******'

));

// Receive OAuth code parameter
$code = $_GET['code'];

if (true === isset($code)) 

$data = $instagram->getOAuthToken($code);

$instagram->setAccessToken($data);


$media = $instagram->getUserMedia();



?>


<ul id="photos">

<?php foreach( $media->data as $data ): ?>
<li><img src="<?php echo $data->images->thumbnail->url ?>"></li>
<?php endforeach; ?>

<?php echo "<br><button id=\"more\" data-maxid=\"$media->pagination->next_max_id\">Load more ...</button>"; ?>

ajax.php:

require_once 'instagram.class.php';
$instagram = new Instagram(array(
  'apiKey' => '****',
  'apiSecret' => '*****',
  'apiCallback' => '*******'

));

// Receive OAuth code parameter
$code = $_GET['code'];

if (true === isset($code)) 

$data = $instagram->getOAuthToken($code);

 // Initialize class for public requests
 $instagram->setAccessToken($data);

$media = $instagram->getUserMedia();


 // Receive AJAX request and create call object
 $maxID = $_GET['next_max_id'];

 $clientID = $instagram->getApiKey();

 $call = new stdClass;
 $call->pagination->next_max_id = $maxID;
 $call->pagination->next_url = "https://api.instagram.com/v1/users/self/media/recent?client_id=$clientID&max_id=$maxID";


 // Receive new data
 $media = $instagram->pagination($call);

 // Collect everything for json output
 $images = array();
 foreach ($media->data as $data) 
 $images[] = $data->images->thumbnail->url;
  
 echo json_encode(array(
 'next_id' => $media->pagination->next_max_id,
'max_id' => $media->pagination->max_id,
 'images' => $images
 ));

我正在使用https://github.com/cosenary/Instagram-PHP-API

谢谢！

【参考方案1】：

怎么能比这更清楚：

Uncaught ReferenceError: maxid is not defined

maxid 未在您的代码中定义。这行定义的是max_id：

var max_id = $(this).data('nextid');

【讨论】：

点击 index.php 中的“加载更多”按钮时出现此错误： > Uncaught ReferenceError: maxid is not defined 所以我需要放什么而不是 maxid ?有 max_id 和 next_max_id from response: "pagination": "next_url": "api.instagram.com/v1/users********/media/recent?access_token=33174964.1fb234f.707411a10e624f13b6b08dd806df1eab&max_id=278169081097328255_3 278169081097328255_33174964",

【参考方案2】：

看起来像

.data('nextid');

是一个粗心的错误，因为它在您的 DOM 中不存在。除非它在其他地方并且您还没有发布它。

你的意思是有

.data('maxid');

?

【讨论】：

好的，这肯定是您的代码中的一个问题。它可能只是少数或众多之一。现在，在设置后立即将 maxid 的值记录到控制台（或使用警报）。如果它未定义，那么您的选择器将一无所获，您需要查看您的 html。您应该发布生成的 HTML，而不是创建它的服务器代码。

我还会检查在 ajax 调用中进入您的成功处理程序的数据。这可能表明您的错误在服务器端。

【参考方案3】：

maxid 只有 2 个位置：

这里：

$.ajax( ... max_id：最大值 ,

这里：

// 存储新的 maxid $('#more').data('maxid', data.next_id);

当你用你定义的max_id（感谢@mathieu）替换这些出现时，它应该被修复。

在您的ajax.php 中有一行：

$maxID = $_GET['next_max_id'];

这与您上面的呼叫不对应，您有一个max_id。好像你混合了一些next/max/id。如果您查看您的代码并清理这些 id，它应该可以工作。

【讨论】：

您能详细说明一下该怎么做吗？我试图将 max_id 从 maxid 更改为 nextid。你是什​​么意思“当你用你定义的 max_id 替换这些事件时......”？

这两个来源中有maxid、nextid、max_id 和next_max_id。这只是一个猜测，但可能这些名字的意思都是一样的。你应该知道，因为这是你的代码。 如果这些相同，您可以将它们全部替换为max_id。经验法则：如果您使用某样东西，请在任何地方只给它一个名称，否则您或您的同事迟早会感到困惑。

【参考方案4】：

您需要通过点击传递event 参数 并从event.target 获取data。 将第一行代码改成这样：

$('#more').click(function( event ) 
var max_id = $(event.target).data('nextid');