Angular $http GET 和 jsonp 的错误答案

【问题标题】：Errors with Angular $http GET and jsonpAngular $http GET 和 jsonp 的错误
【发布时间】：2015-11-04 04:11:45
【问题描述】：

在使用 http 和 jsonp 连接到 Etsy API 时遇到很多困难。

URL 在浏览器中可以正常工作： https://openapi.etsy.com/v2/shops/GreatLakesModern/listings/active?api_key=5a61qc30hrvrqcperugollh5&fields=title&callback=JSON_CALLBACK

但是用 jsonp 给出 404 错误，用 $http.get 给出 0 状态错误

~~我不认为这是 CORS 的问题，因为当我在 CodePen 上测试其他 API 时，它们可以工作。替换 Etsy URL 并没有运气。~~

做了更多研究，发现 Etsy 与 CORS 不兼容。有了这些知识，我应该如何继续？

示例： http://codepen.io/SitePoint/pen/YXXQxj?editors=101

我尝试了各种解决方案，但这是我当前的代码：

var url = "https://openapi.etsy.com/v2/shops/GreatLakesModern/listings/active?api_key=5a61qc30hrvrqcperugollh5&fields=title&callback=JSON_CALLBACK";

$http.jsonp(url)               
            .success(function (data) {$scope.details = "Success";})
            .error(function (data, status) {$scope.details = "Nope"+""+status;});

【问题讨论】：

仅仅因为其他 API 工作，并不意味着 Etsy 不会因为 CORS 而失败......
CORS 测试表明如果失败：client.cors-api.appspot.com/…
@JoseM 这很公平。我实际上只是做了更多的研究，发现 Etsy 确实不兼容 CORS。有了这些知识，我该怎么办？
这里是有效的 omdbapi 测试：client.cors-api.appspot.com/…
你需要从你自己的后端服务器调用它（或者创建一个代理服务器）。他们的 api 可能不打算从浏览器中使用，您可能想要更改您的 api_key，因为它是公开的。

标签： json angularjs jsonp etsy

【解决方案1】：

我刚刚查看了您发布的链接，似乎 Etsy 支持 jsonp。但是你必须改变你调用他们的 api 的方式。

而不是https://..../active?api_key=...

你需要做https://..../active.js?api_key=...&callback=etsyResult123

注意添加了.js 部分。

更准确地说，使用 Angular 的 $http.jsonp api

var url = "https://openapi.etsy.com/v2/shops/GreatLakesModern/listings/active.js?api_key=5a61qc30hrvrqcperugollh5&fields=title&callback=JSON_CALLBACK";

这是一个有效的 plnkr：http://plnkr.co/edit/ulaMTo?p=preview

【讨论】：

是的，我也查看了 Github 链接并找到了相同的解决方案。也可以使用 &fields=title,url (etc.) 选择性地请求数据。非常感谢您的坚持。