Metaverse WebGL build

Available in the Industries Circle

概述

Metaverse範例可以針對WebGL目標來被組建。

因為一些關於WebGL組建的Unity限制，少數點需要特定的注意，以適當地運作，以下將詳述。

請注意，這個WebGL組建不支援WebXR（在瀏覽器中的虛擬實境）：雖然可以透過一些開源庫來達成，比如unity-webxr-export，但是目前在Unity中預設不支援，因此在這裡不展示。

您可以在這裡(Fusion 1)測試Metaverse WebGL組建。

非同步程式碼：Task.Delay

在WebGL組建上，一些非同步／等待中方法不如預料中運行，導致一些問題。
主要是，System.Threading.Tasks.Task.Delay方法在WebGL組件上不運行。

為了繞過這個限制，Metaverse範例提供一個WebGL相容的AsyncTask.Task方法。
它仰賴於Task.Yield，其與WebGL組建相容。

public static class AsyncTask
{
    public static async Task Delay(int milliseconds)
    {
#if !UNITY_WebGL
        await Task.Delay(milliseconds);
#else
        // Unity 2021 do NOT support Task.Delay() in WebGL
        float startTime = Time.realtimeSinceStartup;
        float delay = (float)milliseconds / 1000f;

        while (Time.realtimeSinceStartup - startTime < delay)
        {
            // Wait for the delay time to pass
            await Task.Yield();
        }
#endif
    }
}

音源及唇形同步

在目前的Unity版本，針對WebGL組建，Audiosource元件不會在同層級元件上觸發OnAudioFilterRead回調。

因此，使用這個回調的資料來計算音量的VoiceDetection元件無法正常運作。
取而代之地，在WebGL脈絡下，VoiceDetection使用替代的PhotonVoice回調來存取原始音訊資料。

在使用者已連網預製件上，頭戴式裝置持有一個Speaker元件，其是PhotonVoice的一部分，其有一個RemoveVoice欄位。
這裡可以訂閱到FloatFrameDecoded，在接收到音訊資料時收到警示。

當初始化喇叭後（IsLinked傳回真），可以新增OnFloatFrameDecoded回調：

if (speaker == null) speaker = audioSource.GetComponent<Speaker>();
if(HasSubscribedToVoice == false && speaker != null && speaker.IsLinked)
{
    speaker.RemoteVoice.FloatFrameDecoded += OnFloatFrameDecoded;
    HasSubscribedToVoice = true;
}

從這裡，回調將提供所有已接收的音訊資料，允許計算平均聲音水準，以相應地顯示唇形同步：

private void OnFloatFrameDecoded(FrameOut<float> frame)
{
    float writeVoiceVolume = 0f;
    foreach (var sample in frame.Buf)
    {
        writeVoiceVolume += Mathf.Abs(sample);
    }
    writeVoiceVolume /= frame.Buf.Length;

    // audioWriteCalls and accumulatedVolume are reset during Update
    audioWriteCalls++;
    accumulatedVolume += writeVoiceVolume;
    voiceVolume = accumulatedVolume / audioWriteCalls;
}

請注意，這個調適用於簡單虛擬人偶模型及ReadyPlayerMe虛擬人偶。
關於ReadyPlayerMe虛擬人偶，雖然在桌面及Quest組建上，它們仰賴Oculus唇形同步，但基礎庫針對WebGL組建是不可用的。
因此這裡使用一個簡化的版本：調適ReadyPlayerMe提供的預設RPMLipSync程式碼以使用PhotonVoice回調。

TextMeshPro材料

在一些情況下，如果場景含有使用完全相同字體材料的TextMeshPro及TextMeshProUGUI元件，則TextMeshPro文字是不可見的。
為了修正這個問題，必須複製關聯到一個字體的材料。
然後請確保在您的場景中的TextMeshPro及TextMeshProUGUI元件不使用相同的Material Preset。

概述
非同步程式碼：Task.Delay
音源及唇形同步
TextMeshPro材料