将Instagram照片显示在我的网页上

Ann*_*yan 2 ajax wordpress jquery instagram

我正在寻找在我的网页上显示不是我的Instagram照片的方法,但不能.如果我只有instagram用户的帐户名(例如jamieoliver),是否可以这样做.我的网站是用Wordpress写的.

需要显示不是我的图像

JFK*_*JFK 8

此URL格式http://instagram.com/{instagram user name}/media将返回包含该用户的最新(20 +/-)媒体文件的json文件.

在示例中,jamieoliver您可以执行http://instagram.com/jamieoliver/media

您可以json通过(jQuery)ajax调用处理该响应,如:

$.ajax({
    url: "http://instagram.com/jamieoliver/media",
    dataType : "jsonp", // this is important
    cache: false,
    success: function(response){
        // process the json response to get images
        // e.g. the first image should be something like : 
        // response.items.images[0].low_resolution
        // you could call an external function to iterate through the response
    }
});
Run Code Online (Sandbox Code Playgroud)

当然,我假设您了解json格式的样子.如果您使用的是WordPress,也许您可​​以找到一个插件来处理该json响应


编辑:

看起来响应来自http://instagram.com/{author_name}/mediajsonp而不是json(请参阅此内容以供进一步参考),但设置json dataType将返回跨域错误.

解决方法是使用whateverorigin.org第三方应用程序来规避同源策略.

所以格式化你的URL就像

"http://whateverorigin.org/get?url=" + encodeURIComponent("http://instagram.com/{author_name}/media");
Run Code Online (Sandbox Code Playgroud)

whateverorigin服务器将作为代理,并返回正确的json格式.

请注意,您仍然需要dataType : "jsonp"在ajax调用中使用.

请参阅JSFIDDLE