带有亚马逊产品 API 的 Angular CORS答案

【问题标题】：Angular CORS with Amazon Product API带有亚马逊产品 API 的 Angular CORS
【发布时间】：2017-05-17 01:53:29
【问题描述】：

创建了一个 MEAN 堆栈应用程序，我有一个角度组件，在页面加载时它正在向亚马逊产品 API 发出请求。我在本地主机（节点/快速后端）上本地运行和测试。

这是我的组件中的基本请求代码：

getAmazonTackle(amz:amazonservice) {
var req:Object = {
  method: this.amazonservice.Method,
  url: this.amazonservice.Endpoint, 
  headers: {
    //"Access-Control-Allow-Origin":"*"
  },
  data: this.amazonservice.Data,
  withCredentials: false
}
console.log(JSON.parse(JSON.stringify(req)));
this.$http(req).then(
  function(response) {
    console.dir('The response: '+response);
  },
  function(response) {
    console.dir(response);
    console.dir('The error:'+response);
  }
)

}

当我没有 Access-Control-Allow-Origin 标头时，在浏览器中访问该页面时，我会在 Chrome 开发控制台中看到以下内容：

XMLHttpRequest cannot load http://webservices.amazon.com/onca/xml?. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:3000' is therefore not allowed access.

当我添加 Access-Control-Allow-Origin 标头时，我收到以下信息：

Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:3000' is therefore not allowed access.

我要确定的是我做错了还是亚马逊 API 不支持 CORS。

【问题讨论】：

你的问题解决了吗？

标签： javascript angularjs amazon-web-services cors mean-stack

【解决方案1】：

我遇到了类似的问题，发现如果我创建了启用 cors 的 http 处理程序，它将作为您的服务器和亚马逊服务器之间的中间件。这样我们就可以解决这个cors问题。创建起来很简单，我已经写好了。

Develop Angular2 Application with real server APIs

查看上述帖子中的问题和答案。我在github上发布了类似的代码，如果需要我会分享位置。

注意：到目前为止，我处理了 get 请求，但添加其他方法相当容易。 https://github.com/Anil8753/CORSHttpHandler

【讨论】：