pgintro.net

Unity WebGLビルド

作成日時:2019/01/15

更新日時:2019/09/12

スポンサーリンク

この記事の確認環境

OS X El Capitan

Unity Version 2018.2.14f1 Personal

Firefox Quantum 64.0.2 (64 ビット)

ビルド手順

webgl000.png

Unityメインメニューの「File」>「Build Settings...」からビルド設定ウィンドウを開き、「Platform」から「WebGL」を選択します。

Unityアイコンが「WebGL」の部分に表示されていない場合は現在のプラットフォームに選択されていないため、「Switch Platform」ボタンから現在のプラットフォームに設定します。

エラーが発生していなければ「Build」ボタンからビルドが行えます。

webgl001.png

「Build」ボタンが無効になっており、上の画像のように「No WebGL module loaded.」と表示されている場合はWebGL向けにビルドするためのモジュールのインストールがされていないため、「Open Download Page」のボタンからパッケージをダウンロードし、インストールします。

「Unity Hub」からインストールしたUnityの場合は上記のパッケージからではなく「Unity Hub」からモジュールを追加する必要があります。

モジュールのインストール(Unity Hub外からインストールを行ったUnityの場合)

モジュールのインストール(Unity Hubからインストールを行ったUnityの場合)

動作確認

ビルドが成功した場合、指定した場所に指定の名前でフォルダが作成されています。

フォルダ内に「index.html」が格納されているので開くと動作が確認できます。

動作確認にはWebサーバーを起動しそのサーバー上にビルドしたファイル一式を配置、またはローカルでfileプロトコルで確認を行う場合はブラウザが「Firefox」である必要があります。

It seems your browser does not support running Unity WebGL content from file:// urls. Please upload it to an http server, or try a different browser.

「Firefox」以外のブラウザでfileプロトコルにてファイルを開いた場合、上記のようなアラートが表示されます。

モジュールのインストール(Unity Hub外からインストールを行ったUnityの場合)

webgl002.png

「続ける」をクリック

webgl003.png

「続ける」をクリック

webgl004.png

ライセンスに関する文章を確認、適宜「Print...」または「Save...」から印刷やファイル保存を行い、「続ける」をクリック

webgl005.png

ライセンスに同意する場合は「Agree」をクリック

webgl006.png

「インストール」をクリックでインストールが開始されます。

インストールが正常に終了した旨表示されればインストール完了です。

webgl007.png

webgl008.png

webgl009.png

インストールが失敗した場合は上のような表示となります。

Unityのインストールを「Unity Hub」から行っている場合は「Unity Hub」から追加する必要があります。

モジュールのインストール(Unity Hubからインストールを行ったUnityの場合)

webgl010.png

「Unity Hub」の「Installs」からモジュールを追加したいUnityの「Add Component」を選択、「WebGL Build Support」にチェックを入れ「Done」をクリックで追加します。