尝试打包WebGL平台遇到的坑

Intro

在将一个 Unity 2022.3 数字孪生项目(利用Unity3D_Robotics_ABB)从原 Win 平台迁移到 WebGL 平台的过程中，遇到了 RuntimeError: null function or function signature mismatch、 The script 'xxxxx' could not be instantiated!、digest auth failed 等等报错和故障。在对网上的解决方案探索和尝试的过程中，有小结如下

System.Threading 相关命名空间（C# 原生线程）不支持

这是着手切换WebGL平台之前就知道不行的一点，不过使用 UniTask 可以替换。

原 Unity3D_Robotics_ABB 作者在其实现中主要使用了原生的 Thread 来处理异步的逻辑，在 Unity 打 WebGL 包时并没有报错且能成功出包，然而，在运行 WebGL 的程序时（尤其做某些会拉起线程的操作时），会出现卡死、弹窗报错RuntimeError: null function or function signature mismatch 的问题。

若出现上述问题，应该考虑利用 Unity 托管的异步实现（UniTask、协程等），或 async/await 关键词处理对应需求。

System.Net 相关命名空间不支持（需要利用Unity提供的 UnityWebRequest(UWR) 来进行 HTTP 请求）

这是解决问题花费时间比较长的一点。

在解决完线程的问题后，运行 WebGL 程序，发现会出现 The script 'xxxxx' could not be instantiated! 等控制台警告，且此脚本功能失效。经过测试后，发现脚本中若引用了 System.Net 等 .NET networking classes，则此脚本不能被正确加载，见 WebGL Networking ，此时需要使用 UnityWebRequest 类进行 http 请求。

由于 UnityWebRequest 没有对 Authentication 的支持，需要手动处理一些问题：digest auth failed 。例如，Basic 验证方案可以自己加Header 并存入对应值。然而，对于 Digest 验证方案，手动处理比较麻烦。此时考虑调 JavaScript 的加 Digest 验证的方法并发送 HTTP 请求，或者由代理服务器添加 Digest 验证

技术水平有限，最终选择了由代理服务器添加 Digest 验证的方法，下面是对应的 Python 程序：

from flask import Flask, request, Response
import requests
from requests.auth import HTTPDigestAuth

app = Flask(__name__)

# The URL of the API that requires Digest Authentication
TARGET_API_URL = "http://www.tsingloo.com"
# Replace 'your_username' and 'your_password' with your actual credentials
USERNAME = 'your_username'
PASSWORD = 'your_password'

@app.route('/', defaults={'path': ''})
@app.route('/<path:path>', methods=['GET', 'POST', 'PUT', 'DELETE'])
def proxy(path):
    # Construct the full URL to the target API
    url = f"{TARGET_API_URL}/{path}"
    
   # Log the requested URL
    app.logger.info(f"I am requesting {url}")

    # Get the original request method and data
    method = request.method
    data = request.get_data()
    
    # Selectively copy headers, excluding those that can cause issues
    excluded_headers = ['Host', 'Content-Length', 'Content-Type']
    headers = {key: value for key, value in request.headers if key not in excluded_headers}

    # If the request has a content type, include it in the headers
    if 'Content-Type' in request.headers:
        headers['Content-Type'] = request.headers['Content-Type']

    # Inside your proxy function
    response = requests.request(method, url, data=data, headers=headers)

    # Make sure to copy the content-type header from the original response to the new response
    content_type = response.headers.get('Content-Type')
    response_headers = {'Content-Type': content_type} if content_type else {}

    return Response(response.content, status=response.status_code, headers=response_headers)

@app.before_request
def log_request():
    print(f"Received request: {request.url} - {request.method}")

if __name__ == '__main__':
    app.run(debug=True)

短时间内利用 UWR 对 RWS 发送大量请求

