3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

一人ゲーム開発TipsAdvent Calendar 2024

Day 15

サーバーサイドなんもわからんアナタに向けたハンズオン Unity × gRPC × Go × Firebase × Docker 〜第四章、Firebaseプロジェクトの作成とFirebaseSDK導入〜

Last updated at Posted at 2024-12-14

最初に

本記事の内容は、サーバーサイドにほとんど触れてこなかったUnityエンジニアに向けて、最近の主流構成を学びながら少しずつサーバーの知識を身につけられるハンズオン形式で進めます。この記事が、サーバーサイドに対する理解を深める一助になれば幸いです。

本記事の対象者は以下の通りです。

  • A Tour of Goを一通り終わらせたが次に何をするべきかわからない初心者サーバーエンジニア
  • gRPCについて学びたいが、Unityとの関連性も知りたい初学者
  • なんとなくGoやgRPCについては理解できるけど、具体的な仕組みについて知りたいUnityエンジニアの方

また、今回のハンズオン記事は全7章が存在します。

こちらから他の章も見ていただけると嬉しいです!
「第一章、環境構築」
「第二章、Cloud Runへのデプロイ」
「第三章、CI/CDパイプライン構築」
「第四章、Firebaseプロジェクトの作成とFirebaseSDK導入」
「第五章、FirebaseSDKを用いたアカウント作成とログイン実装」

今回の環境

  • OS : MacOS
  • IDE : GoLand
  • Gitクライアント : Fork

前提

以下の記事を終えているか、チャットアプリケーションを作るにあたって、必要な設定をGCP上で行う準備ができていることを前提としています。

サーバーサイドなんもわからんアナタに向けたハンズオン Unity × gRPC × Go × Firebase × Docker 〜第三章、CI/CDパイプライン構築〜 - Qiita

また、記事の内容を自由に学習できるよう、GitHub上に公開リポジトリを作成しました。各ステップに対応したバージョンをReleasesとして登録しているので、興味のあるステップから学習を始められます。

上記リポジトリ内容を使用して特定のステップから始める場合はリポジトリをForkするか、手元にDownloadなどをしてから進めるようお願いします。


1. Firebase プロジェクトの作成

Firebaseを使用してユーザーログイン機能を実装するためには、まずFirebase上でプロジェクトを作成をする必要があります。このプロジェクトは、バックエンドでの認証やデータ管理の基盤として用意します。

Firebaseとは?
Firebaseは、Googleが提供するモバイルアプリやウェブアプリの開発をサポートするためのクラウドベースのサービス群です。Firebaseを使うことにより、開発者はアプリのバックエンドの構築や運用を簡素化し、アプリの機能追加やスケーリングを容易に行うことができます。
プッシュ通知や、アナリティクス、クラッシュレポートの収集など、いろんなことができるので、Firebaseを採用しているゲームプロジェクトも多いと思います。

それではプロジェクトをセットアップしていきましょう。


Firebaseコンソールへアクセス

まずは、以下のFirebaseのサイトにアクセスして、「Firebaseプロジェクトを使ってみる」をクリックし、新しいプロジェクトを作成してください。

image.png


プロジェクトを設定する

最初の画面では、プロジェクト名の入力を求められます。

しかし今回はすでにGoogle Cloudプロジェクトが存在しているので、左下に小さく書いてある「Google Cloud プロジェクトに Firebase を追加」をクリックしてください。

image.png

以下の画面に移ったら、今回のハンズオンプロジェクトである「grpc-chat-app」を選択します。選択ができたらそのまま「続行」してください。

image.png

もし、この段階で料金プランの説明が入った場合は、Blazeプランを選択してください。
image.png

その際に、支払い情報などの紐付けが必要となりますが、今回のハンズオンでは無料枠内で進めていくため、実際には支払いは発生しない想定です。

料金プランの変更は、後からでも変更できます。
ハンズオンを一通り済ませた後はSparkプランに戻しておくと安心でしょう。

プラン変更はFirebaseコンソール画面の左下にある料金プラン表示からできます。
image.png


Googleアナリティクスの設定とプロジェクト作成

Googleアナリティクスを有効にするかどうか聞かれます。

Googleアナリティクスは、Firebaseプロジェクト全体のユーザー動向を可視化し、A/BテストやCrashlyticsなどの機能をサポートします。

今回のハンズオンでは使用しないので、オフにしておきましょう。

image.png

「Firebaseを追加」をクリックしてください。

数秒から数分ほど、プロジェクトの初期構築処理が終わるまで待ちましょう。

