Unity发布WebGl注意事项

最新推荐文章于 2025-03-05 17:46:23 发布
转载 最新推荐文章于 2025-03-05 17:46:23 发布 · 968 阅读 · 4 ·
CC 4.0 BY-SA版权
原文链接：https://www.cnblogs.com/huwenya/p/9547224.html

本文详细介绍了Unity WebGL项目的发布流程、配置优化技巧及注意事项，包括压缩方式、内存分配、异常处理、剥离引擎代码、资源加载、图形限制、网络通信、音频处理、性能优化、内存管理、与JS交互等内容。

unity 版本是5.5，不过看了2017的文档好像也是差不多，绝大部分都是根据官方文档，希望有帮助，如果有错误或者你知道更多这方面的只是，请告知下，大恩言谢。

1：对webgl发布的工程文件说明

    

在release文件夹中，如果你使用了gzip压缩，那么你的文件后面会有个.gz

2：如何在pc上面运行webgl

 

   （1）：发布webgl之后不能直接点（index.html）打开查看工程(火狐 和win10 Edge浏览器可以直接打开)，需要建立服务器通过服务器地址来访问。

    （2）：但是在chrome浏览器中可以使用命令行启动来打开，然后在打开的浏览器网页中通过地址来打开webgl

 

3：other settings设置

    和其他平台有些不一样，值得注意的是这个"Strip Engine Code"，剥离引擎代码的选项。选中此选项后，Unity不包括不使用的任何类的代码。例如，如果您不使用任何物理组件或功能，整个物理引擎将从您的构建中删除。没有音频功能，unity会在封装的时候去掉这部分代码以减少大小。

如果你的项目中使用到了资源包"AssetBundles"进行动态加载，要注意。如果你不想某些被剥离，请使用link.xml具体百度unity link.xml

如果在项目之后，发现有如下错误 Could not produce class with ID XXX 说明有代码被分离

文档：https://docs.unity3d.com/Manual/IL2CPP-BytecodeStripping.html  https://docs.unity3d.com/Manual/iphone-playerSizeOptimization.html

       

 第二个方法是干脆去掉剥离代码的选项，但是构建体积会有所增大

 

4：publishing settings设置

（1）：是webgl可用内存大小的分配，单位是MB，

   建议在"64-512"之间,默认的是256,，这里设置的值在封装以后也可以在发布后index.html文件中修改,具体位置位于页面底部的<script>标签中

（2）：参数"Enable Exceptions"，用来异常捕获开关，调试期间可以打开，产品发布的时候需要去掉。

        共有三个选项

        none:关闭

        Explicitly Thrown Exceptions Only:默认选项，只处理脚本中throw部分的代码，同时也会增大代码体积。

        Full:会捕获所有的调试信息，除了代码中的throw，还会将空的引用，非法索引数组，堆栈信息一同捕获。

 

（3）：压缩方式 默认是gzip， 更佳的是Brotli但是需要更多的时间压缩，这个方式只支持火狐和谷歌浏览器

5：注意方面

（1）：

（2）：使用assetBundle的一些贴士

（3）：如果要修改发布的文件相对于index.html的位置，要打开index.html修改相应Uri的路径，也可以放在相应的uri网络地址

        

 

（4）：WebGL无法使用monodevelop 或者vs来调试 但是可以使用debug来打印到的浏览器的控制台

6：WebGL图形方面

 

         https://docs.unity3d.com/Manual/webgl-graphics.html

 

         WebGL图形 是一种用于在Web浏览器中渲染图形的API，它基于OpenGL ES图形库的功能。 WebGL 1.0大致匹配OpenGL ES 2.0功能，WebGL 2.0大致匹配OpenGL ES 3.0功能。

（1）：Unity WebGL仅支持烘焙GI。 WebGL目前不支持实时GI。此外，仅支持非定向光照贴图。

（2）：WebGL运行时不支持 Procedural Materials,在运行是会变成普通的材质（Procedural Materials好像是substance的一种材质，具体可以查看文档）

（3）：不支持MovieTextures

     官方有个Simple MovieTexture for Unity WebGL demo但是已经不见了，可以用这个插件播放视频，也可以用avpro插件播放视频

     http://renderheads.com/product/avpro-video/ 里面有个demo和unitypackage

（4）：WebGL不支持线性色彩空间渲染（WebGL does not support linear color space rendering）

（5）：对shader也有限制（具体查看文档）

