Unity WebGL实现视频文件上传至服务器的方案咨询（优先非JS插件）

纯Unity原生实现的可能性 #

没有纯Unity原生的实现方式。Unity WebGL运行在浏览器沙箱环境中，原生Unity API无法直接调用浏览器的文件选择对话框和文件读取能力，必须借助浏览器的JavaScript接口完成文件选择与数据读取，再传递给Unity端处理上传逻辑。

可行的实现方案 #

方案1：自行编写极简JS交互（无需第三方插件） #

仅需少量JS和Unity C#代码即可完成，无需依赖复杂插件：

1. 在Unity项目的Assets/Plugins/WebGL目录下创建FileUpload.jslib文件，代码如下：

mergeInto(LibraryManager.library, {
    OpenFileDialog: function() {
        const input = document.createElement('input');
        input.type = 'file';
        input.accept = 'video/*'; // 限制仅选择视频文件
        input.onchange = function(e) {
            const file = e.target.files[0];
            if (!file) return;
            
            const reader = new FileReader();
            reader.onload = function(event) {
                const arrayBuffer = event.target.result;
                // 转换文件名格式并分配内存
                const fileNamePtr = allocate(intArrayFromString(file.name), 'i8', ALLOC_NORMAL);
                const bufferPtr = _malloc(arrayBuffer.byteLength);
                HEAPU8.set(new Uint8Array(arrayBuffer), bufferPtr);
                // 调用Unity端处理方法
                UnitySendMessage('FileUploadManager', 'OnFileSelected', fileNamePtr, arrayBuffer.byteLength, bufferPtr);
            };
            reader.readAsArrayBuffer(file);
        };
        input.click();
    },
    FreeMemory: function(ptr) {
        _free(ptr);
    }
});

2. 创建C#脚本FileUploadManager.cs，挂载到名为FileUploadManager的GameObject上：

using UnityEngine;
using System.Runtime.InteropServices;
using System.IO;
using UnityEngine.Networking;

public class FileUploadManager : MonoBehaviour
{
    [DllImport("__Internal")]
    private static extern void OpenFileDialog();
    
    [DllImport("__Internal")]
    private static extern void FreeMemory(System.IntPtr ptr);

    // JS回调的文件接收方法
    public void OnFileSelected(System.IntPtr fileNamePtr, int fileSize, System.IntPtr fileDataPtr)
    {
        // 读取文件名并释放内存
        string fileName = Marshal.PtrToStringUTF8(fileNamePtr);
        FreeMemory(fileNamePtr);
        
        // 读取文件数据并释放内存
        byte[] fileData = new byte[fileSize];
        Marshal.Copy(fileDataPtr, fileData, 0, fileSize);
        FreeMemory(fileDataPtr);

        // 启动上传协程
        StartCoroutine(UploadToServer(fileName, fileData));
    }

    // 服务器上传逻辑
    IEnumerator UploadToServer(string fileName, byte[] fileData)
    {
        const string uploadUrl = "你的服务器上传接口地址";
        var form = new WWWForm();
        form.AddBinaryData("videoFile", fileData, fileName);

        using (var request = UnityWebRequest.Post(uploadUrl, form))
        {
            yield return request.SendWebRequest();

            if (request.result != UnityWebRequest.Result.Success)
            {
                Debug.LogError($"上传失败: {request.error}");
            }
            else
            {
                Debug.Log($"上传成功: {request.downloadHandler.text}");
            }
        }
    }

    // UI按钮绑定方法，触发文件选择
    public void OpenFilePicker()
    {
#if UNITY_WEBGL && !UNITY_EDITOR
        OpenFileDialog();
#else
        // 编辑器环境下模拟文件选择
        string path = UnityEditor.EditorUtility.OpenFilePanel("选择视频文件", "", "mp4,avi,mov,mkv");
        if (!string.IsNullOrEmpty(path))
        {
            byte[] data = File.ReadAllBytes(path);
            StartCoroutine(UploadToServer(Path.GetFileName(path), data));
        }
#endif
    }
}

3. 在Unity UI中添加按钮，绑定FileUploadManager的OpenFilePicker方法即可。

方案2：第三方插件推荐 #

如果不想手动编写JS代码，可选择以下成熟插件：

• Unity WebGL File Browser：专注WebGL文件选择与数据传递，提供封装好的C# API，支持自定义文件类型过滤，集成成本低。
• WebGL Utilities：包含文件上传、下载等多种浏览器交互工具，适合需要扩展多个WebGL功能的项目。
• FilePicker for WebGL：轻量级插件，仅聚焦文件选择与数据读取，体积小，无冗余功能。

内容的提问来源于stack exchange，提问作者Fatemeh Zare