お手軽で快適なサーバレス開発『Firebase入門』

Googleが提供するFirebaseに関する解説書です。バックエンドの処理をサーバを用意せずクラウドで行うことができるサービスです。データベースや関数実行、ログイン機能などが利用できます。いわゆるサーバーレスアーキテクチャってやつです。

Firebaseには無料で使える枠もあるので、試しに利用することが出来ます。サーバ管理の必要はなく設定も簡単です。サーバ用意するよりも断然お手軽ですが、その分自由度と性能の面で相談することになります。Webサービスはもちろん、スマホアプリのバックエンド処理に用いられることも多く、とても便利なサービスです。

入門書を見つけたので、一通り読んで試してみました。公式のドキュメントでもそれなりに使えますが、この本ではWeb・iOS・Androidのプラットフォームでの使い方が紹介されています。実際にFirebaseの管理画面を触りながら進めると理解が深まるのでおすすめです。

アプリやWebサービスを作ってみた、次はバックエンドでデータベースやログインの実装をしたい、と考えている人に読んでほしいです。

サーバ立てて実装するか、Firebaseで済ませるか検討してみるのもおもしろいです。

サーバーレスを選択する必要性

簡単に実装できること、サーバ管理の負担がなくなることなどが挙げられます。

サーバ管理者の負担

サーバの管理は思ったより大変です。アクセス集中したサーバが落ちたり、障害が発生することもあり心配事は多いです。ハード・ソフト・デプロイ・メンテナンス・ネットワーク・データベース・電源・HDD・サイバー攻撃・アップデートとか、それはもうさまざまです。

オンプレミス以外のクラウドサービス・VPSなどの選択肢も増え、責任をサービスに任せられる形になりましたが、それでもサーバ管理・立ち上げ・運用は大変です。

専門知識も問われるので、管理する専門の人を用意しないといけないこともあります。サーバ管理者は新しい知識が得られるおもしろい領域ですが、プログラミングをガンガン書くわけではないため、縁の下の力持ちな役目になります。システム運用においてとても重要なのですが、皆さんは興味はあるでしょうか。

サーバーレスという代替案

その辺の懸念を軽くできるのがサーバーレスという手法です。代表的なプラットフォームとしてGoogleの提供するFirebaseが挙げられています。

ユーザー認証・データベース・ストレージ・ホスティング・クラウドファンクション・機械学習・アナリティクス・メッセージング・プレディクションなどの機能が利用できます。一部ベータ版の機能もありますので確認してから利用しましょう。

Firebaseでは無料プランがありますので、とりあえずこれを使ってみましょう。枠を超えると利用できなくなるので有料プランに拡張する必要があります。定額のものと従量課金のプランが用意されています。

サーバーと並行して利用する手法

中のコラムでサーバレスの利用実例がありました。巨大なWebAppをAWSのサーバで動かしており、データベースもAWSで動いているサービスです。

そこにスマホ版のアプリを作成します。アプリでのみ必要なデータに関しては、Firebaseを利用してデータを扱うようにします。アプリでのみ表示できる特集記事のデータとかでしょうかね。

このようにすでに動作しているサーバと並行して、追加のデータサービスを追加する場合などに、サーバレスを使うことがあるようです。利用用途がWebとスマホで切り分けられるのであれば確かに良い使い方だと思います。

各プラットフォームでの利用法

Webの場合、クライアント側でscriptで利用する場合と、node.jsで動かす場合が選べる。
AndroidはJavaでAndroidStudioを利用する場合。
iOSはSwiftでXcodeとCocoaPodsを利用する場合。

全編これらの実装パターンを紹介していますので、当てはまるプラットフォームの内容を読んでいけば良いです。実質3分の1位を読めば良いです。私はWebでの利用が多いので、Webの部分を重点的に読みました。

WebでFirebaseを利用する上で参考

モジュールの利用

firebasee.jsはすべての機能を含むためで容量が大きい。 firebase-app.js+各機能のパッケージを使うことで容量を削減できる。

データベースの利用

この本ではRealtime DatabaseとCloud firestore両方の情報が書いてあります。これからはCloud firestoreがメインになっていくのかと思いますが、両方の基礎的な知識と使い方が書いてあります。

whereについて

CRUDは普通に出来ます、データ取得するときに並び替え、絞り込みも可能です。絞り込みについてはちょっと特殊でした。前方一致検索の場合

doc.where("name",'>=', "検索文字").where("name",'<=',"検索文字"+ '\uf8ff').get().then()

ざっくりこんな感じです。ポイントはWhereをチェーンでつなげることと、「\uf8tt」の文字を連結したものを指定します。この文字はFirebaseのドキュメントを見たところ以下の記載がありました。覚えておこうと思います。正規表現でも利用できたら便利なんですけどね。

\uf8ff 文字は Unicode 範囲内の非常に高いコードポイントです。  
この文字は Unicode のほとんどの通常文字より後に来るため、クエリは 検索文字 で始まるすべての値に一致します。

Storageの利用にはCORSの設定が必要

FirebaseのStorageの機能を利用することでファイルをクラウドに配置しておくことが出来ます。

しかしHostingで与えられるドメインとStorageで与えられるドメインが異なるためCORSの制約に引っかかります。そのままでは利用できません。以下の内容のエラーが発生します。

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

ちなみに「CORS」とは「オリジン間リソース共有、 Cross-Origin Resource Sharing」の略です。異なるドメインへのフロントエンドのリクエストに関しては制御されており、許可されていないとデータは送信されません。Firebasee Storageでもこの制御があるため、設定する必要があります。

CORSの設定変更方法

Google Cloud SDKのインストール

https://cloud.google.com/sdk/ からインストールします。

Firebaseの機能は実はGCPを利用しています。ですのでStorageの機能の設定については、GCP経由で設定を行う必要があるようです。

インストールが完了したら以下のコマンドを実行します。新しい構成を作成するコマンドでGoogleアカウントでのログインが求められます。Firebaseのアカウントと同じものでログインしましょう。
```
gcloud init
```
cors.jsonの作成

以下のファイルを作成します。ファイル名は「cors.json」にします。originの部分にはHostingのドメインを設定します。
```
[
    {
        "origin": ["https://tenka-ichi.web.app"],
        "method":["GET","PUT","POST","DELETE"],
        "maxAgeSecond":3600
    }
]
```
jsonの設置

Storageに割り当てられているURLを確認します。Firebase管理画面のStorageのファイルの画面で上部に表示されています。以下のような形式のURLです。〇〇のところはプロジェクトの名称が入っています。
```
gs://〇〇.appspot.com
```
上記で確認したURLを使って以下コマンドを実行することで、cors.jsonをアップロードします。
```
gsutil cors set cors.json gs://〇〇.appspot.com
```