Firebase FunctionsでonCallで実装しているにも関わらずCORSエラーが発生した場合

公開日時

Firebase Functionsをデプロイして確認しようとしたところCORSエラーが発生した。

No 'Access-Control-Allow-Origin' header is present on the requested resource.

https.onCallで実装している場合はCORS設定はSDK側で自動で行われるはずなので不可解な現象だ。

複数あるFunctionsのうちの一つだけ上記エラーになっていたのも気になる点。

Firebase Functionsの管理画面を見ても特におかしな点は見当たらなかった。

ふと気になってGCPの管理画面でCloud Functionsのページを確認してみたところ、該当のAPIのみ「未認証を許可」が付与されていないことに気づいた。

firebase gcp

そこで、該当のFunctionを一度削除して、再度Firebase Functionsをデプロイし直したところ、「未認証を許可」が付与され正常にonCallリクエストが呼べるようになった。

実装はじめの頃に firebase deploy --only functions でデプロイを行った際に該当APIでエラーが起きていたのでこれが原因かもしれない。

(その後も何度かデプロイを行っていたがエラーなくデプロイできていたので、実際にAPIを呼び出すまで気づかなかった。)

まとめ

  • onCallでCORSエラーが起きた場合は、Cloud Functions(GCP)の管理画面を確認してみる
  • 「未認証を許可」が付与されていない場合は、一度Functionを削除して再デプロイする

Related #firebase

Firestore エミュレータ使用時にデータをリセットする

エミュレータの場合のみ一括削除用のAPIが用意されている

Error: Input required and not supplied: firebaseServiceAccount

Dependabotによって作成されたPull Requestのみで発生している

Firebase公式Github ActionsでPull RequestごとにHostingのプレビュー環境を作る

手軽にプレビュー環境で動作確認できるようになったので、継続的なアップデートがやりやすくなった