（6）：无法访问用户机器上安装的字体，所有在使用字体的时候要放到assets里面

（7）：支持抗锯齿，在Quality Setting中启用抗锯齿功能

（8）：反射探针在WebGL中得到支持，但由于WebGL规范中有关渲染到特定mipmap的限制，不支持平滑的实时反射探测器（因此实时反射探测器将始终产生尖锐的反射，这可能会显示非常低的分辨率）

 

7：网络方面

 

https://docs.unity3d.com/Manual/webgl-networking.html

（1）：由于安全隐患，JavaScript代码不能直接访问IP套接字来实现网络连接。因此，.NET网络类（即System.Net命名空间中的所有内容，特别是System.Net.Sockets）在WebGL中是不起作用的。这同样适用于Unity的旧UnityEngine.Network *类，这些类在构建WebGL时不可用    目前可以选择使用Unity中的WWW或UnityWebRequest类，或支持WebGL的新的UnityNetworking，或者使用JavaScript中的WebSockets或WebRTC实现您自己的网络AssetsStore有个官方的WebSockets Demo

 

（2）：使用WWW or WebRequest的访问跨域资源施安全限制，使用WWW或UnityWebReqest访问内容，并且远程服务器没有正确设置CORS，则在浏览器控制台中将会看到如下错误信息：Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://myserver.com/. This can be fixed by moving the resource to the same domain or enabling CORS. 查看https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS

 

（3）：不要阻止www或者unitywwwrequest的下载，比如：while(!www.isDone) {}都是不被允许的 note:webgl是单线程 ，也就是说下载的时候你什么都别动

 

（4）：使用Networking.NetworkManager.useWebSockets.具体查看文档

 

（5）：在webgl中要使用使用套接字 需要使用webscoket和webRTC。webscoket官网有个简单的例子

        https://www.assetstore.unity3d.com/en/#!/content/38367e       

使用webRTC要注意有些局限 文档：both networking protocols supported by browsers. Web Sockets has wider support, but WebRTC allows p2p connections between browsers and unreliable connections. Neither of these protocols are exposed through built-in APIs in Unity yet, but it is possible to use a JavaScript plugin to implement this.

 

8：Audio方面

 

  这个还是看文档吧https://docs.unity3d.com/Manual/webgl-audio.html

 

9：性能方面

 

  https://docs.unity3d.com/Manual/webgl-performance.html     

（1）：在质量设置中设置为fastest捕捉异常设置为none

 

（2）：可以设置为Application.runInBackground However, it should be noted that browsers may throttle content running in background tabs. If thetab with your content is not visible, your content will only be updated once a second in most browsers. Note that this will cause Time.time toprogress slower than usual with the default settings, as the default value of Time.maximumDeltaTime is lower than one second.

 

（3）：可以使用Application.targetFrameRate API来限制帧速率。

 

10：内存方面

 

        https://docs.unity3d.com/Manual/webgl-memory.html

 

11：与网页js代码交互

 

        https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html

 

 （1）：webgl调用js代码可以使用 Application.ExternalCall() and Application.ExternalEval()，

         在js中调用untiy代码使用SendMessage ('MyGameObject', 'MyFunction', 'foobar');（物体，函数，参数）

 

 （2）：使用js插件，在你的unity中（跟其他自己编写插件一样）Assets/Plugins/WebGL/MyPlugin.jslib，注意后缀名是jslib

        http://blog.youkuaiyun.com/llddyy123wq/article/details/5620466 

 

12：网页模板

 

        https://docs.unity3d.com/Manual/webgl-templates.html

 

13: input方面的支持

 

          https://docs.unity3d.com/Manual/webgl-input.html

   （1）：Gamepad and Joystick support

   （2）：Touch support

   （3）：Keyboard input

 说一下关于有些碰到 unity InputFiled不能输入中文的问题 可以在AssetsStore有个官方的IME Input for Unity Demo 

 

最后附上一张WebGL Browser Compatibility图片

14 ：字体

            不能使用unity默认的字体 ，必须在项目文件中包含一个字体文件

