Firebase Hosting でできること

Firebase Hosting とは

Firebase Hosting は、静的 / 動的用のフルマネージド ホスティング サービスです。 コンテンツ、マイクロサービスにも 対応していますこのサービスは、SSD ストレージとグローバル CDN(コンテンツ配信ネットワーク)を基盤としています。Firebase Hosting には構成不要の SSL が組み込まれているため、コンテンツは常に安全に配信されます。

ホストの対象

単一ページ型ウェブアプリ、マーケティング ウェブサイト、静的アセットと動的アセットのホスト

単一ページの表示に関して Firebase Hosting 独自の最適化機能を利用 静的ウェブサイトの両方に対応します静的アセット(HTML、CSS、JavaScript、フォントなど)の配信には、Google の SSD バックエンド ストレージと、世界中の主要な地域にエッジ ロケーションを持つグローバル CDN が利用されます。グローバル CDN では動的コンテンツをキャッシュに保存することもできます。さらに、Firebase によってホストされるすべてのサイトには SSL 証明書が無料で提供されるため、コンテンツを常に安全に配信できます。

マイクロサービス、API、フォームの構築とホスト

Firebase HostingCloud Functions と組み合わせて、Express.js フレームワークを使用したマイクロサービスをビルドします。この組み合わせにより、Firebase 上でマイクロサービスと API をホストできます。また、Cloud Firestore との緊密な統合機能を使用して、リアルタイムでデータを更新できるフォームとウェブアプリを構築できます。

カスタム ドメイン(またはサブドメイン)の追加

Firebase Hosting では自動的に Firebase のサブドメインが与えられますが、カスタム ドメインexample.commyrealtimeapp.example.com など)からコンテンツを提供することもできます。Firebase Hosting は、ドメインごとに SSL 証明書をプロビジョニングし、グローバル CDN 経由でコンテンツを提供します。

本番環境ワークフローを設定する

公開サイトにデプロイする前に、変更内容を確認およびテストすることをおすすめします。Firebase Hosting を使用すると、ローカルで変更を表示してテストし、 エミュレートされたバックエンド プロジェクト リソースと結合します。同僚に変更を確認してテストしてもらう必要がある場合は、サイトの共有可能で一時的なプレビュー URL を Hosting で作成できます。pull リクエストからデプロイできるように GitHub の統合もサポートされています。

ローカルでのテスト、変更のプレビュー、デプロイの詳細をご覧ください。

すべてのサイトを 1 か所にまとめる

Firebase Hosting のサポート 1 つの Firebase プロジェクト内の複数のサイト。各サイトは、コンテンツの独自のコレクションをホストし、独自のホスティング構成を持ちます。また、各サイトには 1 つ以上のドメインを関連付けることができます。各サイトはすべて同じ Firebase プロジェクト内に存在するため、すべてのサイトはプロジェクトの他の Firebase リソースにアクセスできます。

1 つの Firebase プロジェクト内で複数のサイトを保持することによって、関連サイトを 1 か所にまとめることができます(単一ページのアプリ、ブログ、マーケティング ウェブサイトなど)。

サイトのウェブ リクエストログの表示、検索、フィルタリング

Firebase プロジェクトを Cloud Logging にリンクすると、表示、検索、 Hosting 件のサイトごとにウェブ リクエストのログをフィルタします。これらのログは Firebase によって自動的に提供される CDN から取得されるため、サイトへのすべてのリクエストと関連するリクエスト データが記録されます。

Cloud Logging ログでは、次のようなことができます。

  • サイトについて理解を深める - サイトへのアクセスの場所と時間、サイトのレスポンス ステータス、エンドユーザー リクエストのレイテンシなどを把握できます。

  • クエリを使用してログをフィルタする - 自動的に収集されるデータを利用して、各リクエストまたはサイトに関連付けられたデータのフィルタリングとプロットを行います。

  • ログベースの指標の使用 - Cloud Monitoring グラフとアラートを作成します。 事前定義のシステム指標またはユーザー定義の指標からポリシーを管理できます。

  • 他の Google Cloud ツールにログをエクスポートする - 他のツール(BigQuery やデータポータルなど)でログデータを使用して、より強力な分析や相関付けを行います。

詳しくは、 Cloud LoggingHosting の統合に関するページ

Cloud Build による継続的なデプロイの自動化

Firebase HostingCloud Build と提携して、静的コンテンツ、動的コンテンツ、マイクロサービスの継続的なデプロイのワークフローを自動化するための DevOps 対応ソリューションを提供しています。

これらのツールを構成した後は、コードを git リポジトリにチェックインするだけで、ウェブアプリを Firebase Hosting にデプロイできます。

フルスタック ウェブアプリの継続的デプロイに関心がある場合 Angular Universal で開発されたコードについては、 Firebase App Hosting のプレビュー。App Hosting では、Cloud Build を使用して GitHub リポジトリから自動的にロールアウトされます。 と Cloud Run にアクセスできます。

高度なカスタマイズ

  • エラーページ - ウェブアプリからカスタマイズされた 404 ページを返します。

  • リライト - サービスを提供するエンドポイントや提供するトラフィックをカスタマイズすることや、複数の URL から同じコンテンツを表示することができます。

  • ローカライズされたコンテンツ - ユーザーの言語設定や国に合わせてカスタマイズされたコンテンツを提供します。

  • ヘッダー - Cookie にアクセスしたい場合に、カスタム ヘッダーを使用できます。

  • キャッシュと CDN の動作 - カスタム ヘッダーを使用して、CDN 全体でウェブアプリをキャッシュに保存する方法を制御します。

アクセスの制限とウェブアプリの DDoS 攻撃への防御

Express.js ミドルウェアの機能を使用してカスタムのロジックを構築し、マイクロサービス、API、その他の HTTPS エンドポイントを提供できます。たとえば、ほんの数行のコードで、一般的な Node.js ミドルウェア サービスを統合して、IP によるアクセス管理やサービス拒否(DDoS)攻撃からの保護など、追加のセキュリティ層を構築できます。

さまざまなウェブベース IDE から Firebase へのデプロイ

Firebase Hosting はさまざまなウェブベース IDE と統合されており、StackBlitzGlitch の 2 つのウェブベース IDE から Firebase Hosting に直接デプロイできます。

Stackblitz を使用したデプロイ
Stackblitz を使用した Firebase Hosting へのデプロイ
Glitch を使用したデプロイ
Glitch を使用した Firebase Hosting へのデプロイ

これらの IDE により Firebase アプリの作成が自動的に検出され、デベロッパーは IDE を離れることなく、ボタンをクリックするだけで Firebase Hosting にデプロイできます。

他の Firebase サービスとの統合の構築

FriendlyChat ウェブ Codelab

Firebase Hosting は、 Cloud FunctionsAuthenticationRealtime DatabaseCloud FirestoreCloud Messaging などの Firebase サービスとすぐに連携できます。これらの補完的な Firebase サービスを使用して、強力なマイクロサービスとウェブアプリを構築できます。

ホスティングがこれらの Firebase サービスとどのようにHosting連動するかを確認するには、Google の FriendlyChat ウェブ Codelab をお試しください。

REST API と Node.js モジュールを使用したカスタムのデプロイ ワークフローの作成

Firebase Hosting は、次のコンテンツの REST API をサポートしています。 カスタム ワークフローを構築できます。たとえば、 JavaScript アプリ。

Node.js アプリにインポートして高度な機能を構築できる Node.js モジュールも用意されています。