我有一個 Angular 應用程式,它與托管在 heroku 上的 API 進行通信。簡單地說,它是一個電影資料庫,您可以在其中添加和洗掉收藏夾中的電影。
添加電影的請求:
addMovie(username: any, movieId: any): Observable<any> {
const token = localStorage.getItem('token');
return this.http.post(apiUrl `users/${username}/movies/${movieId}`, {headers: new HttpHeaders(
{
Authorization: 'Bearer ' token,
}
)}).pipe(
map(this.extractResponseData),
catchError(this.handleError)
);
}
并洗掉電影:
deleteMovie(username: any, movieId: any): Observable<any> {
const token = localStorage.getItem('token');
return this.http.delete(apiUrl `users/${username}/movies/${movieId}`, {headers: new HttpHeaders(
{
Authorization: 'Bearer ' token,
}
)}).pipe(
map(this.extractResponseData),
catchError(this.handleError)
);
}
兩個請求完全相同,但 POST 請求出于某種原因洗掉了 Authorization 標頭,而 DELETE 請求則沒有。在查看兩者的預檢請求時,POST 請求的預檢甚至不要求允許 Authorization 標頭,而 DELETE 請求的預檢要求。
POST 預檢:
curl "https://somesite.com/users/tester/movies/6123fbc6a2a0fea2b1f81fd1" ^
-X "OPTIONS" ^
-H "Connection: keep-alive" ^
-H "Accept: */*" ^
-H "Access-Control-Request-Method: POST" ^
-H "Access-Control-Request-Headers: content-type" ^
-H "Origin: http://localhost:4200" ^
-H "User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.93 Safari/537.36" ^
-H "Sec-Fetch-Mode: cors" ^
-H "Sec-Fetch-Site: cross-site" ^
-H "Sec-Fetch-Dest: empty" ^
-H "Referer: http://localhost:4200/" ^
-H "Accept-Language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7" ^
DELETE 的預檢:
curl "https://somesite.com/users/tester/movies/61240c5da2a0fea2b1f81fd9" ^
-X "OPTIONS" ^
-H "Connection: keep-alive" ^
-H "Accept: */*" ^
-H "Access-Control-Request-Method: DELETE" ^
-H "Access-Control-Request-Headers: authorization" ^
-H "Origin: http://localhost:4200" ^
-H "User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.93 Safari/537.36" ^
-H "Sec-Fetch-Mode: cors" ^
-H "Sec-Fetch-Site: cross-site" ^
-H "Sec-Fetch-Dest: empty" ^
-H "Referer: http://localhost:4200/" ^
-H "Accept-Language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7" ^
用 PUT 替換 POST 會導致同樣的問題。
uj5u.com熱心網友回復:
POST 請求中的第二個引數是正文。POST 請求中的第三個引數是選項。DELETE 請求中的第二個引數是選項。目前,您在 POST 請求的正文中發送身份驗證標頭,但它屬于選項。
你可以發送一個空的身體
addMovie(username: any, movieId: any): Observable<any> {
const token = localStorage.getItem('token');
return this.http.post(apiUrl `users/${username}/movies/${movieId}`, {}, {headers: new HttpHeaders(
{
Authorization: 'Bearer ' token,
}
)}).pipe(
map(this.extractResponseData),
catchError(this.handleError)
);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/385103.html
標籤:javascript 有角的 邮政 授权 放
上一篇:沒有子類化的NSButton圓角
