Firebase Hostingでゲームを公開する：無料枠と設定

無料枠でできること・できないこと

Firebase HostingのSparkプランは、静的ファイルの配信を基本とします。HTML・CSS・JavaScript・画像・音声ファイルを置いて公開するだけなら、サーバーサイドの処理は不要です。ゲームのセーブデータをサーバーに保存したい場合はFirestoreやRealtimeDatabaseが必要になりますが、それらにも独立した無料枠があり、HostingだけのゲームにFirebase SDKを追加で組み込む形になります。

Sparkプランでできない主なことは、Cloud Functions（サーバーレス関数）の本番デプロイと、一定量を超えたDBアクセスの継続です。ゲームのロジックをすべてフロントエンドで完結させているなら、Hostingとしての機能だけで運用できます。

独自ドメインの設定は無料枠でも可能です。所有しているドメインをFirebaseコンソールで登録し、DNSレコードを追加するだけでHTTPSが自動で有効になります。

公開までの手順

1. プロジェクトを作成する

Firebaseコンソール（console.firebase.google.com）にGoogleアカウントでログインし、「プロジェクトを追加」からプロジェクトを作成します。プロジェクト名はURLに影響しないため、管理しやすい名前をつけておけば十分です。Google Analyticsの連携は、今すぐ必要でなければスキップできます。

2. Firebase CLIをインストールする

ローカルのターミナルで次のコマンドを実行します。Node.jsが事前に必要です。

npm install -g firebase-tools

インストール後、firebase login でGoogleアカウントと連携します。ブラウザが開いて認証画面が表示されるので、コンソールと同じアカウントで許可してください。

3. プロジェクトのディレクトリを初期化する

ゲームのファイルが入っているディレクトリに移動し、次を実行します。

firebase init hosting

対話形式で設定が進みます。主な選択肢は次のとおりです。

• どのプロジェクトを使うか：先ほど作成したプロジェクトを選択します。
• 公開ディレクトリ（public directory）：デプロイするファイルが入っているフォルダ名を指定します。ルート直下に index.html があるなら .（ドット）を入力します。
• Single Page Applicationとして設定するか：ゲームが単一HTMLで動く場合は No で問題ありません。Vue・ReactなどのSPAフレームワークを使っている場合は Yes を選びます。

4. デプロイする

firebase deploy --only hosting

完了するとホスティングURLが表示されます。プロジェクトID.web.app という形式のURLで、ブラウザからすぐにアクセスできます。

ゲーム公開でよく詰まる設定ポイント

パスの扱いに注意する：ゲーム内でアセットを読み込む際に ./assets/image.png のような相対パスを使っていれば問題ありません。しかし絶対パスをローカル環境向けに書いていると、本番では404になります。デプロイ前にローカルでプレビューする firebase serve コマンドで動作確認するのが確実です。

キャッシュ設定を意識する：Firebase Hostingはデフォルトでファイルにキャッシュヘッダーを付与します。ゲームを更新してデプロイしても、プレイヤーのブラウザが古いバージョンをキャッシュしたままになるケースがあります。firebase.json の headers 設定でキャッシュ制御を明示することで防げます。

{
  "hosting": {
    "public": ".",
    "headers": [
      {
        "source": "**/*.html",
        "headers": [{ "key": "Cache-Control", "value": "no-cache" }]
      }
    ]
  }
}

HTMLファイルだけキャッシュを無効化し、画像や音声はキャッシュに乗せるという使い分けが実用的です。

ファイルサイズを事前に確認する：無料枠のストレージ・転送量の上限は決して広くありません。BGMや効果音をそのままの品質で置くと、数本のファイルだけで枠の大半を使うことがあります。音声はブラウザ向けに圧縮した形式（ogg・mp3）を使い、画像はWebPへの変換を検討してください。圧縮前後のファイルサイズをデプロイ前に確認する習慣をつけておくと、後から慌てずに済みます。

複数バージョンの管理：Firebase Hostingはデプロイのたびにスナップショットが保存されます。コンソールから過去のバージョンにロールバックできるため、更新後に不具合が出たときでも切り戻しが短時間で行えます。古いスナップショットはストレージを消費するので、コンソールで定期的に不要なものを削除してください。

独自ドメインを設定する手順

Firebaseコンソールで「Hosting」→「カスタムドメインを追加」を選択し、所有しているドメインを入力します。TXTレコードによるドメイン所有確認を求められるので、ドメインの管理画面でDNSにレコードを追加します。確認が完了すると、AレコードまたはCNAMEレコードの追加手順が表示されます。DNSの反映には数分から数十時間かかる場合があります。

HTTPS証明書はFirebase側が自動で発行・更新するため、手動での更新作業は不要です。

他のホスティングサービスとの使い分け

Firebase Hostingはリクエスト数やストレージ上限が比較的厳しめです。アクセスが集中することが予想される場合や、ファイル数が多いゲームは、Cloudflare PagesやNetlifyと比較して判断してください。一方、すでにFirestoreやAuthenticationをゲームに組み込んでいる場合は、Firebaseでまとめると設定の手間が少なくなります。使うサービスを増やすほど無料枠の消費が広がるため、ゲームの規模と機能に合わせた選択が重要です。

次の行動

Firebase CLIのインストールから firebase deploy まで、コマンド操作に慣れていなければ firebase serve でローカル確認を先に試すのがおすすめです。公開後はFirebaseコンソールの「使用状況」タブで転送量とストレージの消費を定期的に確認してください。HTMLファイル単体またはZIPで固めたゲームは、アソバース（aso-verse.com）でも直接投稿して公開できます。URLが決まっている場合は公開済みURLの登録も使えます。

参考資料

• Firebase Hosting 公式ドキュメント（Firebase Documentation）
• Firebase Pricing（Google Firebase 公式料金ページ）
• firebase-tools GitHub リポジトリ