当前位置： 首页 > news >正文

Unity webgl 获取图片或视频数据

news 2025/5/6 5:24:08

这一版有部分问题，使用最下面的…

WebFilePicker.jslib (放在Plugins目录)

var WebFilePickerLibrary = {/*** 从浏览器中获取文件并发送给 Unity WebGL 应用程序。* @param {number} objectNamePtr - Unity 对象名称的指针。* @param {number} funcNamePtr - Unity 回调函数名称的指针。* @param {number} fileTypePtr - 允许的文件类型字符串的指针。* @param {number} allowMultiple - 是否允许多选（1 表示允许多选，0 表示单选）。* @param {number} maxSizeMB - 文件大小限制（单位：MB）。如果 <=0，则无限制。*/getFileFromBrowser: function(objectNamePtr, funcNamePtr, fileTypePtr, allowMultiple, maxSizeMB) {var objectName = UTF8ToString(objectNamePtr);var funcName = UTF8ToString(funcNamePtr);var fileType = UTF8ToString(fileTypePtr);var maxSizeBytes = maxSizeMB > 0 ? maxSizeMB * 1048576 : 0;var input = document.createElement("input");input.type = "file";input.multiple = !!allowMultiple; // 转换为布尔值input.accept = fileType;input.style.display = "none";/*** 处理通用文件* @param {File[]} files - 用户选择的文件列表。*/var handleFiles = function(files) {var results = [];var filesProcessed = 0;for (let i = 0; i < files.length; i++) {const file = files[i];// 检查文件大小限制if (maxSizeBytes > 0 && file.size > maxSizeBytes) {SendMessage(objectName, funcName,`error:File '${file.name}' exceeds limit (${(file.size / 1048576).toFixed(1)}MB/${maxSizeMB}MB)`);return;}const reader = new FileReader();reader.onload = (e => {results.push({name: file.name,type: file.type,data: new Uint8Array(e.target.result)});filesProcessed++;// 所有文件处理完毕时发送结果if (filesProcessed === files.length) {var resultData = results.map(result => {return {name: result.name,type: result.type,data: Array.from(result.data)};});SendMessage(objectName, funcName, JSON.stringify(resultData));}});reader.readAsArrayBuffer(file);}};// 监听文件选择事件input.addEventListener('change', function(evt) {const files = evt.target.files;if (!files || files.length === 0) {SendMessage(objectName, funcName, "error:No file selected");return;}handleFiles(files);});// 触发文件选择对话框document.body.appendChild(input);input.click();document.body.removeChild(input);}
};mergeInto(LibraryManager.library, WebFilePickerLibrary);

WebFilePicker.cs

using System;namespace MYTOOL
{[Serializable]public class FileResult{public string name;     // 文件名称public string type;    // MIME 类型public byte[] data;    // 二进制数据}/// <summary>/// 提供与Unity WebGL平台交互的方法，用于从浏览器中获取文件(图片、视频或其他类型)/// </summary>public static class WebFilePicker{public const string IMAGE_FILE_TYPE = "image/*";public const string VIDEO_FILE_TYPE = "video/*";#if UNITY_WEBGL[System.Runtime.InteropServices.DllImport("__Internal")]private static extern void getFileFromBrowser(string objName, string methodName, string fileType, bool allowMultiple, int maxSizeMB);
#endif/// <summary>/// 从浏览器中获取图片文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetImageFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFileFromBrowser(objName, methodName, IMAGE_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取多个图片文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetImagesFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFilesFromBrowser(objName, methodName, IMAGE_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取视频文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetVideoFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFileFromBrowser(objName, methodName, VIDEO_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取任意类型的文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="fileType">文件类型</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetFileFromBrowser(string objName, string methodName, string fileType, int maxSizeMB = 0){
#if UNITY_WEBGL && !UNITY_EDITORgetFileFromBrowser(objName, methodName, fileType, false, maxSizeMB);
#elseUnityEngine.Debug.LogError("only implemented for WebGL platform.");
#endif}/// <summary>/// 从浏览器中获取多个任意类型的文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="fileType">文件类型</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetFilesFromBrowser(string objName, string methodName, string fileType, int maxSizeMB = 0){
#if UNITY_WEBGL && !UNITY_EDITORgetFileFromBrowser(objName, methodName, fileType, true, maxSizeMB);
#elseUnityEngine.Debug.LogError("only implemented for WebGL platform.");
#endif}}
}

使用：调用WebFilePicker里提供的方法，回调时返回json字符串，反序列化为FileResult即可拿到原始数据。
注意：mime_type => type
在这里插入图片描述
效果：
在这里插入图片描述

统一格式返回(数组)
WebFilePicker.jslib (放在Plugins目录)

var WebFilePickerLibrary = {/*** 从浏览器中获取文件并发送给 Unity WebGL 应用程序。* @param {number} objectNamePtr - Unity 对象名称的指针。* @param {number} funcNamePtr - Unity 回调函数名称的指针。* @param {number} fileTypePtr - 允许的文件类型字符串的指针。* @param {number} allowMultiple - 是否允许多选（1 表示允许多选，0 表示单选）。* @param {number} maxSizeMB - 文件大小限制。如果<=0则无限制。*/getFileFromBrowser: function (objectNamePtr, funcNamePtr, fileTypePtr, allowMultiple, maxSizeMB) {var objectName = UTF8ToString(objectNamePtr);var funcName = UTF8ToString(funcNamePtr);var fileType = UTF8ToString(fileTypePtr);var maxSizeBytes = maxSizeMB > 0 ? maxSizeMB * 1048576 : 0;var inputFile = document.createElement("input");inputFile.type = "file";inputFile.multiple = !!allowMultiple; // 转换为布尔值inputFile.accept = fileType;inputFile.style.display = "none";// 标记是否已完成操作let isHandled = false;/*** 处理通用文件* @param {File[]} files - 用户选择的文件列表。*/var handleFiles = function (files) {var results = [];var filesProcessed = 0;for (let i = 0; i < files.length; i++) {const file = files[i];// 检查文件大小限制if (maxSizeBytes > 0 && file.size > maxSizeBytes) {var errorResult = [{result: -3,name: file.name,type: file.type,data: []}];SendMessage(objectName, funcName, JSON.stringify(errorResult));return;}const reader = new FileReader();reader.onload = (e => {results.push({result: 0,name: file.name,type: file.type,data: Array.from(new Uint8Array(e.target.result))});filesProcessed++;// 所有文件处理完毕时发送结果if (filesProcessed === files.length) {SendMessage(objectName, funcName, JSON.stringify(results));}});reader.onerror = () => {var errorResult = [{result: -2,name: file.name,type: file.type,data: []}];SendMessage(objectName, funcName, JSON.stringify(errorResult));};reader.readAsArrayBuffer(file);}};// 监听文件选择事件inputFile.addEventListener('change', function (evt) {isHandled = true;const files = evt.target.files;if (files.length > 0) {handleFiles(files);} else {var cancelResult = [{result: -1,name: "",type: "",data: []}];SendMessage(objectName, funcName, JSON.stringify(cancelResult));}// 清理 focus 监听器window.removeEventListener('focus', onFocus);});// 定义 focus 事件的回调函数var onFocus = () => {setTimeout(() => {if (!isHandled) {var cancelResult = [{result: -1,name: "",type: "",data: []}];SendMessage(objectName, funcName, JSON.stringify(cancelResult));}}, 200);};// 监听窗口焦点事件（部分浏览器取消选择后会触发）window.addEventListener('focus', onFocus, {once: true});// 触发文件选择对话框document.body.appendChild(inputFile);inputFile.click();document.body.removeChild(inputFile);}
};mergeInto(LibraryManager.library, WebFilePickerLibrary);
using System;namespace MYTOOL
{[Serializable]public class FileSelectionResult{/// <summary>/// <para> 0 正常</para>/// <para>-1 取消</para>/// <para>-2 加载错误</para>/// <para>-3 文件大小超出限制</para>/// </summary>public int result;/// <summary>/// 文件名称/// </summary>public string name;/// <summary>/// MIME 类型/// </summary>public string type;/// <summary>/// 二进制数据/// </summary>public byte[] data;/// <summary>/// 是否操作成功/// </summary>public bool IsSuccess => result == 0;/// <summary>/// 用户是否取消了操作/// </summary>public bool IsCancelled => result == -1;/// <summary>/// 是否发生加载错误/// </summary>public bool IsLoadError => result == -2;/// <summary>/// 文件大小是否超出限制/// </summary>public bool IsSizeExceeded => result == -3;/// <summary>/// 获取状态描述信息/// </summary>public string StatusMessage =>result switch{0 => "操作成功",-1 => "用户取消",-2 => "加载错误",-3 => "文件大小超出限制",_ => "未知状态"};/// <summary>/// 判断是否有文件数据/// </summary>public bool HasFileData => data != null && data.Length > 0;/// <summary>/// 获取文件大小（以字节为单位），如果 data 为空则返回 0/// </summary>public long GetFileSize() => data?.Length ?? 0;}/// <summary>/// 提供与Unity WebGL平台交互的方法，用于从浏览器中获取文件(图片、视频或其他类型)/// </summary>public static class WebFilePicker{public const string IMAGE_FILE_TYPE = "image/*";public const string VIDEO_FILE_TYPE = "video/*";#if UNITY_WEBGL[System.Runtime.InteropServices.DllImport("__Internal")]private static extern void getFileFromBrowser(string objName, string methodName, string fileType, bool allowMultiple, int maxSizeMB);
#endif/// <summary>/// 从浏览器中获取图片文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetImageFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFileFromBrowser(objName, methodName, IMAGE_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取多个图片文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetImagesFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFilesFromBrowser(objName, methodName, IMAGE_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取视频文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetVideoFromBrowser(string objName, string methodName, int maxSizeMB = 0){GetFileFromBrowser(objName, methodName, VIDEO_FILE_TYPE, maxSizeMB);}/// <summary>/// 从浏览器中获取任意类型的文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="fileType">文件类型</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetFileFromBrowser(string objName, string methodName, string fileType, int maxSizeMB = 0){
#if UNITY_WEBGL && !UNITY_EDITORgetFileFromBrowser(objName, methodName, fileType, false, maxSizeMB);
#elseUnityEngine.Debug.LogError("only implemented for WebGL platform.");
#endif}/// <summary>/// 从浏览器中获取多个任意类型的文件/// </summary>/// <param name="objName">Unity对象名称</param>/// <param name="methodName">Unity回调方法名称</param>/// <param name="fileType">文件类型</param>/// <param name="maxSizeMB">文件大小限制。如果为0则无限制</param>public static void GetFilesFromBrowser(string objName, string methodName, string fileType, int maxSizeMB = 0){
#if UNITY_WEBGL && !UNITY_EDITORgetFileFromBrowser(objName, methodName, fileType, true, maxSizeMB);
#elseUnityEngine.Debug.LogError("only implemented for WebGL platform.");
#endif}}
}

http://www.mrgr.cn/news/99064.html

相关文章：

  • leetcode 300. Longest Increasing Subsequence
  • AI分析师
  • 爬虫入门学习
  • 计算机网络八股——HTTP协议与HTTPS协议
  • 杨校老师课堂之C++入门练习题梳理
  • 【刷题Day20】TCP和UDP（浅）
  • Ubuntu20.04下Docker方案实现多平台SDK编译
  • 信创开发：开启信息自主创新、国产替代新时代
  • pgsql中使用jsonb的mybatis-plus和Spring Data JPA的配置
  • MLA（多头潜在注意力）原理概述
  • js day3
  • Redis命令——list
  • 将 DeepSeek 集成到 Spring Boot 项目实现通过 AI 对话方式操作后台数据
  • ospf实验
  • 山东科技大学人工智能原理考试回忆复习资料
  • [密码学实战]基于Python的国密算法与通用密码学工具箱
  • 命令update-alternatives
  • 剑指Offer（数据结构与算法面试题精讲）C++版——day15
  • Github 2FA(Two-Factor Authentication/两因素认证)
  • Linux驱动开发--阻塞、非阻塞I/O