我有一个 REST 服务器,用于查询在PHP中运行的数据库,通过GET可以查询JSON格式的各种数据。
以前在另一台服务器上有一个用Javascript + JQuery编写的客户端,所以我需要使用CORS连接到该服务器。当时只需要在 PHP 页面中添加以下几行:
<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json");
我现在正在将客户端迁移到Angular2,但事实证明尝试连接到同一服务器会拒绝 CORS 请求。
原则上我认为它是服务器端而不是客户端,但为什么如果它在此之前工作它停止为 Angular2 工作?.
Angular 请求属于这种类型:
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
let url = this.apiHost + '/servicios/';
return this.http.get(url, options).map(response => response.json());
您遇到的问题是因为CORS 规范规定简单请求必须满足以下条件:
唯一接受的方法是:
GET
HEAD
POST
除了由用户代理自动设置的标头(例如
Connection
,User-Agent
等)之外,唯一允许手动设置的标头是:Accept
Accept-Language
Content-Language
Content-Type
唯一允许的标头值
Content-Type
是:application/x-www-form-urlencoded
multipart/form-data
text/plain
使用 jQuery 开发的应用程序满足这些条件,但使用 Angular 开发的应用程序不满足这些条件,因为它将
$http
标头更改Content-type
为application/json
:在西班牙语中:
因此,您至少需要将其添加到您的 PHP 代码中,以允许 Angular 进行此类更改:
显式授权标头
Content-Type
可以使用超出最初允许的值(application/x-www-form-urlencoded
和multipart/form-data
)的任何值text/plain
。我更新了通过添加以下标题来解决问题
完整是这样的:
即便如此,我仍然不明白问题到底是什么,因此它适用于javascript + jquery而不适用于Angular 2。