獲取XMLHttpRequest不能加載第二個API調用Instagram

Question

我正在調用instagram api來獲取帶有某個標籤的所有圖片，第一次它可以正常工作，它顯示了我在控制檯上的json，但是當我嘗試與next_url再打電話讓所有照片我得到這個錯誤：

XMLHttpRequest cannot load https://api.instagram.com/v1/tags/cats/media/recent?callback=jQuery18300975…092&client_id=XXXXXXXXXXXXXXXXXXX&max_tag_id=1395937138154027. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 

這裏是我使用的代碼：

var Instagram = {}; 

// Small object for holding important configuration data. 
Instagram.Config = { 
    clientID: 'XXXXXXXXXXXXXXXXXXX', 
    apiHost: 'https://api.instagram.com' 
}; 

(function(){ 
var url; 
function search(tag){ 
    generateResource(tag); 
    $.getJSON(url, toScreen); 
} 

function generateResource(tag){ 
url = Instagram.Config.apiHost + "/v1/tags/" + tag + "/media/recent?callback=?&client_id=" +  Instagram.Config.clientID; 
return url; 
} 

function toScreen(data){ 
    var next_url=data.pagination.next_url; 
    console.log(next_url) 
    if(next_url!=undefined) 
    { 
    url=next_url; 
    pagination(url); 
    console.log(data); 
    } 
} 
function pagination(url) 
{ 
    $.getJSON(url, toScreen); 
} 

Instagram.App = { 
    search: search 
}; 


}()); 

$(function(){ 
    Instagram.App.search('cats'); 
}); 

Answer 1

你得再添&callback=?爲next_url

修改這個，並嘗試它的工作原理：

if(next_url!=undefined) 
    { 
    url=next_url + "&callback=?"; 
    pagination(url); 
    console.log(data); 
    }