獲取郵件中的請求工作，但在瀏覽器中不起作用

Question

我有在客戶端使用Angular7 Web應用程序和Api CakePHP我使用Basic Authentication然后我用Token Authentication替換它所有請求工作正常，除了一個只在Postman工作正常但在瀏覽器中它很奇怪因為它似乎有身份驗證問題，但無法知道原因。

請求應該返回一個blob來下載文件，所以我在CakePHP使用FPDI來返回pdf

這是郵遞員的要求

郵差標題

Date →Wed, 15 May 2019 12:02:44 GMT
Server →Apache/2.4.33 (Win32) OpenSSL/1.0.2n PHP/5.6.35
X-Powered-By →PHP/5.6.35
Content-Disposition →inline; filename="doc.pdf"
Cache-Control →private, max-age=0, must-revalidate
Pragma →public
Access-Control-Allow-Origin →*
Keep-Alive →timeout=5, max=100
Connection →Keep-Alive
Transfer-Encoding →chunked
Content-Type →application/pdf

郵遞員身體 Chrome上請求 使用Basic Auth的工作請求 使用FireFox

通話請求

    getWorkListPdf(id: number, cem_id?: number) {
    let uri = `${this.workSessionsUrl}workList/${id}`;
    let params = new HttpParams();
    if (cem_id) {
      params = params.set('cemetery_id', cem_id.toString());
    }
    const Auth = localStorage.getItem("AuthenticationToken");
    let header = new HttpHeaders();
      header = header.append("AuthenticationToken", Auth);
    return this.dataService.get(uri,{ headers: header, params: params, responseType: 'arraybuffer'  })
    .pipe(
      map(res => {
                  return res;
                }
      )
    );
  }

任何幫助深表感謝！

Answer 1

問題是Api無法識別包含身份驗證所需標頭信息的請求，我在AppController添加了Authentication數組，以便在接收json請求時允許使用Basic Auth和Token Auth ，這對於除此之外的所有請求都可以正常工作一個（下載pdf）我試圖添加

$this->Auth->authenticate['Token'] = array(
                'fields' => array(
                ),
                // 'parameter' => '_token',
                'header' => 'AuthenticationToken',
                'scope' => array(
                    'User.permission_api_login' => true
                )
        );

在Controller中再次運行良好!! 它似乎現在可以識別令牌並返回一個有效的文件！

Answer 2

如果我完全理解您想要使用持票人令牌而不是基本授權進行身份驗證。 如果您想要基本的，可以在請求中使用以下標題：

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

如果是持票人授權，您可以執行以下操作：

const httpOptions = {
    headers: new HttpHeaders({ 
        'Content-Type': 'application/json',
        'Authorization': 'Bearer ' + JSON.parse(your token)
    })
};

希望能幫助到你！

Answer 3

在請求中添加withCredentials true。

const httpOptions = {
    headers: new HttpHeaders({
        'Accept': "application/json",
        'Content-Type': "text/plain;charset=UTF-8",
        'Authorization': 'Bearer ' + JSON.parse(your token)
    }), withCredentials: true
};