AngularJS POST リクエストが HTTP ステータス コード 404 で失敗するのはなぜですか?

HTTP ステータス コード 404 で失敗した AngularJS POST の修正

AngularJS では、POST リクエストがエラー メッセージ「プリフライトの応答が無効です」で失敗する場合がありますHTTP ステータス コード 404。」この問題は、ブラウザが実際の POST リクエストの前に権限を確認するためにプリフライト OPTIONS リクエストを送信するときに発生します。サーバーはこのプリフライト要求を処理し、適切な CORS ヘッダーで応答する必要があります。

サーバー側の構成

SlimPHP サーバーに次のヘッダーが含まれていることを確認してください。あなたの応答:

<code class="php">$app->response()->headers->set('Access-Control-Allow-Headers', 'Content-Type');
$app->response()->headers->set('Content-Type', 'application/json');
$app->response()->headers->set('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
$app->response()->headers->set('Access-Control-Allow-Origin', '*');</code>

クライアント側構成

次に、AngularJS クライアント コードを変更してプリフライト リクエストを無効にします。

<code class="javascript">app.config(function ($httpProvider) {
  $httpProvider.defaults.headers.common = {};
  $httpProvider.defaults.headers.post = {};
  $httpProvider.defaults.headers.put = {};
  $httpProvider.defaults.headers.patch = {};
});</code>

クライアント側でヘッダーをリセットすると、ブラウザーは、ヘッダーを使用せずに直接 POST リクエストを送信します。プリフライト OPTIONS リクエスト。これにより、HTTP 404 エラーが解決されるはずです。

CORS の概要

Cross-Origin Resource Sharing (CORS) では、コンテンツを提供するドメインとは異なるドメインからのリクエストが許可されます。これには、実際のリクエストの前に権限を確認するためのプリフライト リクエストが含まれます。これらのプリフライト要求を不適切に処理すると、HTTP 404 エラーが発生する可能性があります。 CORS を理解し、それに応じてクライアントとサーバーの両方を構成することで、AngularJS で POST リクエストを正常に実行できます。

以上がAngularJS POST リクエストが HTTP ステータス コード 404 で失敗するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。