Angular 2 基本身份验证不起作用 [英] Angular 2 Basic Authentication not working

问题描述

我正在尝试使用 Angular2 连接/向 API 发出 POST 请求，这是一个非常简单的 API，带有基本身份验证密码.在 api 上禁用密码时，一切都按预期工作.但是当我启用基本身份验证时，Angular 无法再连接到 API.在 Postman 中，一切正常.我尝试了以下但没有成功.

I'm trying to connect/ do a POST request to an API with Angular2, It's a very simple API with a Basic Authentication password. When disabling the password on the api everything works like expected. But when I enable the Basic Authentication Angular can no longer connect to the API. In Postman everything works. I tried the following without success.

我有两个标题Content-Type"和Authorization"

I've got two headers "Content-Type" and "Authorization"

headers.append("Content-Type", "application/x-www-form-urlencoded");

这两个标题我都试过了.

I've tried these two headers.

headers.append("Authorization", "Basic " + btoa(Username + ":" + Password)); 
headers.append("Authorization", "Basic VXNlcm5hbWU6UGFzc3dvcmQ=");

我唯一能找到的是，在 RAW 请求标头中只有一行标头名称，但缺少值:

The only thing I can find is that in the RAW request headers there's only a line with the header names but the values are missing:

Access-Control-Request-Headers: authorization, content-type

原始标题:

#Request Headers
OPTIONS /shipment HTTP/1.1
Host: api.example.com
Connection: keep-alive
Access-Control-Request-Method: POST
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.106 Safari/537.36
Access-Control-Request-Headers: authorization, content-type
Accept: */*
Referer: http://localhost:4200/address
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,nl;q=0.6

希望有人能帮忙

推荐答案

为您的请求添加自定义标头的简化版本:

Simplified version to add custom headers to your request:

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

@Injectable()
export class ApiService {

   constructor(private _http: Http) {}

   call(url): Observable<any> {
      let username: string = 'username';
      let password: string = 'password';
      let headers: Headers = new Headers();
      headers.append("Authorization", "Basic " + btoa(username + ":" + password)); 
      headers.append("Content-Type", "application/x-www-form-urlencoded");
      return this._http.post(url, data, {headers: headers})
    }
}

很难确定你哪里出错了，因为缺少实际 http 调用的代码.但是这个例子应该适合你

It's hard to determine where you went wrong, because the lack of code of the actual http call you do. But this example should work for you

这篇关于Angular 2 基本身份验证不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！