Angular 4 不包含 http 请求的 header

Question

我正在尝试非常简单的 Angular 4 http 请求。 当我检查 chrome 开发者工具时，我看不到 http header 。

const headers: Headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('Authorization', 'Bearer: 123213');
this.http.post('https://127.0.0.1:502', JSON.stringify(token), {headers: headers}).subscribe();

我错过了什么吗？

Answer 1

从 angular@5.x. 开始，@angular/http 模块及其所有类都已弃用。现在应该使用 angular/common/http 了。 Read here 更多信息。

import { HttpHeaders } from '@angular/common/http';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Authorization': 'my-auth-token'
  })
};

this.http.post(
   "http://localhost:3000/contacts",
   JSON.stringify({id: 4, name: 'some'}),
   httpOptions 
).subscribe();

对于旧版本，你可以这样做:

import {Http, Headers, RequestOptions} from '@angular/http';

export class AppComponent {
    constructor(private http: Http) {
        const headers = new Headers();
        headers.append('Content-Type', 'application/json');
        headers.append('authentication', `hello`);

       const options = new RequestOptions({headers: headers});
       this.http.post(
           "http://localhost:3000/contacts",
           JSON.stringify({id: 4, name: 'some'}),
           options
       ).subscribe();

您必须确保您从 @angular/http 导入正确的对象:

import {Http, Headers, RequestOptions} from '@angular/http';

如果您仍然看不到标题，也可能是您使用的服务器不允许使用它们。当浏览器向其他来源发出请求时，它会发送 access-control-headers-request header 以检查服务器是否允许自定义 header 。如果您的服务器未配置为允许自定义 header ，您将不会在后续请求中看到它们。