これの続き
Access-Control-Allow-Origin の値を動的に設定する必要があるパターン
複数のオリジンからクロスドメインのリクエストを受けるサーバが Access-Control-Allow-Origin
を返す場合、オリジンごとに異なる値を動的に返す必要がある。
- 参考: Nginxの場合のこんな感じの設定を書く
その場合、CDNが問題になる
途中にCDNが挟まってる場合、Access-Control-Allow-Origin
が、最初に来たオリジンのままで固定されてしまう。
これにより、Access-Control-Allow-Origin
の値と異なるオリジンからのリクエストがすべて、CORSエラーになってしまう。
その対策
レスポンスヘッダに Vary 'Origin'
を追加する。
Vary とは?
キャッシュ時にURL以外に、キーとなるリクエストヘッダの値を決める設定。
例えば Vary : Accept-Language
とすると、同じURLでも、言語ごとにキャッシュされるようになる。
んで、Vary 'Origin'
の場合、Origin
がキーになる。
Origin
は、クロスドメインのリクエストを投げた場合に、元々のドメインが格納されるリクエストヘッダ。
そうすれば、複数オリジンからのリクエストごとに、異なる Access-Control-Allow-Origin
を返すレスポンスをそれぞれキャッシュできる。
参考
Access-Control-Allow-Origin の値が ("*" ワイルドカードではなく) 具体的なオリジンであるレスポンスをサーバーが送信する場合、レスポンスには Vary レスポンスヘッダーに Origin という値を設定して、 Origin リクエストヘッダーの値によって値が変わることをブラウザーに対して示してください。