Question

我目前正在尝试使用jersey通过Angular 4调用我在localhost:8080本地运行的HttpClient REST API。

我的代码： ```

ngOnInit() {
    const headers = new HttpHeaders();
    headers.append('Authorization', 'Basic ' + btoa('username:password'));
    headers.append('Content-Type', 'application/json');

    this.http.get('http://localhost:8080/mycall?myparam=myvalue', {headers: headers}).subscribe(data => {
      console.log(data);
    });
  }

```

当我拨打此电话时，我收到401错误，说我是Unauthorized。但是，当我通过邮递员运行它时它会很好。我在这里做错了什么？

注意：这不是CORS问题，我目前正在允许CORS通过firefox上的扩展

Answer 1

HttpHeaders是不可变的，所以你需要做那样的事情

ngOnInit() {
    const headers = new HttpHeaders()
    .append('Authorization', 'Basic ' + btoa('username:password'))
    .append('Content-Type', 'application/json');

    this.http.get('http://localhost:8080/mycall?myparam=myvalue', {headers: headers}).subscribe(data => {
      console.log(data);
    });
  }

实际上，您不需要此处的内容类型来获取GET请求

Answer 2

我认为问题是您没有将自定义请求标头传递给HttpClient，这会导致未经授权的错误。

请尝试这样的事情。

const headers = new HttpHeaders();
headers.append('Authorization', 'Basic ' + btoa('username:password'));
headers.append('Content-Type', 'application/json');
const options = new RequestOptions({headers: headers});

this.http.get('http://localhost:8080/mycall?myparam=myvalue', options ).subscribe(data => {
  console.log(data);
});

您可以直接将RequestOptions传递给http.get，因为它接受标头作为可选参数。有关使用情况的详细信息，请查看以下链接。

https://angular.io/api/common/http/HttpClient#get

另外，请记住也要导入RequestOptions。

基本身份验证Angular2（非CORS）

2 个答案: