複数オリジンからのアクセスをHTTP Access-Control-Allow-Originヘッダーで許可する方法

1396 ワード
CORS Apache Access-Control-Allow-Origin Apache テキストリンク

HTTP Access-Control-Allow-Originヘッダーを用いて、複数の別オリジンのフロントエンドアプリから、APIを呼び出すためのCORS設定方法をまとめる。

ユースケース

  • 以下のようなApacheをWebサーバーとして配置する構成のアプリ(API)を、複数の別オリジンのフロントエンドアプリから呼び出したい場合

実現手段

  • Apacheの設定ファイルを、許可するオリジンからのリクエストである場合にAccess-Control-Allow-Originヘッダーを付与するように記述する。
SetEnvIf Origin "^http(s)?://(www\.)?(domain-x\.com|domain-y\.com|domain-z\.com)" ALLOWED_ORIGIN=$0
Header set Access-Control-Allow-Origin %{ALLOWED_ORIGIN}e env=ALLOWED_ORIGIN
  1. リクエストのOriginヘッダーを正規表現判定する。※判定ルールは環境変数として外出ししても良い。
  2. マッチしたOriginを変数ALLOWED_ORIGINに代入する。
  3. レスポンスのAccess-Control-Allow-OriginヘッダーにOriginヘッダーの値がセットされる。

参考情報