web-dev-qa-db-ja.com

Access-Control-Allow-Origin:資格情報フラグがtrueの場合、「*」は許可されませんが、Access-Control-Allow-Credentialsヘッダーはありません

突然、Webアプリで何も変更せずに、Chromeで開くときにCORSエラーが表示されるようになりました。 Access-Control-Allow-Origin: *ヘッダーを追加してみました。それから私はこのエラーを受け取ります:

XMLHttpRequest cannot load http://localhost:9091/sockjs-node/info?t= 1449187563637. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:3010' is therefore not allowed access.

しかし、次の画像でわかるように、Access-Control-Allow-Credentialsヘッダーはありません。

enter image description here

WTF? Chromeバグ?

私のページはhttp://localhost:3010にロードされ、そのサーバーもAccess-Control-Allow-Origin: *を問題なく使用します。 2つのエンドポイントの両方がそれを使用する場合、問題はありますか?

15
Andy

「資格情報フラグ」は、XMLHttpRequest.withCredentialsヘッダーではなく、リクエストのAccess-Control-Allow-Credentialsを指します。それが私の混乱の原因でした。

リクエストのwithCredentialstrueの場合、Access-Control-Allow-Origin: *ヘッダーがなくても、Access-Control-Allow-Credentialsは使用できません。

23
Andy

withCredentials:trueで構成されたサーバー上のAccess-Control-Allow-Origin: *リクエストを使用できますが、サーバーでさらに追加の設定が必要:

サーバーでAccess-Control-Allow-Origin=*を使用すると、xhr CORS要求で(資格情報を必要とする)リソースへのアクセスが許可されません。

回避策:

  1. サーバー上のそのリモートリソースを資格情報なしでアクセス可能にします(そしてxhr.withCredentials = falseを使用します)
  2. サーバーで書き換えルールを作成し、応答ヘッダーAccess-Control-Allow-Origin=*を要求のオリジンに変更します。また、リクエストが特定のポートを使用している場合や、ホワイトリストに登録されたドメインのリストからのものである場合など、特定の基準でこの書き換えを適用することもできます。

IISサーバー でこれを行う方法を説明する記事ですが、他の多くのサーバーでこれを行うことができます。

PS:資格情報を使用する場合、サーバーの応答に次のヘッダーも必要になります:Access-Control-Allow-Credentials=true

PS2:「access-control-allow-Origin」パラメーターに許可される値は1つだけです。たとえば、domain1.com domain2.comという2つのドメインを使用しようとすると、機能しません。

3
Alberto

同じ問題を解決しましたこれらの手順を使用して..

1)chrome拡張機能「Allow-Control-Allow-Origin」を無効にします

2)これらをサービスに追加します

var xhr = new(); xhr.withCredentials = true;

2
Jayani Sumudini