image.png

処理が完了すると、以下の画面が表示されます。

「続行」をクリックしてプロジェクトの管理画面へ進みましょう。

image.png


2. Firebase Authenticationの設定

Firebaseプロジェクトが作成できたら、次にユーザーのログイン機能を実装するために、Firebase Authenticationの設定を行います。

Firebase Authenticationは、Firebaseが提供する認証管理サービスで、メール・パスワード認証やGoogle、Twitter、Facebookなどのサードパーティプロバイダー認証を簡単に実装できます。Firebaseがバックエンドで認証処理を管理してくれるため、独自のサーバー開発が不要となります。

まずは、プロジェクトのコンソール画面からFirebase Authenticationを見つけてクリックしてください。または左側メニューから「Build」セクションの「Authentication」を選択します。

image.png

Firebase Authentication画面へ遷移したら、「始める」をクリックして設定を開始します。

image.png


ログインプロバイダの選択

ユーザーの認証方法として、複数のプロバイダを選択することができます。

今回は「メール/パスワード」を利用して認証を設定します。

スマートフォン向けのプロジェクトであれば「Google」や「Apple」を使うことが多くなると思います。これらはOAuth 2.0を活用した仕組みのため、高いセキュリティを確保しつつ利便性を提供できます。ただ、Unityのエディタ上からはこの2つでのアカウント作成とログインができないため、今回は使用しません。

image.png

「有効にする」をオンにして、「保存」をクリックします。

image.png

設定した「メール/パスワード」が「ログインプロバイダ」リストに表示されていることを確認します。

image.png

これでAuthenticationの基本設定は完了です。


3. Firestoreのデータベースを作成

続いて、アプリ内でのユーザー設定を保存するために、「Users」というデータベースを用意していきます。

このデータベースはFirestoreを使用して作成を行います。Firestoreは、Firebaseが提供するNoSQL型のデータベースです。リアルタイムのデータ同期や、複雑なクエリ、オフライン対応など、モダンなアプリケーション開発に必要な機能を備えています。

それでは、プロジェクトのコンソール画面からCloud Firestoreを見つけてクリックしてください。

TOPに移動したら「データベースを作成」をクリックします。

image.png


データベースIDとロケーションの設定

Firestoreでデータベースを作成する際には、まずデータの保存先である「ロケーション」を設定します。

この設定は、データの読み書き速度に直接影響を与える重要な項目です。特に日本国内向けアプリを開発する場合は、asia-northeast1 (Tokyo) を選ぶことで、低レイテンシでのデータアクセスを実現できるでしょう。

ロケーションは一度設定すると変更できないため、事前にプロジェクトの利用地域を考慮して設定してください。より詳しくリージョン周りについて知りたい場合は以下の記事が参考になります。

Firebaseのプロジェクトを作り直すことになったたった一つの設定項目

今回はCloud Run上での設定に合わせたいため、us-central (lowa) を選びます。
データベースIDは(default)のままにしておいてください。

image.png


セキュリティルールの設定

Firestoreのデータはセキュリティルールによって保護されます。

このルールを適切に設定することで、データへのアクセスを必要最小限に制限し、安全性を高めることができます。開発の初期段階では「テストモード」で自由に操作を行い、プロジェクトが完成した時には、「本番環境モード」に切り替えてアクセス権を厳密に管理することが推奨されています。

「テストモードで開始する」を選択して、「作成」をクリックしてください。

image.png


コレクションとドキュメントの作成

Firestoreではデータを「コレクション」という単位で管理します。

コレクションは、複数の関連するデータ(ドキュメント)をまとめるためのコンテナのような役割を果たします。

今回は、ユーザー情報を管理するための、usersというコレクションを作成します。

Firestoreは「コレクション→ドキュメント→フィールド」という階層構造を持つため、データ管理が視覚的にわかりやすいのも特徴です。

image.png

ドキュメントはFirestoreでデータを保存する基本単位です。

各ドキュメントは一意の「ドキュメントID」を持ちます。ドキュメントIDは、そのデータを参照するための「キー」です。Firestoreでデータを管理するときに、特定のドキュメント(データ)にアクセスしたり更新したりするための識別子となります。

ドキュメント内には、フィールドとして様々なデータを保存できます。Firestoreではデータのスキーマを事前に定義する必要がないため、プロジェクトの成長に合わせて柔軟にデータ構造を変更できます。

今回は、usersコレクション内に user123 というドキュメントを作成してみましょう。

image.png

