javascript - 从 aurelia http 客户端检索 jsonp 时出错

Question

我有一个使用 Aurelia 创建的应用程序。我希望通过 ajax 从 instagram 中的用户检索最新图像。我尝试使用 Aurelia http client因为这就是 Aurelia 入门页面上的 Flickr 示例所使用的内容。

如果我使用 http.get，那么我会从 instagram 收到 CORS 错误。尝试 http.jsonp，检查的响应显示 correct format ，但在执行处理响应的回调之前，我得到了一个看起来像解析错误(意外标记“:”)的东西。

我能够使用 jQuery 通过 AJAX 成功检索图像，但我很想知道我在使用 Aurelia http 客户端时做错了什么。

以下是 View 模型的相关部分:

import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-http-client';

@inject(HttpClient)
export class Welcome {
  images = [];
  url = '[INSTAGRAM_URL]';

  constructor(http){
    this.http = http;
  }

  activate(){
    return this.http.jsonp(this.url).then(response => {
      this.images = response.data.map(function (d) {
            return {
                src: d.images.standard_resolution.url,
                caption: d.caption.text,
                when: d.created_time
            };
        });
    });
  }
}

Answer 1

Instagram API 期望 callback GET 参数出现在请求 URL 中。此参数应该是将响应对象包装到其中的函数名称(Aurelia 将添加类似 &callback=jsonp_callback_59563 的内容)。它与 jQuery.jsonp 一起工作的原因是它在后台自动添加了 callback 参数。

正确的代码应该是:

return this.http.jsonp(this.url, 'callback').then(response => {
  this.images = response.content.data.map(function (d) {
        return {
            src: d.images.standard_resolution.url,
            caption: d.caption.text,
            when: d.created_time
        };
    });
});