Closed Ayato-kosaka closed 5 months ago
ローカル環境で立ち上げると画像を保存できる。
~■ リリース漏れ?~ 379a7a6 で対応したはず。 main ブランチに入っている。 https://github.com/Ayato-kosaka/spelieve/actions/runs/7099908583 で 12/5 にリリースされているはず。 Hosting -> サイトの管理 を見るに、 513eb8 が該当する。
■ #861 の解消確認漏れ →要対策検討
~■ storage-rule のデプロイ漏れ?~ → spelieve-dev/storage と tinerary-4aee3/storage のルールに差分を検知。 → 上書きしたが、解消されず。 →恒久対応として https://github.com/Ayato-kosaka/spelieve-firebase でバージョン管理したいが、一旦本番環境のルールを開発環境に合わせる。
~■ #861 の対応(#796 の対応)が入っていない?~
access-control-allow-origin: *
が入っているが、本番環境ではない。■ API 呼び出し元が悪いのか、呼び出し先が悪いのか 開発環境のフロントエンドから本番環境のストレージにつないで見る。 →CORS エラーとなる → つまり、本番環境の Firebase Storage の設定がなにかおかしい
■ Google Cloud Storage の設定がおかしい?
→ gsutil cors get gs://itinerary-4aee3.appspot.com
で確認したところ、開発環境では CORS の設定がされているが、本番環境ではされていない。
→ 解消
参考
https://qiita.com/chima91/items/0cd46b5965e087609ef5
Bug report
Describe the bug
A clear and concise description of what the bug is.
console.error
Access to image at 'https://firebasestorage.googleapis.com/v0/b/itinerary-4aee3.appspot.com/o/ec7635c1-45a1-4fa0-94ba-fdec33218ffd?alt=media&token=d2f22f30-d020-472e-a77b-76a465d59e8d' from origin 'https://www.spelieve.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
A clear and concise description of what you expected to happen.
Screenshots
If applicable, add screenshots to help explain your problem.
Environment
Additional context
Add any other context about the problem here.
Solution result
Cause (バグの原因)
https://github.com/Ayato-kosaka/spelieve/issues/861 の解消確認漏れ Google Cloud Storage の CORS 設定の開発/本番乖離
How to fix (どのようにして解決したか)
本番環境の Google Cloud Storage の CORS 設定を実施。 参考 https://qiita.com/chima91/items/0cd46b5965e087609ef5
Roll Out
他機能への影響範囲と対応計画を記載する
解消確認をリリース後に本番環境で漏れ → リリース手順に本番環境で解消確認することを明記
Google Cloud Storage の CORS 設定の開発/本番乖離 → Google Cloud Storage の CORS 設定のバージョン管理を開始。GitHub Actions を用いたデプロイは gutil の使用方法がわからないため、一旦保留