【Unity】WebGLビルドが「テストプレイできない」時の解決手順

今回は、UnityでWebGL向けにビルドを行ってみたけどテストプレイが上手くいかない！と困っている方の解決方法の1つかと思い紹介しておきます。ちなみに、Windowsを使用しているのでWindowsユーザー向けの内容となります。

【Unity】WebGLビルドが「テストプレイできない」時の解決手順

【Unity】WebGLビルドが「テストプレイできない」時の解決手順

UnityでWebGLにビルドしたのに、index.htmlを開いても起動しない／赤いエラーが出る。
今回ハマった原因はWebGLはfile://で動かせない＆Brotli(.br)圧縮の配信ヘッダー問題＆ブラウザのキャッシュでした。

この記事では、これらの解決手順についてまとめています。

症状1：index.htmlをダブルクリックするとエラー

まず、前提としてUnityからビルドするときに「Build」でビルドしたものを開く際のエラーです。「Build and Run」したわけではありません。

WebGLビルドのindex.htmlをエクスプローラーからダブルクリックで開くと、赤文字のエラーが出て起動できません。

原因

WebGLはブラウザの制限で、file://から別ファイルを読み込めません。
必ずHTTPサーバー経由（http://localhost/）で開く必要があります。

まず確認：ビルドフォルダの場所（OneDriveに注意）

私の環境ではデスクトップがOneDrive配下になっていて、ビルドフォルダがこの場所にありました：

C:\Users\（ユーザー名）\OneDrive\デスクトップ\kazenorenzu

フォルダが見つからない場合にはOneDrive配下になっていないか要チェックです。ビルドする際にデスクトップにゲームのタイトル等で何かしらフォルダを作ってその中にビルドファイルを作る事が多いと思います。

私も、デスクトップに「kazenorenzu」という名前のフォルダを作っています。

手順1：PowerShellでビルドフォルダへ移動

PowerShellを開いて、ビルドフォルダへ移動します。

cd “C:\Users\（ユーザー名）\OneDrive\デスクトップ\kazenorenzu”

手順2：ローカルサーバーを立てる（Python）

WebGLはサーバー経由で起動するので、Pythonでローカルサーバーを立てます。

Pythonが入っているか確認

Python 3.xx.xと出ればOK
Microsoft Storeが開く/動かない場合はPythonが未導入（またはエイリアス問題）なのでPythonをインストールします

Pythonが入っていない場合には、Windows Storeに行ってPythonと検索してインストールします。

症状2：python -m http.serverで起動しても .brが読めない

原因

Unity WebGLのビルドは.br（Brotli圧縮）ファイルを出力しますが、簡易サーバーだと.br に Content-Encoding: brを付けずに配ってしまい、ブラウザが展開できないことがあります。

手順3：Unity用のローカルサーバー（.br対応）を使う

そこで、ビルドフォルダ直下にserve_unity.pyを作って、.br / .gzに適切なヘッダーを付けて配信できるようにします。

serve_unity.pyを作成

kazenorenzuフォルダにserve_unity.pyという名前で作成し、以下を貼り付けて保存します。

from http.server import ThreadingHTTPServer, SimpleHTTPRequestHandler

class Handler(SimpleHTTPRequestHandler):
    # .br / .gz でも元の拡張子を元にContent-Typeを決める
    def guess_type(self, path):
        if path.endswith(".br") or path.endswith(".gz"):
            path = path[:-3]
        return super().guess_type(path)

    # 圧縮ファイル用のヘッダーを付ける
    def end_headers(self):
        p = self.path.split("?", 1)[0]
        if p.endswith(".br"):
            self.send_header("Content-Encoding", "br")
        elif p.endswith(".gz"):
            self.send_header("Content-Encoding", "gzip")
        super().end_headers()

if __name__ == "__main__":
    ThreadingHTTPServer(("localhost", 8000), Handler).serve_forever()