Angular 4：用http请求发送自定义头文件

在Angular 4中，我无法用http请求发送自定义头文件。Angular 4：用http请求发送自定义头文件

我曾尝试使用下面的代码来发送标题：

let response = this.http.post(environment.serverUrl + url, data, this.getHeaders()) 
     .map((response: Response) => response.json()) 
     .catch(this.handleError); 

private getHeaders(): RequestOptions { 
    let reqOp = new RequestOptions(); 

    let headers = new Headers(); 
    headers.append('Accept', 'application/json'); 
    headers.append('Access-Control-Allow-Origin', '*'); 
    headers.append('Access-Control-Allow-Headers', '*'); 

    reqOp.headers = headers; 

    return reqOp; 
    }

仍然是头部不附加到我的请求头。如果我检查Chrome的“网络”中的通话，则无法看到自定义标题。

Accept:*/* 
Accept-Encoding:gzip, deflate 
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6 
Access-Control-Request-Headers:access-control-allow-headers,access-control-allow-origin,content-type 
Access-Control-Request-Method:POST 
Connection:keep-alive 
Host:10.xxx.xxx.xxx:3300 
Origin:http://localhost:4200 
Referer:http://localhost:4200/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

任何帮助来解决这个问题？请注意我没有使用'@ angular/common/http'中的HttpClient;

来源

2017-08-31 Suvonkar

的可能的复制[角\ [4.3 \] HttpClient的不发送报头]（https://stackoverflow.com/questions/45286764/angular-4-3-httpclient-doesnt-send-header） –

删除'headers.append（'Access-Control-Allow-Origin'，'*'）; header.append（'Access-Control-Allow-Headers'，'*'）'来自您的前端请求。这些只是响应请求的服务器发回的响应头。将它们添加到请求的唯一效果是触发浏览器在从您的代码发送POST请求之前自行执行CORS预检选项请求。有关更多详细信息，请参阅https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests。 – sideshowbarker

从devtools网络窗格获得的标题列表是用于预检选项请求的标题。您添加到请求中的自定义标题不存在，因为预检的整个目的是首先联系您尝试发送请求的服务器，并询问服务器是否选择了包含这些请求的跨源请求头。如果服务器被配置为允许这些头文件，它会发送一个响应告诉浏览器它是OK的，并且只有浏览器才会发送POST。但是如果服务器说不好，预检失败，浏览器也不会尝试POST – sideshowbarker

这样做。如果想要更多头文件，只需将其添加到头文件数组中即可。

apiUrl = 'api/url' 
myFunction(data) { 
    let headers = new Headers({'Content-Type':'application/json'}); 
    let options = new RequestOptions({headers: headers}); 

    return this.http.post(this.apiUrl, JSON.stringify(data), options).map((response: Response) => { 
    return response.json() 
    }) 
}

来源

2017-08-31 09:56:58

仍然没有运气。 Chrome自定义标题中的一个观察是在“Access-Control-Request-Headers：access-control-allow-origin，content-type” – Suvonkar

Angular 4：用http请求发送自定义头文件

回答

相关问题