2020/08/06

 

Firebase とは

Firebase は Google が提供する MBaas 型サービスで、Webやスマホアプリ開発で必要なサーバ側(バックエンド)の処理を自前サーバを用意せずに支援します。

似たようなサービスに AWS Amplify があり、Firebase と比較して高機能なため最近 Amplify のシェアも伸びています。

開発レベルであれば基本的に無料

Firebase は利用した分だけ課金される「従量課金性」ですが、条件の範囲に収まっていれば無料で利用できます。

開発レベルや大量の通信やアカウントのアクセスがなければ無料で運用できるかも知れません。

2つのプラン

Spark

Sparkプランは、サービスによって機能制限があります。無料枠を使い切った場合にデータ取得ができなくなります。

Blaze

Blazeプランは、無料枠を使い切ったあとに従量課金制で、大規模開発に対応する全ての機能が利用できます。

認証やデータ取得の回数に応じて課金されるので、料金計算シミュレーターやアラート設定などを利用して料金を抑えるようにしましょう。

Firebase のメリット

Firebase を利用するメリットは、

  • アプリとサーバでデータのリアルタイム同期を実現
  • 自前サーバを用意しなくてもよい
  • 面倒な SNS認証やプッシュ通知が簡単に実現
  • 様々な言語に対応(JavaScript、Swift、Objective-C、Java など)

など、サーバ側の処理を 1から開発することなくアプリ開発に集中できます。

Firebase の主な機能

Firebase の主な機能として、静的コンテンツ(HTML、画像など)を配置したり、データベースのリアルタイム通信、SNS認証やプッシュ通知といった、ネットワーク経由でリアルタイム性のある機能をサポートします。

主な機能は以下の通りです。

Realtime Database(リアルタイムデータベース)

https://firebase.google.com/docs/database?hl=ja

NoSQL のクラウドデータベース(JSON型で保存)で、タイムラグの少ない同期を実現します。

Cloud Firestore

https://firebase.google.com/docs/firestore?hl=ja

リアルタイムデータベースの高機能版で、Google では Firestore を推奨しています。

料金は動作によって異なりますが無料枠があります。(2020/08時点)

無料枠

無料枠 割り当て
保存データ 1 GiB
ドキュメントの読み取り 50,000/日
ドキュメントの書き込み 20,000/日
ドキュメントの削除 20,000/日
ネットワーク(下り) 10 GiB/月

超過分

  無料割り当て超過分の料金
ドキュメントの読み取り ドキュメント 100,000 点あたり $0.06
ドキュメントの書き込み ドキュメント 100,000 点あたり $0.18
ドキュメントの削除 ドキュメント 100,000 点あたり $0.02
保存データ $0.18/GiB/月

https://firebase.google.com/docs/firestore/pricing?hl=ja

Cloud Functions

https://cloud.google.com/functions/docs?hl=ja

Cloud functions は軽量なコンピューティングで、サーバ環境を用意せずにアプリからリクエストしたときに即座に応答する仕組みです。

Cloud 上でスタンドアロンの関数を作成することで実行でき、同じようなサービスに「AWS Lambda」があります。

料金は月間 200万回以内は無料で、それ以降は 100万回ごとに $0.40 料金が発生します。(2020/08時点)

https://cloud.google.com/functions/pricing?hl=ja

Cloud Storage

Cloud Storage は、アプリで利用する画像や動画などのコンテンツを保管するクラウドサービスです。

安全性と品質の高いネットワークで Firebase アプリでのファイルのアップロード・ダウンロードができます。

無料枠

リソース 1 か月あたりの無料使用量上限
Standard Storage 5 GB(期間合計)
クラス A オペレーション 5,000
クラス B オペレーション 50,000
ネットワーク(下り) 1 GB、北米から各 GCP 宛て下り(外向き)ネットワーク(オーストラリアと中国を除く)

https://cloud.google.com/storage/pricing?hl=ja

クラス A, B オペレーション

https://cloud.google.com/storage/pricing?hl=ja#operations-pricing

Firebase Authentication

アプリとサーバでデータ送受信や連携するには「ユーザー ID」の識別が必要で、メール、OAuth 、SNS など様々な認証が利用できます。

アプリ側では、FirebaseUI Auth や Firebase Authentication SDK を利用して認証します。

Firebase Hosting

Firebase Hosting は Webアプリや静的・動的コンテンツなどを、ドメインと紐づけて本番環境とホスティングするサービスです。

Web アプリを高速にデプロイしたり、コンテンツを CDN で配信することができ、SSL にも自動的に発行され安全性・信頼性も高くなっています。

Firebase Cloud Messaging

Firebase Cloud Messaging は、デバイス対して 通知メッセージやデータメッセージを送ることができます。 

