🥏

Google CloudでレスポンスにCORSを設定

2023/06/14に公開

やりたいこと

ロードバランサーにドメインを紐づけ、VMやStorageからデータを配信する構成は多いと思います。

そこで、 ロードバランサーでCORSヘッダーを付与 する方法を記載します。

やりかた

ロードバランサーの設定で簡単にヘッダーを追加できます。
(HTTPの話なので、)

まず、バックエンドのサービスを登録する作業を行います。

サービス作成画面を下にスクロールすると「高度な構成」があるので開きます

項目の中に「カスタム レスポンス ヘッダー」があります。
ここに、CORSヘッダーを追加しておきましょう。

CORS対応で少なくとも次の3つくらいは設定すると良いでしょう。

Access-Control-Allow-Origin: (アクセスを許可するオリジン、全許可なら 「*」)
Access-Control-Allow-Methods: (リクエストを許可する HTTP メソッド、複数なら「GET,POST」のように「、」区切り、全許可なら 「*」)
Access-Control-Allow-Headers: (リクエストに使用できる HTTP ヘッダー、全許可なら 「*」)

(セキュリティ上よくありませんが、急ぎで全許可する場合は↓)

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Headers: *

後は、ロードバランサーを普通に作成(or 更新)すれば反映されます。

ロードバランサーを更新した場合は、「更新完了」が表示されてから実際に反映されるまで(1分くらい?)かかります。

ヘッダーが付与されたことを確認します

終わり

Discussion