MAGAZINE

ルーターマガジン

JavaScript/Node.js

Firebaseで本番/検証/開発環境ごとに環境変数を設定する方法

2020.03.13
Pocket

はじめに

こんにちは、学生アルバイトのkoyamaです。僕の趣味はギターを弾くことなのですが、 ギターを何本か所有していると練習用のギターと録音・ライブで使う用のギターみたいな感じで使い分けをしはじめるんですね。 使い分けをするのはいいんですが、練習用のギターから録音用のギターに持ち替えた時にどうにも手の感覚が違ってうまく弾けないなんて言う本末転倒なことがしばしば起こってしまい、これが今の悩みの種なのです......

さて、練習と本番で使い分けると言えば開発環境と本番環境でも環境変数をみなさん使い分けますよね? Firebaseではソース上に環境変数を書き込まずにプロジェクトごとに設定することができます。 今回はそんな開発環境と本番環境の行き来が楽になる方法を紹介します。

本編:Firebase functionsで本番/検証/開発環境ごとに環境変数を置き換える

Firebaseの環境変数はコマンドライン上でfirebaseコマンドを使用して設定します。Firebaseで複数プロジェクトを作成することで本番/検証環境を切り替える使い方も多いと思いますので、まずは接続先Firebaseプロジェクトを設定します。

$ firebase use {環境変数を設定するproject}

環境変数を設定したいプロジェクトを設定したら

$ firebase functions:config:set project_config={"client_id":"this_is_client_id","secret":"this_is_client_secret","email":"user_email@gmail.com"}
このように、firebase functions:config:set {設定したい内容をJSON形式で記載}というふうにして設定を行います。

また、設定した環境変数をコマンドライン上から確認する場合は

$ firebase functions:config:get
{
  "project_config": {
    "client_id":"this_is_client_id",
    "secret":"this_is_client_secret",
    "email":"user_email@gmail.com"
  }
}
これで設定した環境変数をJSON形式で確認できます。

設定した環境変数をindex.jsで呼び出す時には

let client_id = functions.config().project_config.client_id
console.log(client_id)
#"this_is_client_id"
こんな風にして環境変数を扱えます。

Tips

環境変数をプロジェクトに設定する際にJSONを直接コマンドライン上に書き込まないといけないので非常に面倒臭い...... ので別ファイルに環境変数として設定するJSONを書いて、それをcatして読み込ませるようにしてみるとかなり楽です!
#project_config.json
{
  "client_id":"this_is_client_id",
  "secret":"this_is_client_secret",
  "email":"user_email@gmail.com"
}
$ firebase functions:config:set project_config="$(cat project_config.json)"
✔  Functions config updated.
ヨシ!(catだけに)

さいごに

どうでしょうか?環境変数を設定することでテスト環境→本番環境のためにソースを書き換える手間も減って、開発がスムーズになるのは間違いないでしょう
Pocket

CONTACT

お問い合わせ・ご依頼はこちらから