Nginx設定のクロスドメインリクエストエラーAccess-Control-Allow-Origin * 解決方法

はじめに

403 クロスドメイン エラーが発生した場合、要求されたリソースに「access-control-allow-origin」ヘッダーが存在しないには、次のことが必要です。 nginx サーバー構成の応答ヘッダー パラメーターを指定するには:

1. 解決策

nginx 構成ファイルで次のパラメーターを構成するだけです:

location / { 
 add_header access-control-allow-origin *;
 add_header access-control-allow-methods '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';

 if ($request_method = 'options') {
  return 204;
 }
}

上記の設定コードで問題を解決できます。詳しく調べたくない場合は、ここを参照してください =-=

# 2. 説明

##1. access-control-allow-origin

サーバーは、デフォルトではクロスドメインを許可されません。 nginx サーバーに `access-control-allow-origin *` を設定すると、サーバーはすべてのリクエスト ソース (オリジン) を受け入れることができる、つまりすべてのクロスドメイン リクエストを受け入れることができます。

2. access-control-allow-headers は、次のエラーを防ぐためのものです:

リクエスト ヘッダー フィールドの content-type は次のエラーです。プリフライト応答の access-control-allow-headers では許可されていません。

このエラーは、現在の要求コンテンツ タイプの値がサポートされていないことを示します。実際、これは「application/json」タイプのリクエストを開始したことが原因でした。これには、プリフライト リクエストという概念が含まれます。以下の「プリフライト リクエスト」の概要を参照してください。

3. access-control-allow-methods は、次のエラーを防ぐためのものです:

content-type は access-control によって許可されていません-allow-headers in preflightresponse.

4. 投稿リクエストを送信するときに nginx が依然としてアクセスを拒否するというエラーを処理するために、オプションに 204 return を追加します
#「プリフライトリクエスト」を送信する場合、メソッドオプションを使用する必要があるため、サーバーはこのメソッドを許可する必要があります。

3. プリフライト リクエスト

実際、上記の設定には w3c 標準: cro が含まれており、正式名はクロスドメイン リソース共有 (cross -オリジンリソース共有)、クロスドメインリクエストを解決するために提案されました。

クロスドメイン リソース共有 (cors) 標準では、サーバーがどのオリジン サイトにどのリソースへのアクセス許可があるかを宣言できるようにする新しい http ヘッダー フィールドのセットが追加されています。さらに、仕様では、サーバー データに副作用を及ぼす可能性のある http リクエスト メソッド (特に get 以外の http リクエスト、または特定の MIME タイプを使用した post リクエスト) について、ブラウザは最初にオプション メソッドを使用してプリフライト リクエストを開始する必要があります。 (プリフライトリクエスト) サーバーがクロスドメインリクエストを許可しているかどうかを確認します。サーバーは許可を確認した後、実際の http リクエストを開始します。サーバーは、プリフライト要求を返す際に、ID 資格情報 (Cookie および http 認証関連データを含む) を送信する必要があるかどうかをクライアントに通知することもできます。

実際には、application/json の content-type フィールドを持つリクエストは、特定の MIME タイプを持つ上記の post リクエストです。Cors では、content-type が以下に属さないことを規定しています。 mime タイプ。すべてプリフライト リクエストに属します:

application/x-www-form-urlencoded

multipart/form-data

text/plain

したがって、アプリケーション/json リクエストは、正式な通信の前に「プリフライト」リクエストを追加します。この「プリフライト」リクエストは、ヘッダー情報をもたらします access-control-request-headers: content-type:

options /api/test http/1.1
origin: http://foo.example
access-control-request-method: post
access-control-request-headers: content-type
... 省略了一些

Whenサーバーは、返されたヘッダー情報に access-control-allow-headers: content-type が含まれていない場合、デフォルト以外の content-type が受け入れられないことを意味します。つまり、次のエラーが発生します:

リクエスト ヘッダー フィールドのコンテンツ タイプは、プリフライト応答の access-control-allow-headers によって許可されません。

以上がNginx設定のクロスドメインリクエストエラーAccess-Control-Allow-Origin * 解決方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。