[解決済み] angularでpreflightのレスポンスがHTTP okステータスにならない
2022-02-02 23:49:33
質問
私のサービスでは、次のようなgetリクエストが定義されています。
createAuthorizationHeader(user, pass) {
let headers: HttpHeaders = new HttpHeaders;
headers = headers.append('Accept', 'application/json, text/plain, */*');
headers = headers.append('Authorization', 'Basic ' + btoa(user + ':' + pass));
headers = headers.append('Content-Type', 'application/json; charset=utf-8');
console.log(headers);
return this.http.get(this._loginUrl, {
headers: headers
});
}
その結果、次のようになります。
OPTIONS https://localhost:8443/delivery/all 401 ()
Failed to load https://localhost:8443/delivery/all: Response for preflight does not have HTTP ok status.
HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, …}
また、Postmanで同じpost requestをしましたが、すべてうまくいったので、ローカルサーバは機能しています。
私のリクエストの何が間違っているのかがわかりません。
どうすればいいですか?
CORS 契約では、飛行前の OPTIONS リクエストで認証が要求されないことが要求されています。あなたのバックエンドは、OPTIONSリクエストとGETで認証を要求しているように見えます。
Postmanでバックエンドにアクセスするとき、あなたはGETを送信しているだけです。 ブラウザはまずOPTIONSリクエストを送信し(認証ヘッダなし)、そのレスポンスにリクエストを行ったページのオリジンに一致する "Access-Control-Allow-Origin"ヘッダがあるかどうか探します。
OPTIONSリクエストに対するレスポンスが2xxでない場合、またはヘッダーが存在しない場合、またはヘッダー値がリクエストページのオリジンと一致しない場合、あなたが経験しているエラーが発生し、GETリクエストは行われないでしょう。
TLDR; OPTIONSメソッドでログインURLを処理する際に、認証を必要としないようにバックエンドを変更すること。
関連
-
[解決済み】ngサーブが機能しない
-
[解決済み】Android 8:クリアテキストのHTTPトラフィックが許可されない
-
[解決済み] Angular 2のコンポーネントプロパティにデフォルト値を設定する方法は?
-
[解決済み] switchの使用時に「ステートメントはif文でフィルタリングされなければならない」というtslintのクレームが発生する。
-
[解決済み] 私のJavaScriptコードは "No 'Access-Control-Allow-Origin' header is present on requested resource "というエラーを受け取りますが、Postmanはそうならないのはなぜですか?
-
[解決済み] updateとdeleteのHTTPステータスコード?
-
[解決済み] リソースが既に存在する場合の POST に対する HTTP レスポンスコード
-
[解決済み] 検証失敗または重複が無効な場合のREST HTTPステータスコード
-
[解決済み] ローカルファイルの読み込み時に "Cross origin requests are only supported for HTTP." というエラーが発生する。
-
[解決済み] プリフライト要求に対する応答がアクセス制御チェックを通過しない
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】ERR_INVALID_HTTP_RESPONSEをAngular 7とASP.Net Core 2.2を使ってGoogle Chromeブラウザーで使用する場合
-
[解決済み】エラー。どのルートにもマッチしません。URLセグメント: - Angular 2
-
[解決済み] テンプレートパースエラーです。'mat-icon' は既知の要素ではありません。
-
[解決済み] Typescript - コードが TS1128: Declaration or Statement expected というエラーでビルドに失敗するが、コードを提供すると期待通りに実行される。
-
[解決済み] Angular2 - エラー。セレクタ "app-root" はどの要素にもマッチしませんでした。
-
[解決済み] ag-gridで「表示する行がありません」テキストをプログラムで変更するにはどうすればよいですか?
-
[解決済み] 安全でない値」の例外を発生させずに <iframe src="..."> を設定するにはどうしたらよいですか?
-
[解決済み] Error.を修正する方法 No value accessor for form control with name' in Angular Unit Test?
-
[解決済み] Angularアプリのシンタックスエラー。予期しないトークン <
-
[解決済み] Angular 4 - "BrowserAnimationsModule "または "NoopAnimationsModule "のいずれかをアプリケーションに組み込んでください。