ファイルの配信にGCSを使っていてCORB(Cross-Origin Read Blocking)が出たときの対処方法

目的

google cloud storage(以下GCS)バケットを新規作成して、そこからファイル参照するとchromeにCORBで怒られてしまう問題を解決します。

どうしてこうなった？

一部のファイルが表示できない。 なんで？
→コンソールにCORBと出ているのを発見。
CORBとは？
→Cross-Origin Read Blocking (CORB) - Chrome Platform Status
もしやCORSの問題？GCSのドキュメントを見る
→ クロスオリジン リソース シェアリング（CORS）  |  Cloud Storage  |  Google Cloud
それっぽい。CORS構成してみる
→ クロスオリジン リソース シェアリング（CORS）の構成  |  Cloud Storage  |  Google Cloud

やったこと

バケットのCORS構成を確認

gsutil cors get gs://my_bucket_dev
→ gs://my_bucket_dev/ has no CORS configuration.
CORSの設定されていませんでした。

問題ないバケット

gsutil cors get gs://my_bucket
→ [{"method": ["*"], "origin": ["*"]}]
CORS設定されていました。　が、この設定は・・・

CORSの設定

cors.jsonを作る
中身は適宜必要なものにすること

[
    {
      "origin": ["http://example.appspot.com"],
      "responseHeader": ["Content-Type"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 3600
    }
]

以下のコマンドでバケットにCORSの設定ができます。
gsutil cors set cors.json gs://my_bucket