Angular 2：如何处理预检的响应具有无效的HTTP状态代码400.错误的请求

Question

Im尝试使用我的magento的Rest api获取HTTP GET请求。

下面是实现相同的angular2代码！

public ngOnInit() { 
    let headers = new Headers({ 'Accept': 'application/json' }); 
    headers.append('Authorization', 'Bearer x9a278mu7xoh4k0jkj08doc5j4b3ac22'); 
    headers.append('Access-Control-Allow-Headers', 'Content-Type'); 
    headers.append('Access-Control-Allow-Methods', 'GET'); 
    headers.append('Access-Control-Allow-Origin', '*'); 

    let options = new RequestOptions({ headers: headers }); 
    return this.http.get('http://10.2.../Mage_ang2/index.php/rest/V1/customers/1',options) 
     .map(response => console.log(response.json)) 
     .subscribe((items: Person[]) => { 
      console.log('items: ' + items); 
      this.people = items; 
     }, error => console.log(error)); 

} 

我得到（哪一个即时假设）的CORS问题。

OPTIONS http://10.2.../Mage_ang2/index.php/rest/V1/customers/1

的XMLHttpRequest不能加载http://10.2.../Mage_ang2/index.php/rest/V1/customers/1。预检的响应具有无效的HTTP状态代码500

我在谷歌的解决方法之后尝试了下面的步骤来修复相同的问题，但不成功。

1）在Magento .htaccess文件，加入

报头中设置访问控制允许来源 “*”

2）在上述的角2的代码添加，

headers.append（'Access-Control-Allow-Headers'，'Content-Type'）; ...

...

3）试图改变内容类型从应用/ JSON在

让头=新集管（{ '接受'： '应用/ JSON'} ）;

我在想什么。

需要适当的解决方案来修复CORS（从magento2到angular2）问题。

建议欢迎！

Answer 1

Header set Access-Control-Allow-Origin "*" 

给予Magento的全球跨域访问（我的理解是一个购物平台）听起来像是从安全的角度来看，非常糟糕的主意。

headers.append('Access-Control-Allow-Headers', 'Content-Type'); ... 

Access-Control-Allow-Headers是响应报头。服务器必须将它发送给客户端，而不是相反。您的JS无法授予自己访问其他服务器的权限。

let headers = new Headers({ 'Accept': 'application/json' }); 

你有一些理由认为该服务器是因为你的默认设置抛出一个错误？

---

回去看看错误消息：

预检

响应具有无效的HTTP状态码500

然后做一些基础研究的学习what a preflight is。

然后做一些更基础的研究来找出what HTTP status code 500 means。

所以：

• 浏览器正在一个OPTIONS请求
• 服务器与500内部服务器错误（大概是因为它没有被编程为一个OPTIONS请求）响应。

这意味着，你需要看看你的服务器端代码（所以不是你的JS在所有），并确定为什么它抛出500错误。您的服务器的错误日志将是一个开始寻找的好地方。

您需要让服务器按照the CORS documentation中的规则正确响应OPTIONS请求。 （或者，使用相同的说明，您可以尝试阻止浏览器首先发出预检请求，这可能非常简单，就像删除所有尝试在请求中设置CORS响应标头一样简单不属于）。