3. Firebaseで公開しよう

最後にFirebaseでHTMLファイルを公開します。

FirebaseはGoogleが公開している包括的なアプリ開発のプラットフォームです。 今回はその中の1機能であるサイトのホスティングの機能を利用します。

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

Fisebase CLIをインストール

firebaseはブラウザとターミナルのどちらかで操作する事が可能ですが、今回はターミナルを経由して公開する手順を学びます。

まずはターミナルを開いて下記のコマンドを入力しFisebase CLIをインストールします。 CLIはCommand Line Interfaceの略で、こちらをインストールする事でコマンドラインでfirebaseを操作する事が可能になります。

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

firebasにログインする

次にfirebaseにログインをします。 ターミナルに下記のコマンドを入力するとブラウザが開くので、Googleのアカウントでログインをしましょう。

$ firebase login

ターミナル上でプロジェクトディレクトリまで移動する

ターミナル上でプロジェクトウィンドウに移動する必要があります。 変なディレクトリで実行するとその場でファイルが展開されてしまってあまり良く無いので、 慎重に行ってください。

まずファインダーでUnityプロジェクトのディレクトリの一つ上に移動して、フォルダを選択し、Cmd + C を押してクリップボードにコピーします。

次にターミナルにペーストするとディレクトリまでの階層が / で区切られて表示されます。

頭に cd を加えて実行します。

$ cd /User/[ユーザー名から始まるプロジェクトまでのディレクトリが入ります]/[プロジェクト名]

pwd と打ってみて、現在のプロジェクトのパスが出てきたら成功です。  

$ pwd

firebaseプロジェクトを作成する

$ firebase init

まず「Which Firebase CLI features do you want to set up for this folder? Press Space to select features, then Enter to confirm your choices.」と聞かれるので、上下ボタンで移動して、「Hosting: Configure and deploy Firebase Hosting sites」に移動し、スペースを押して選択します(○が●に変わると選択されたという事になります)。 選択できたらエンターキーで次に進みます。

次に「Use an existing project」と聞かれるので、上下ボタンで「Create a new project」まで移動して、エンターキーを押して次に進みます。

次に「Please specify a unique project id」と聞かれるのでプロジェクトIDを入力します。 (「unity-20201020」など、unity-[日付]などとしておくと後から探しやすいです)

次に「What would you like to call your project?」と聞かれますが、プロシェクとIDをそのまま使いたいので、そのままエンターを押して次に進みます。

最後に「What do you want to use as your public directory?」と聞かれますが「public」ディレクトリを使用したいのでそのままエンターを押して次に進みます。

次の「Configure as a single-page app」もそのままエンターを押して次に進みます。

次の「Set up automatic builds and deploys with GitHub?」もそのままエンターを押して次に進みます。

あとは自動でやってくれます。

成功するとプロジェクトディレクトリにいくつかファイルが追加されます。

公開しよう

最後に以下のコマンドを実行するとサーバーにアップロードして公開をしてくれます。

$ firebase deploy

成功するとターミナルにURLが表示されます。 ブラウザで開いて遊んでみましょう。

Unity側でゲームをアップデートしてビルドした後、Webもアップデートしたい場合には、もう設定は住んでいますので、再度デプロイのコマンド firebase deploy を打つだけで更新されるようになっています。


後からプロジェクトを消したくなったら

以下のコマンドを実行します。

$ firebase open

「Project Settings」を選択して画面の一番下にある「プロジェクトを削除」を押すとプロジェクト自体を削除する事が可能です。


関連リンク: