Angular 4使用HttpClient模块设置请求头信息

Question

我是一位有用的助手，可以为您翻译文本。

我刚接触Angular，并且正在处理一个需要设置服务器端授权头信息的项目。我正在使用Angular 4和从'@angular/common/http'导入的HttpClient模块。

这是我的AuthService类

import { Injectable } from '@angular/core';
import { User } from '../../models/user';
import { HttpClient, HttpHeaders, HttpRequest } from 
'@angular/common/http';
import { Observable } from 'rxjs';
import { Globals } from '../../utils/global';
import { Converters } from '../../utils/converters';


@Injectable()
export class AuthService {
getUserByToken(token: string): any {
    let headers = new HttpHeaders();
    headers.append('Content-Type', 'application/json');
    headers.append('authorization', 'Bearer ' + token);

    console.log(headers);

    return new Promise((resolve, reject) => {
      this.http.get(this.global.urls['info'], { headers: headers }).subscribe((data) => {
        if (data != null) {
          this.converter.userJsonToObject(data).then((data: User) => {
            this.setCurrentUser(data);
            this.persistToken(data.token);
            resolve(data);
          });
        } else {
          reject('This user is not defined');
        }
      }, (err) => {
        reject(err);
      });
    });

  }

当我运行我的项目并调用getUserByToken（token）函数时，服务器控制台告诉我没有发送令牌。 使用ARC时端点完美工作，因此问题在客户端。 有人可以帮助我解决这个问题吗？ :D

- BenFarhat Souhaib

---

你在 authorization 中有一个拼写错误，应该将 A 改为大写。另外尝试使用 headers.set() 而不是 append。 - Aravind

通过查看我的屏幕截图，端点工作正常，即使点击“授权”。问题在于我设置标头的方式。即使使用header.set()，仍然无法正常工作。 - BenFarhat Souhaib

可能是Angular [4.3] Httpclient不发送标头的重复问题。 - Jota.Toledo

Answer 1

这是一个 不可变的 Map 类型，因此如果你给它赋一个新值，它将重新初始化对象，所以你应该这样做：

let headers = new HttpHeaders().set('Content-Type', 'application/json')
                               .set('authorization', 'Bearer ' + token);

或者

let headers = new HttpHeaders().set('Content-Type', 'application/json');
headers = headers.set('authorization', 'Bearer ' + token);

- Aravind

---

谢谢，老兄。这解决了我的问题。正如你所提到的HttpHeaders是不可变的，所以我应该在构造函数中放置头文件。 - BenFarhat Souhaib