「保存」をクリックするとデータベースが作成されて、以下のように確認ができるようになります。

image.png


4. UnityプロジェクトへのFirebase SDK追加

それではUnityプロジェクトで実際にFirebaseの機能を使うために、SDKを導入していきます。

公式ドキュメントに記載されている前提条件には軽く目を通しておいてください。

  • Unity 2019.1 以降且つ、次の要件を満たしていること
    • iOS の場合:ターゲットが iOS 11 以降であること
    • tvOS の場合:ターゲットが tvOS 12 以降であること
    • Android の場合:ターゲットが API レベル 19(KitKat)以降であること
  • (Apple プラットフォームのみ)以下のインストールが必要
    • Xcode 13.3.1 以降
    • CocoaPods 1.12.0 以降

それでは進めていきましょう。

まずはプロジェクトのコンソール画面にアクセスし、以下の画像のようなアイコンが並んでいる画面からUnityロゴのアイコンをクリックしてください。

image.png


アプリの登録

Firebaseの各機能を利用するために、Firebaseプロジェクトにアプリを登録します。

これは、Firebaseが「どのアプリのためにサービスを提供するか」を認識するための作業です。「アプリ名」や「バンドルID」は、Firebaseが提供する設定ファイルに書き込まれ、Unityプロジェクト側で利用されます。

今回の記事ではiOS、Android向けにリリースするところまでは行わないので、お好きな方にチェックマークを入れて、バンドルIDを設定してください。

今回はAppleアプリとしてcom.grpc-chat-appを登録しています。

image.png


Firebase設定ファイルをダウンロード

アプリの登録が完了すると、設定ファイルがダウンロードできルようになります。この設定ファイルをUnityプロジェクトに追加することで、Firebaseとの連携が可能になります。

  • iOSの場合GoogleService-Info.plist
  • Androidの場合google-services.json

この画面の時点でファイルをダウンロードしておいてください(説明ではXcodeプロジェクトへ追加、と書いていますが、UnityのAssetsフォルダ以下に配置しても動作します)。

ダウンロードが完了したら「次へ」をクリックしてください。

image.png


Firebase Unity SDKをインポート

これでFirebase Unity SDKをダウンロードできるようになりました。

ダウンロードしたら解凍しておいてください。

image.png

これでSDK用の事前ステップは完了です。

image.png


5. FirebaseSDKの導入

先ほどDLしたSDKをUnityプロジェクトに導入し、実際に新規アカウントを作成するところまで作っていきましょう。

今回は以下のリポジトリにて、学習用に使えるUnityプロジェクトを用意してみました。

バージョンは6000.0.27f1で、最低限の2D向けパッケージが含まれており、ユーザーアカウントの作成・ログイン、今後のチャット機能開発向け用のシーンとPrefabが含まれています。

メインシーンはAssets > grpc-chat-app > Scenes > MainScene.unityとなります。

開くと以下の画像のようなシーンが確認できます。

image.png

もしよければ使ってみてください。もちろんご自身で用意して頂いても構いません。

Unityプロジェクトを立ち上げた後は、BuildターゲットがiOS又はAndroidへ変更された状態にしておいてください。

また、立ち上げた後は、先ほどDLした GoogleService-Info.plistgoogle-services.jsonAssets下の任意の場所に配置しておいてください。


Firebase SDKの確認

それでは、まずはDLしたSDKを解凍して確認してみましょう。

image.png

Firebase AuthenticationやFirestoreを正しく動作させるためには、以下のunitypackageをUnityにインポートをする必要があります。

  • FirebaseAuth.unitypackage
    • Firebase Authenticationを使用してユーザーの認証を行うためのパッケージです。
    • ユーザーのサインイン、ログイン、ログアウトなどの操作を行います。
  • FirebaseFirestore.unitypackage
    • ユーザー情報(例えば、語尾設定)を保存するためにFirestoreを使うので、このパッケージも必要です。