※従来の Google Cloud Messaging API は非推奨となっています。

Firebase Admin SDK または FCM サーバー プロトコル を利用して送信します。

Firebase の利用

大量のネットワーク通信が発生し、リアルタイム性を求められると自前のサーバで運用するのは困難です。

Google が用意した SDK と Firebase のプロダクションを利用することでサーバ設定の負担が減り、アプリ開発に集中することができます。

AWS Amplify と機能を比較しながら利用するとよいでしょう。

  2020/08/06

Firebase プロジェクトの作成

Firebase コンソールにログインして【プロジェクト作成】をクリックします。

https://console.firebase.google.com/

利用規約を聞かれたら同意して続行します。

プロジェクト名を入力して【続行】します。

テストなので Google アナリティクスは無効にして【プロジェクト作成】します。

プロビジョニングがはじまり、しばらくするとプロジェクトが作成されます。

【続行】すると作成したプロジェクトのコンソール画面が表示されます。

Authentication(認証)の追加

プロジェクトを作成したら、Firebase の認証情報を登録してみましょう。

コンソール画面の Autentication を開きます。

Authentication 画面の【ログイン方法を設定】をクリックします。今回は Webアプリで登録していきます。

アプリと登録でアプリのニックネームを入力し【アプリを登録】をクリックします。

「メールアドレスとパスワードを利用してログイン」を有効にし【保存】します。

Firebase SDK の追加で、JavaScript タグが表示されるのでファイルにメモっておきます。

【ユーザを追加】をクリックするとダイアログが開くので、メールアドレスとパスワードを入力してユーザを作成します。

 

Cloud Firestore の作成

リアルタイムデータベースの Cloud Firestore を作成します。

ここでは「テストモードで開始」を選択して【次へ】をクリックします。「本番環境で開始」の場合はセキュリティルールの設定が必要です。

ロケーションは「asia-northeast2」を選択して【完了】をクリックします。

これで、firestore のデータベースが作成されました。

Firebase CLI をインストール

Firestore を作成したら、ターミナルから Firebase CLI を利用できるようにします。

Firebase CLI のインストールは 3種類あります。

  • 自動インストールスクリプト(Windows 非対応)
  • スタンドアロンバイナリ(OS別インストーラ)
  • npm インストール(Node.js パッケージ管理)

今回は、npm でインストールしてみました。

自動インストールスクリプトでインストール


$ curl -sL https://firebase.tools | bash

npm でインストール

※あらかじめ Node.js をインストールしてください。


$ npm install -g firebase-tools

バイナリインストール

OS によって違うため以下の Firebase ヘルプを参考にダウンロードしてください。

https://firebase.google.com/docs/cli?hl=ja

Firebase CLI の実行

まず Firebase 上でプロジェクトが作成されたか確認します。


$ firebase projects:list
✔ Preparing the list of your Firebase projects
...
firebase-test         │ fir-test-dd528 (current) │ 1011264689033  │ asia-northeast2      │
....

Firebase ログイン

Firebase にログインします。


$ firebase login

ダイアログが表示されたら、Google アカウントを選択してログインを許可します。

ログイン成功するとターミナルでも成功と表示されます。


✔  Success! Logged in as xxxx@gmail.com

Firebase プロジェクト

Firebase プロジェクトの作成


$ mkdir firebase-sample
$ cd firebase-sample
$ firebase init

利用するプロダクトをスペースキーで選択してリターンキーで次に進みます。
(あらかじめ Firebase コンソールでプロダクトを作成しておく必要があります)


? Which Firebase CLI features do you want to set up for this folder? Press Space to select features, then 
Enter to confirm your choices. (Press  to select, to toggle all, to invert selection)
❯◯ Database: Deploy Firebase Realtime Database Rules
 ◯ Firestore: Deploy rules and create indexes for Firestore
 ◯ Functions: Configure and deploy Cloud Functions
 ◯ Hosting: Configure and deploy Firebase Hosting sites
 ◯ Storage: Deploy Cloud Storage security rules
 ◯ Emulators: Set up local emulators for Firebase features

利用するプロジェクトを選択してリターンキーで次に進みます。


? Please select an option: Use an existing project
? Select a default Firebase project for this directory: fir-test-dd528 (firebase-test)

「firestore.rules」「firestore.indexes.json」ファイルはデフォルト設定としてリターンします。


? What file should be used for Firestore Rules?
...
? What file should be used for Firestore Rules? (firestore.rules)
=== Firestore Setup
...

さいごに

これで、Cloud Firestore を利用する準備ができました。

次はデータを登録、取得などの処理を、アプリの言語にあわせてプログラム作成してみましょう。

参考

Firebase を JavaScript プロジェクトに追加する

<< Top < Prev Next > Last >>