Reason: CORS header 'Access-Control-Allow-Origin' missing

理由

Reason: CORS header 'Access-Control-Allow-Origin' missing

何に失敗したか

CORS 要求への応答が、リソースが現在のオリジン内で操作しているコンテンツによってアクセスできるかどうかを判断するために使われる、必須の Access-Control-Allow-Origin ヘッダーを欠いています。

サーバーを自分で制御できる場合は、要求しているサイトのオリジンを Access-Control-Allow-Origin ヘッダーの値に追加して、アクセスが許可されているドメインの一覧に追加してください。

例えば、 https://amazing.site のサイトが CORS を使用したリソースにアクセスできるよう許可するためには、ヘッダーを以下のようにしてください。

Access-Control-Allow-Origin: https://amazing.site

"*" を使用することで、あらゆるサイトにアクセスを許可するようサイトを構成することもできます。これは公開 API にのみ使用してください。非公開の API には "*" を使用するべきではなく、代わりに具体的なドメインやドメインの一覧を設定してください。加えて、ワイルドカードは crossorigin 属性が "anonymous" に設定された要求にのみ動作します。

Access-Control-Allow-Origin: *

警告: ワイルドカードを使用して非公開の API にアクセスすることは、明らかに悪い考えです。

例えば Apache では、サーバー構成 (の中の <Directory>, <Location>, <Files>, <VirtualHost> のうち適切な節) に次のような行を追加してください。構成はふつう、 .conf ファイル又は (一般的な名前は httpd.confapache.conf) 又は .htaccess ファイルにあります。

Header set Access-Control-Allow-Origin 'origin-list'

Nginx では、このヘッダーを設定するコマンドは次の通りです。

add_header 'Access-Control-Allow-Origin' 'origin-list'

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09
最終更新者: mfuji09,