Unity 之 发布WebGL转微信小游戏过程详解
陈言必行 -- Unity游戏开发领域优质博主
06-01 2万+
降低 Unity 游戏转换到微信小游戏的开发成本。无需更换Unity引擎与重写核心代码的情况下将原有游戏项目适配到微信小游戏。 方案特点 保持原引擎工具链与技术栈 无需重写游戏核心逻辑，支持大部分第三方插件 由转换工具与微信小游戏运行环境保证适配兼容，保持较高还原度 微信小游戏平台能力以C# SDK方式提供给开发者，快速对接平台开放能力...
webgl限制帧率_Unity发布WebGl注意事项
weixin_39555715的博客
12-19 1526
WebGL图形 是一种用于在Web浏览器中渲染图形的API，它基于OpenGL ES图形库的功能。 WebGL 1.0大致匹配OpenGL ES 2.0功能，WebGL 2.0大致匹配OpenGL ES 3.0功能。(1)：Unity WebGL仅支持烘焙GI。 WebGL目前不支持实时GI。此外，仅支持非定向光照贴图。(2)：WebGL运行时不支持Procedural Materials,在运...
Unity中发布WebGL时需要注意哪些事项
qq_43511290的博客
12-17 703
Unity中发布WebGL时需要注意哪些事项确保Unity已经下载了WebGL平台,并已切换好平台![在这里插入图片描述](https://img-blog.csdnimg.cn/20191217173225919.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLm...
Unity3D WEBGL项目注意事项
宇鱼鱼的代码记录
06-02 1633
unity打包webgl项目碰到的一些问题，做个小记录
【问题汇总】Unity发布WebGL项目时需要注意的问题
Zorks的博客
12-12 5604
头一次使用Unity开发项目，发布网站的时候碰到了各种各样的问题，在此做个阶段性汇总。内容包括：自定义模板，发布压缩设置与web.config，屏幕自适应，unity脚本调用javascript
精选资源
Unity打包Webgl端进行 全屏幕自适应
06-01
六、注意事项 1. 请确保在不同的设备和浏览器上测试你的WebGL应用，因为不同的浏览器对WebGL和CSS的支持程度可能有所不同。 2. 针对移动设备，可能需要考虑横竖屏切换的适配。 3. 考虑性能优化，如减少不必要的渲染...
Unity使用WebGL发布项目和注意事项
dagongrenxiaoqi的博客
08-05 1936
大家都玩过吧，只需要在网页上轻轻一点，就能体验到各种类型的游戏。这种交互模式非常敏捷和简便，省去了游戏安装的繁杂流程，因此也收获了大量受众。那么如何制作类似的游戏方式呢，今天小棋就分享下这种打包方式，帮助你将制作的游戏发布到网页上，点击即玩~，可以点击试玩体验下。项目源码放在知识星球里，欢迎加入~
Unity WebGL 注意事项
qq_44810574的博客
11-09 1079
【代码】Unity WebGL 注意事项。
unity6 打包webgl注意事项
鱼子酱F的博客
03-05 641
使用localization插件时要注意，webgl不支持WaitForCompletion，LocalizationSettings.InitializationOperation和LocalizationSettings.StringDatabase.GetTable都不能用。不知道为什么web端绑定在预制上的脚本会missing，但工程里是正常的，查了很久都没找到为什么，网上的说法都试了没用，最后没办法在代码中动态添加好了。选项，允许在流式编译失败时自动回退到其他加载模式‌。打开 Unity 设置。
Unity | 发布WebGL遇到的那些事儿
该用户还没想到好的昵称的博客
01-03 2000
发布WebGL后，遇到了跨域问题，原先可成功调用的上传、删除等接口报405错误 发布WebGL后，InputFeild输入框不支持复制粘贴 发布WebGL后，本地文件读取不了了
Unity3d WebGL使用限制
yuyingwin的专栏
12-25 4119
一、WebGL 代码编译 C#→C++→JavaScripts /*********** WebGL 使用注意事项 *************/ 二、WebGL受浏览器支持限制，不支持Mobile端使用（不是真正的html5）。 三、不支持多线程，System.Threading命名空间下的方法不支持 四、不支持Debug调试 五、不支持socket通信，如果需要网络通信需要使用www或
Unity3D的WebGL开发（一）发布设置
热门推荐
shi子的学习笔记
11-03 2万+
一.一般发布设置分以下五大类：(menu: Edit > Project Settings > Player) 1**Resolution and Presentation:** 设置分辨率和显示（如显示方向） 2 **Icon:**APP图标 3 Splash Image: 载入图片 4 Other Settings: 其他设置 5 Publishing Sett
unity打包webgl局限及优化建议
weixin_43787178的博客
07-25 6391
首先要知道编译流程 一．大致编译流程 c# -> 通过IL2CPP技术转换成c++ -> 使用 Emscripten编译器进行编译将脚本转换为JavaScript（但不是普通的 JS，而是一种叫做 asm.js的 JavaScript 变体） 二．Unity打包webgl局限 1. 不支持多线程 JS为单线程，所以代码中避免使用C#的多线程（托管的 dll中使用线程也不支持），实质上不支持System.Threading命名空间中的任何内容；可以用协程。 2. Socket限制 由于安全限制，S
Unity打包到Webgl平台以及遇到的问题
unity_http的博客
12-08 1万+
unity打包webgl
Unity Webgl 常见报错解决
weixin_45729432的博客
05-23 2174
【代码】Unity Webgl 常见报错解决。
Unity 打包发布安卓（android）和webgl时ProjectSettings界面参数设置
qq_41263535的博客
11-21 619
3、打开OtherSettings界面，ColorSpace设置为Gamma。2、只修改一个地方，打开PublishingSettings界面，添加密钥。2、打开PublishingSettings界面，添加密钥。1、新建一个项目，参数设置保持默认。1、新建一个项目，参数设置保持默认。一、安卓（android）
Unity5中WebGL平台封装的一些技巧
weixin_34009794的博客
12-09 2358
最近在接触unity的WebGL平台,其实这个平台作为Web Player的替代品,已经能满足大部分的开发需求,而且不需要额外的插件支持,确实方便了不少,但开发中依旧遇到了不少问题,在这里记录和共享一下解决方法。 首先还是构建选项,在"Player Settings"里。 Resolution and Presentation和老的web player没啥变化,你可以把你自制的模板放到 ...
unity发布webgl开发记录
青沐的程序生涯
05-06 1万+
安装Unity3d并导入unitypackage 在unity官网下载最新版本，虽然下载速度巨慢，安装的时候要把WebGL选上。 打开之后新建一个project，在Asset中点击右键import package将项目素材导入。弄好之后发布，选择File–>Build Settings–>选择WebGL，Development Build不要选，下面两个选项选上（先选了Development Build，把下面两个选项选上，再剔除Development Build）。刚开始的build a
unity发布webGL可以做模型缓存吗
最新发布
06-15
<think>我们正在讨论UnityWebGL中的模型缓存实现方法。根据引用内容，特别是引用[2]中提到的缓存机制，我们可以使用`WWW.LoadFromCacheOrDownload`接口来实现AssetBundle的缓存。虽然这个接口在旧版Unity中常用，但在Unity2018.3及以上版本，我们更推荐使用`UnityWebRequestAssetBundle`配合缓存机制。注意：在WebGL平台上，由于浏览器的安全限制，我们不能直接访问本地文件系统。因此，缓存需要利用浏览器的IndexedDB或缓存API。UnityWebGL已经为我们封装了这些机制。实现步骤：1.将模型打包成AssetBundle。2.在加载AssetBundle时，使用支持缓存的方法（如`UnityWebRequestAssetBundle`或旧版的`WWW.LoadFromCacheOrDownload`）来加载资源。以Unity2018.3及以上版本为例，使用`UnityWebRequestAssetBundle`实现缓存的步骤：步骤1：创建AssetBundle-在Unity编辑器中，将需要缓存的模型标记为AssetBundle，并构建AssetBundle。步骤2：上传AssetBundle到服务器-将构建好的AssetBundle文件上传到服务器，以便通过URL加载。步骤3：在WebGL项目中使用UnityWebRequestAssetBundle加载AssetBundle-使用`UnityWebRequestAssetBundle.GetAssetBundle`方法，并设置`UnityWebRequest`的缓存策略。示例代码：```csharpusingUnityEngine;usingUnityEngine.Networking;usingSystem.Collections;publicclassLoadAssetBundle:MonoBehaviour{publicstringbundleUrl;//AssetBundle的URLpublicstringassetName;//要加载的模型名称IEnumeratorStart(){//创建请求，使用缓存varrequest=UnityWebRequestAssetBundle.GetAssetBundle(bundleUrl);//发送请求yieldreturnrequest.SendWebRequest();if(request.result!=UnityWebRequest.Result.Success){Debug.LogError("加载AssetBundle失败:"+request.error);}else{//获取AssetBundleAssetBundlebundle=DownloadHandlerAssetBundle.GetContent(request);//加载模型GameObjectmodel=bundle.LoadAsset<GameObject>(assetName);//实例化模型Instantiate(model);//注意：AssetBundle在加载完资源后，可以根据情况决定是否卸载（这里为了演示，没有立即卸载）//bundle.Unload(false);}}}```注意：UnityWebRequestAssetBundle在WebGL平台上默认会使用浏览器的缓存机制（IndexedDB）。当资源被缓存后，后续加载会直接从缓存中读取，从而加快加载速度。另外，引用[2]中提到，缓存的上限在WebGL平台上是50MB（对于WebPlayer，但WebGL已无WebPlayer，所以实际取决于浏览器的限制）。但根据Unity文档，WebGL使用IndexedDB存储，其大小限制取决于浏览器和设备，通常较大（可达几百MB甚至GB级别），但具体需要测试目标浏览器的支持情况。重要提示：-由于浏览器的隐私策略，缓存可能被清除，因此不能完全依赖缓存持久性。-如果资源更新，可以通过在URL中添加版本号或时间戳来强制重新下载。例如：`bundleUrl+"?v="+versionNumber`。当版本号变化时，浏览器会将其视为新资源并重新下载缓存。总结：在UnityWebGL中实现模型缓存，主要是通过将模型打包成AssetBundle，然后使用Unity提供的支持缓存的加载方法（如UnityWebRequestAssetBundle）来实现。这样，加载过的模型会被存储在浏览器的IndexedDB中，下次加载时可以直接从缓存读取，提升加载速度。相关问题：1.如何构建AssetBundle？2.如何管理AssetBundle的版本更新？3.在WebGL平台上，缓存大小有限制吗？如何清除缓存？</think>### Unity WebGL 模型缓存实现方法 在Unity WebGL中实现模型缓存的核心是**利用AssetBundle和浏览器的IndexedDB存储**，具体实现步骤如下： #### 一、基础缓存机制 1. **AssetBundle打包** 将模型资源打包成AssetBundle： ```csharp // 编辑器脚本示例 [MenuItem("Assets/Build AssetBundle")] static void BuildBundles() { BuildPipeline.BuildAssetBundles("Assets/AssetBundles", BuildAssetBundleOptions.None, BuildTarget.WebGL); } ``` 2. **使用缓存API加载** 通过`UnityWebRequestAssetBundle`加载并自动缓存： ```csharp IEnumerator LoadModel(string bundleUrl) { var request = UnityWebRequestAssetBundle.GetAssetBundle(bundleUrl); yield return request.SendWebRequest(); if (request.result == UnityWebRequest.Result.Success) { AssetBundle bundle = DownloadHandlerAssetBundle.GetContent(request); GameObject model = bundle.LoadAsset<GameObject>("ModelName"); Instantiate(model); } } ``` - **自动缓存**：首次加载后资源会存入浏览器IndexedDB[^2] - **二次加载**：后续加载优先从本地缓存读取，速度提升显著 #### 二、关键优化设置 1. **启用数据缓存** 在Player Settings中勾选： ``` Publishing Settings > Data Caching ✅ ``` - 缓存上限：WebGL默认50MB（可扩展） - 缓存位置：浏览器IndexedDB存储[^1] 2. **压缩格式选择** ``` Publishing Settings > Compression Format ``` - 网络环境好：选`Disabled`（减少解压耗时） - 网络环境差：选`Gzip`（减小下载体积） 3. **缓存版本控制** 添加版本参数避免缓存冲突： ```csharp string url = "https://example.com/bundle?ver=1.2"; // 版本更新时修改 ``` #### 三、高级缓存管理 1. **手动清除缓存** ```csharp // 清除特定资源缓存 Caching.ClearCache(); // 清除所有缓存 if (Caching.ClearCache()) { Debug.Log("缓存已清空"); } ``` 2. **缓存状态监测** ```csharp // 检查缓存是否可用 if (Caching.IsVersionCached(bundleUrl, hash)) { // 从缓存加载 } ``` #### 四、注意事项 1. **缓存限制**： - 不同浏览器IndexedDB上限不同（通常250MB-1GB） - 超出限制时自动触发LRU（最近最少使用）淘汰[^2] 2. **安全策略**： - 需通过HTTPS协议加载资源 - 跨域资源需配置CORS响应头 3. **缓存更新**： - 修改AssetBundle后必须更新版本号 - 建议使用内容哈希值作为版本标识 > **性能对比**：启用缓存后二次加载速度可提升3-10倍，具体取决于模型复杂度[^1]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值