为了追求项目的实时性，短时间内 Unity 利用 UWR 向机械臂(RWS)发送大量请求，前70个请求成功，而后的请求报 “503 Service Unavailable (Too many sessions 70/70)”错，且当双方断开连接时，仍需要一段时间“冷却”，而后才能请求正确收到回复，然后短时间内约70个 UWR 的 http 的请求后，重复上述 503 错误。使用C#提供的 HTTP 相关类时未见此问题。当503报错时，关闭代理服务器，重新插拔网线，都不能立刻释放此70个sessions。

值得注意的是，当 UWR 已经收到503报错时，再继续使用Postman测试相关接口，如(http://192.168.x.x/rw/rapid/tasks/T_ROB1/motion?resource=jointtarget)时，Postman有时可以正常收到数据。复盘此情况，推测是在排障中，由 Postman 已经发送了带 http头”Connection: Keep-Alive”并成功建立了正常的连接，早于 UWR 的请求，换言之，其 70 个session中已经维护了一个与postman的长连接。冷却后，使用 Postman 短时间内大量测试相关接口可以持续获得正常的数据，未见503报错。

冷却后，当使用Edge浏览器短时间内大量访问接口，前70个请求成功，而后的也会503报错，表现与 UWR 一样，且观察浏览器发出的 HTTP 请求，其已携带”Connection: Keep-Alive”，不同的是，浏览器发出的 HTTP 带有很长的“User-Agent”头，这一点没弄明白。

冷却后，当使用 Python 对接口短时间内大量发送简单的http请求（不挟带请求头”Connection: Keep-Alive”）时，前70个请求成功，而后的也会503报错，表现与 UWR 一样。

经检查，（编辑器 2022.3 版本默认的） UWR 发出的 HTTP 请求默认不携带标头 Connection: Keep-Alive，有讨论，见Connection: keep-alive in Unity Web Request?，且当使用 UnityWebRequest.SetRequestHeader 手动设置此标头时，会见警告且官方文档不推荐如此做。

最终，通过 UnityWebRequest.SetRequestHeader 手动设置标头”Connection: Keep-Alive”，解决了上述 503 报错。

几乎同一时刻对 RWS 发送多个请求

在将原线程替换为 UniTask 后，某个方法每帧将同时对 RWS 发送三个不同的 HTTP 请求，导致报 “Connection manager can’t add .. ” 错，改为一帧（约23ms）轮流发一个 HTTP 请求后解决。

HttpClient.PostAsync 与 UnityWebRequest.Post

使用PostAsync时，需要传入一个string和一个httpcontent，在使用 .Post 时，可以是两个string，也可以是一个string和一个 WWWForm，推荐使用后者，可以规避一些可能的编码问题。

反序列化时 dynamic 关键字引起的崩溃

项目中使用从 Unity Package Manager 中添加的 Newtonsoft.Json 来处理请求，原本从字符串中反序列化对象代码如下：

dynamic obj = JsonConvert.DeserializeObject(jsonStr);
var state = obj.name;

初次尝试打WebGL包时会报缺少某命名空间错，而后在项目设置中将 API 兼容性 级别改为 .Net Framewrok 后不再报错。
上述代码会导致WebGL运行时弹窗报错奔溃，推荐参考 json 的内容定义类型而后获取对应字段的值。

[Serializable]
public class People
{
    public string name;
    public int age;
    public DateTime birthday;
    public bool isMarried;
    public float money;
}

public void DeserializeJson()
{
    string jsonStr = "{\"name\" :\"张三\",\"age\":30,\"birthday\":\"1990-03-31T17:15:29\",\"isMarried\":true,\"money\":10.0}";

    People zhangsan = JsonConvert.DeserializeObject<People>(jsonStr);
    Debug.Log("zhangsan.name " + zhangsan.name + " birthday: " + zhangsan.birthday + " isMarried: " + zhangsan.isMarried);

    //output: zhangsan.name 张三 birthday: 03/31/1990 17:15:29 isMarried: True
}