それ以外のパッケージについても、ざっくり解説しておきます。

  • FirebaseStorage.unitypackage
    ユーザーのファイル(画像、動画、ドキュメントなど)をGoogle Cloud Storageにアップロード・ダウンロードするためのパッケージです。チャットアプリやメディア共有アプリで使用されます。

  • FirebaseAnalytics.unitypackage
    アプリ内のユーザー行動をトラッキングしてレポートを生成するためのパッケージです。アプリの使用状況を把握し、データに基づいた改善を行うために使用します。

  • FirebaseInstallations.unitypackage
    各デバイスやインストールごとに一意のFirebaseインスタンスIDを生成・管理します。このIDはクラウドメッセージングやAnalyticsなどのサービスとの連携に使用されます。

  • FirebaseDynamicLinks.unitypackage
    ユーザーを特定のアプリ内コンテンツや状態に誘導するための動的リンクを生成・管理するパッケージです。マーケティングやシェアリング機能で活用されます。

  • FirebaseCrashlytics.unitypackage
    アプリ内のクラッシュやエラーを記録し、問題を特定・修正するための詳細なレポートを提供するパッケージです。アプリの安定性向上に役立ちます。

  • FirebaseRemoteConfig.unitypackage
    アプリの設定や動作をリモートでリアルタイムに変更するためのパッケージです。プロモーションの切り替えやテスト設定の切り替えに便利です。

  • FirebaseAppCheck.unitypackage
    アプリが正規のものであることを確認し、不正アクセスや悪意のある利用を防ぐためのセキュリティ強化パッケージです。

  • FirebaseMessaging.unitypackage
    プッシュ通知を送信するためのパッケージです。ユーザーにリアルタイムで重要な情報を提供する場合に使用されます。

  • FirebaseFunctions.unitypackage
    Firebase Cloud Functionsを利用するためのパッケージです。バックエンドロジックをサーバーレスで実行し、アプリのビジネスロジックを管理します。

  • FirebaseDatabase.unitypackage
    リアルタイムデータベースを使用するためのパッケージです。データのリアルタイム同期や簡易なデータ管理が必要な場合に使用されます。

ところでFirebaseFirestoreとFirebaseDatabaseの違いはなんでしょう?

FirebaseFirestore

Firestoreは最新のNoSQL型データベースで、柔軟性が高く、構造化されたデータを扱うのに適しています。

特徴

  • データは「コレクション」と「ドキュメント」という形で保存します。
    • 例: 「users」というコレクションの中に、「user123」というユーザー情報のドキュメントがある。
  • 高速な検索やフィルタリングが可能です。
  • 複数デバイス間でリアルタイム同期ができます。
  • スケーラビリティに優れ、大規模なアプリケーションにも適しています。

適した用途

  • SNSやチャットアプリなど、階層化されたデータを扱う場合。
  • データを柔軟に検索・操作したい場合。
  • 大規模なアプリや、今後規模が拡大する予定のプロジェクト。

FirebaseDatabase

FirebaseDatabaseは、Firebaseが最初に提供したリアルタイムデータベースで、シンプルなJSON形式でデータを管理します。

特徴

  • データは1つの大きなJSONツリーとして保存されます。
    • 例: ルートノードからデータがすべてぶら下がるような構造。
  • リアルタイム同期に特化しています。
  • クエリ(検索)はFirestoreに比べると簡易的。
  • スモールプロジェクト向けの設計。

適した用途

  • シンプルな構造のアプリケーション(例: Todoリストや軽量なリアルタイムチャット)。
  • 小規模なプロジェクトやプロトタイプ開発。

上記の特徴を踏まえた上で、今回はFirebaseFirestoreを使用していきましょう。


UnityへのSDK導入

FirebaseのFirebaseAuth.unitypackageと、FirebaseFirestore.unitypackageを、UnityEditorにD&Dするなどして、importを進めてください。

import後に以下のダイアログが表示することがあります。

image.png

FirebaseプロジェクトとUnityプロジェクトを正しく連携させるためには、FirebaseプロジェクトのバンドルIDと一致するバンドルIDをUnity側でも設定する必要があります。

「Apply」をクリックしてBundle IDを合わせましょう。

これでFirebaseの機能を扱うための下準備が終わりました。

まとめ

今回の第四章では、Firebaseを用いたユーザーログイン機能の実装に焦点を当て、Firebase AuthenticationやFirestoreの設定からUnityへのSDK導入までを行いました。これにより、認証機能とユーザーデータ管理の基礎が整い、チャット機能開発のための環境を構築できました。

今回のハンズオンでは以下のことを学びました。

  • Firebaseの基本概念と用途
  • Firebaseプロジェクトの作成手順
  • Firebase Authenticationの設定
  • Firestoreのデータベース設定
  • UnityプロジェクトへのFirebase SDKの導入方法
  • FirestoreとRealtime Databaseの違い

次回の第五章では、いよいよUnityとFirebaseを用いてのアカウント新規作成・ログイン実装を行なっていきます。

もしも記事の中で進められない箇所があったら、Xなどでご連絡ください。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?