Development 2025.09.15

【Firebase】Cloud Functions for Firebase のデバッグ方法について

はじめに

担当プロジェクトで Cloud Functions for Firebase（以降、Cloud Functions と呼びます）を活用する機会があり、実装したコードのデバッグをしたいと思ったのですが、公式サイトやいろいろ情報を探してもテキストベースの情報が多く、ちょっとわかりにくいなと。

今後もこういった場面に出くわすことがあると思い、備忘録のためにも、実際に環境を作って、デバッグした方法を残すことにしました。

ここでは、Cloud Functions をエミュレーターにデプロイし、Visual Studio Code（以降、VSCode と呼びます）と連携してデバッグする手順について、まとめています。

用意するもの

・VSCode
・Postman
（HTTP トリガーの Cloud Functions のためですが、ブラウザでも OK です。）

1.「launch.json」ファイル作成＆デバッグ設定を定義

「launch.json」ファイルを作成します。
（今回は、Node.js で Cloud Functions を実装しているため、
　ここでは「Node.js」を選択して、ファイルを作成します。）
作成した「launch.json」ファイルに以下のデバッグ設定を定義します。
　　"version": "0.2.0",
　　"configurations": [
　　 {
　　 "type": "node",
　　 "request": "attach",
　　 "name": "Attach to Functions",
　　 "port": 9229
　　 }
　　]

2.「package.json」ファイルにスクリプトを定義

「package.json」ファイルにエミュレーターを起動するためのスクリプトを定義します。
　　"serve": "firebase emulators:start --inspect-functions"

3. エミュレーターを起動

ターミナルを立ち上げて、Cloud Functions があるディレクトリに移動し、
「npm run serve」コマンドを実行して、エミュレーターの起動と、
VSCode のデバッガー連携をします。
エミュレーターの起動が完了すると、Cloud Functions がデプロイされます。
起動したエミュレーターは、ブラウザからも確認ができます。
（ログを見たり、Firestore の操作などもできます。）

4.Cloud Functions をデバッグ

トリガーに合わせて、Cloud Functions を実行します。
・HTTP トリガーの場合
　　ブラウザや Postman を使用し、エンドポイントにリクエストを送信します。
　　エンドポイントは、通常、以下の形式です。
　　http://localhost:5001/<project-id>/<region>/<function-name>

　　例）http://127.0.0.1:5001/xxx/asia-northeast1/xxxxx?[パラメーター]

・Firestore トリガーの場合
　　Firebase Console のエミュレーター UI（通常 http://localhost:4000 ）で、
　　Firestore にデータを追加 / 更新 / 削除の操作をします。
・Pub / Subトリガーの場合
　　エミュレーター起動後、別ウィンドウでターミナルを立ち上げて、
　　以下の手順で、Shell を起動し、Cloud Functions を呼びます。

　　1. 「firebase functions:shell」コマンドを実行して、Shell を起動します。
　　2. 起動すると、呼び出す Cloud Functions の入力を求められるので、入力します。
VSCode のデバッガーと連携済みのため、Cloud Functions を実行すると、
ブレークポイントで停止することができ、デバッグ操作が可能になります。

おわりに

以上、Cloud Functions のデバッグ方法でした。
エミュレーターが使えることによって、ローカル環境でデバッグができるし、
Firebase Console のエミュレーター UI も提供されているので、
ログの確認や Firestore の操作なども簡単で、とても便利でした。
今後も Cloud Functions を活用する場合は、利用していければと思います。

Development

一覧を見る