UnityのWebGLビルドでのVRMファイル読み込み

UnityのWebGLビルドでVRMファイルを読み込む方法をまとめました。

1. WebGLビルドのネットワークの制限

UnityのWebGLビルドは、System.Net、System.Net.Sockets、UnityEngine.Networkなどのネットワーククラスは利用できません。次のAPIを利用します。

・WWW
・WebRequest
・Unity Network

さらに、シングルスレッド制限があるので、非同期メソッドはコルーチンを使って実装する必要があります。

2. WebGLビルドでのHTMLファイルの読み込み

WebGLビルドでHTMLファイルを読み込むコードは、次のとおり。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Networking;

// HTMLファイルの読み込み
public class HTMLLoader : MonoBehaviour
{
    // スタート時に呼ばれる
    void Start()
    {
        StartCoroutine("LoadHTML", "https://www.google.co.jp/");
    }

    // HTMLファイルの読み込み
    IEnumerator LoadHTML(string path)
    {
        // HTMLファイルの読み込み
        UnityWebRequest request = UnityWebRequest.Get(path);
        yield return request.SendWebRequest();

        // HTMLファイルをログ出力
        string html = request.downloadHandler.text;
        print(html);
    }
}

3. WebGLビルドでのVRMファイルの読み込み

WebGLビルドでHTMLファイルを読み込むコードは、次のとおり。
「Assets/StreamingAssets」にVRMファイル「AliciaSolid.vrm」を配置しています。

using System.Collections;
using UnityEngine;
using UnityEngine.Networking;
using VRM;

// VRMファイルの読み込み
public class VRMLoader : MonoBehaviour {

    //スタート時に呼ばれる
    void Start() {
        StartCoroutine("LoadVRM", "AliciaSolid");
    }

    // VRMファイルの読み込み
    IEnumerator LoadVRM(string name)
    {
        // パスとインポーターの生成
        string path = Application.streamingAssetsPath+"/"+name+".vrm";
        VRMImporterContext context = new VRMImporterContext();

        # if UNITY_EDITOR
            // VRMファイルの読み込み
            context.Parse(path);
            context.Load();
            yield return null;
        # else
            // VRMファイルのダウンロード
            UnityWebRequest webRequest = UnityWebRequest.Get(path);
            yield return webRequest.SendWebRequest();
            if (webRequest.isNetworkError)
            {
                // エラー処理
                print(webRequest.error);
                yield break;
            }

            // VRMファイルの読み込み
            context.ParseGlb(webRequest.downloadHandler.data);
            context.Load();
            yield return null;
        # endif

        // メッシュの表示
        context.ShowMeshes();
    }
}

Unity Editorは、context.Parse()で直接ファイルを読み込みます。

WebGLビルドは直接ファイルにアクセスできないので、WebRequestでバイナリをダウンロードしてから、context.ParseGlb()で読み込みます。

Unity デザイナーズ・バイブル