Firebase Hostingで動的コンテンツのホスティングができないか調べていたら、「それCloud Functions for Firebaseでできるよ」というドキュメントが英語版だけ存在した(2017年8月時点)ので実際に試してみました。
Cloud FunctionsとFirebase Hostingを組み合わせるメリットは次の3点かと思います。
- 静的コンテンツと動的コンテンツを組み合わせやすくなる
- 動的コンテンツのURLを自由に設定できる
- カスタムドメインの指定ができる
以下、手順を紹介します。
セットアップ
まずFirebaseのコンソールにログインし、適当なプロジェクトを1個作成します。
次にNode.jsを最新版にアップデートします。私はmacOSを使っていますが、他のOSを利用している場合は適宜読み替えてください。
$ brew upgrade node
次にnpmでFirebase用のパッケージをインストールして、Firebaseにログインします。
$ npm install -g firebase-tools
$ firebase login
作業ディレクトリに移動して初期化します。
$ cd node-example-on-firebase-hosting
$ firebase init
注意点というほどではありませんが、firebase init
の最初の質問は、スペースで選択してエンターで確定するというインターフェースになっています。
上の図ではFunctionsとHostingを有効にしています。その次の質問で先ほど作成したプロジェクトと紐付けて、初期化を行います。
初期化が終わると必要ファイルが作られているので、public
以下やfunctions
以下のファイルを適当に編集して、デプロイします。
$ firebase deploy
これで、https://[proj_id].firebaseapp.com/
以下にコンテンツがデプロイされます。
Firebase HostingからCloud Functionsの呼び出し
Firebase HostingのURLとCloud Functionsの紐付けは、firebase.json
のrewrites
で指定できます。
{
"hosting": {
"public": "public",
"rewrites": [
{
"source": "/**", "function": "nodeinfo"
}
]
}
}
上記の設定だと、public以下に存在しないURLが指定された場合は全部nodeinfo
が処理を行うことになります。
カスタムドメインの設定
Cloud Functions単体ではカスタムドメインの指定はできません。せっかくFirebase Hostingと組み合わせたわけですから、そのメリットを生かす意味でカスタムドメインを紐付けてみましょう。Firebaseコンソールの「Hosting」「ダッシュボート」から「ドメインを接続」を選びます。
上記のように自分が管理するドメインのFQDNを指定した上で、DNS設定を行います。
自分がドメインの所有者であることを示した上で1、しばらくすると2SSL証明書が自動的に発行され、カスタムドメインにHTTPS経由でアクセスできるようになります。
デモサイト
そんなこんなで作ったデモサイトは下記です。
上記URLではnodeinfoというパッケージを使ってサーバの情報を表示しています。
今後の変遷を確認する意味で、ブラウザのキャプチャ画像も残しておきます。
上記サイトに対応するgitリポジトリは下記です。同じ内容でデプロイしてみたい方はご利用ください。
料金
気になる料金ですが、無料枠だけでもアプリケーションの性質次第では便利に使えそうな印象です(参照:Firebase 料金表)。
無料枠で使っていて最初に引っかかりそうなのはCloud FunctionsのCPU時間で、月間4万CPU秒が上限です。上記デモサイトの場合は1リクエストで200ms程度かかっているので、月間20万リクエストでクォータに引っかかることになります。これを多いとみるか少ないとみるかは人それぞれでしょうが、仲間内で使う程度のサービスなら十分すぎるように思います。
ただ、無料枠だとGoogle外部へのネットワーク通信ができません。これは作りたいアプリケーションによっては厳しい制約だと言えそうです。また、RDBが欲しいような場合には別のサービスを利用した方が良さそうな気がします。この環境にこだわりたい場合はFirebase Realtime Database(Firebase独自のNoSQL)で頑張れるかもしれません。