序文 403 クロスオリジン エラーが発生し 1. 解決策 Nginx 構成ファイルで次のパラメータを設定する必要があります。 位置 / { アクセス制御許可オリジン * のヘッダーを追加します。 add_header アクセス制御許可メソッド 'GET、POST、OPTIONS'; add_header Access-Control-Allow-Headers 'DNT、X-Mx-ReqToken、Keep-Alive、User-Agent、X-Requested-With、If-Modified-Since、Cache-Control、Content-Type、Authorization'; $request_method = 'OPTIONS'の場合{ 204を返します。 } } 上記の設定コードで問題を解決できます。詳しく学習したくない場合は、ここを読んでください =-= II. 説明 1. アクセス制御許可オリジン デフォルトでは、サーバーはドメインを越えることはできません。 Nginx サーバーに `Access-Control-Allow-Origin *` を設定すると、サーバーはすべてのリクエスト ソース (Origin) を受け入れることができる、つまりすべてのクロスドメイン リクエストを受け入れることができるようになります。 2. Access-Control-Allow-Headers は次のエラーを防ぐためのものです。
このエラーは、現在のリクエストの Content-Type の値がサポートされていないことを示します。実際、これは私たちが開始した「application/json」タイプのリクエストによって発生しました。ここでは、プリフライト リクエストという概念が関係しています。以下の「プリフライト リクエスト」の概要を参照してください。 3. Access-Control-Allow-Methods は、次のエラーを防ぐためのものです。
4. OPTIONSに204レスポンスを追加するのは、POSTリクエストを送信してもNginxがアクセスを拒否するというエラーを処理するためです。 「プリフライトリクエスト」を送信する場合、メソッド OPTIONS が必要となるため、サーバーはこのメソッドを許可する必要があります。 3. 事前リクエスト 実際、上記の構成には W3C 標準である CROS (正式名称は Cross-origin resource sharing) が関係しており、これはクロスオリジン リクエストを解決するために提案されました。
実際、Content-Type フィールド タイプが application/json であるリクエストは、上記の特定の MIME タイプを持つ POST リクエストです。CORS によると、次の MIME タイプに属さない Content-Type は事前チェック リクエストです。
したがって、application/json リクエストは、正式な通信の前に「事前チェック」リクエストを追加します。この「事前チェック」リクエストは、ヘッダー情報 Access-Control-Request-Headers: Content-Type: を伝達します。 オプション /api/test HTTP/1.1 出典: http://foo.example アクセス制御リクエストメソッド: POST アクセス制御リクエストヘッダー: コンテンツタイプ ...一部省略 サーバーが応答したときに、返されたヘッダー情報に Access-Control-Allow-Headers: Content-Type が含まれていない場合は、デフォルト以外の Content-Type が受け入れられないことを意味します。次のエラーが発生します:
参考記事:
要約する 以上がこの記事の全内容です。この記事の内容が皆様の勉強や仕事に何らかの参考学習価値をもたらすことを願います。123WORDPRESS.COM をご愛顧いただき、誠にありがとうございます。 以下もご興味があるかもしれません:
|
>>: mysqld_multi を使用して単一のマシンに複数のインスタンスをデプロイする方法に関する MySQL チュートリアル
1. 説明前回は、MySQL のインストールと構成、MySQL ステートメントの使用、MySQL デ...
この記事では、CSS で 2 つの固定列と 1 つのアダプティブ列を実装するいくつかの方法を紹介し、...
1. 背景通常、外部サービスを提供する必要がある Docker コンテナの場合、起動時に -p コマ...
余計なことは言わないで、コードだけ見てみましょう〜 # docker-compose をダウン # ...
目次1. 電流制限アルゴリズム2. nginxの基礎知識4. 実戦要約する高並行性システムには、キャ...
配列メソッドJavaScript には多くの配列メソッドが用意されています。次の図は、ほとんどの配列...
目次導入Intel CPUをサポートApple M1のサポートテスト導入このプロジェクトでは最近、P...
目次ユースケースリアクティブAPI関連プロセス反応的なcreateReactiveObjectはレス...
目次1. イベントとは何ですか? 2. イベントの使い方3. バインドタップとキャッチタップの違い4...
目次前面に書かれた序文ChromeプラグインとはChrome プラグイン開発を学ぶことの意義は何です...
サーバーも 2 つあります。準備:コンテナのホスト名を設定する consul: kv タイプのストレ...
SASS で定義された変数では、後で設定された値によって古い値が上書きされます。 $色: 赤; $色...
一部の Web サイトでは、画像が連続的にスクロールしているのをよく見かけます。この効果は、CSS ...
この記事では、USB ブート ディスクの作成とシステムのインストールについて説明します。システム構成...
今日、CSDN で HTML テキスト エスケープのちょっとしたトリックを見ましたが、とても簡単です...