Unity发布WebGL注意事项以及移动端打开webgl网页

1. Unity发布WebGL网页端

Unity发布webGL项目时存在很多的易错点，这些错误点没有统一的规律，因为是跨平台开发，开发过程中需要去解决未知的和已知的报错点，下面就我这两年开发WebGL遇到的问题做一个总结，还有的就是大家常遇到的坑我也进行汇总。

1. 1. 资源导入 ：

关键字：顶点、分辨率；

1. 发布了WebGL之后，网页运行有时候发现灯光会变暗，因为WebGL不支持实时光照的问题；

解决方法 ：所以我们将光照可以做成LightingMap 使用，可以缓 解这一问题。

1. 一些图片UI会在打包webGL之后在网页中会显示模糊；

解决方法：美术制作UI时候分辨率&比例调整好。

1. Unity自带的字体，在webGL网页中是显示不出来；

解决方法：手动导入新的字体，比如微软自带的微软雅黑字体。

1. WebGL的渲染和Unity的渲染差异，部分材质是不可以用的；

解决方法：开发时多做测试，对于显示不出来的材质进行更换&修改Shader。

1. 尽量避免使用第三方插件（有些插件可以解决Bug或者大大提高效率，我们视情况而定）。

1. 1. 场景开发：

关键字：优化、插件

1. Unity自带的视频播放器在开发webGL时候是不能用的；

解决方法：用AVpro视频插件来代替Unity自带播放器。

1. 场景加载实现异步加载；

解决方法：我们可以通过协程方法来实现异步加载，部分代码：IEnumerator Start() 

    {

        AsyncOperation scene = Application.LoadLevelAsync("");

        yield return scene;

        Debug.Log("加载完毕");

    }

1. 对于场景中不同距离的模型我们采用LOD进行场景优化；

LOD：Level Of Details多层次细节，unity中自带的一个组件，在场景中添加&设置即可。

1. 1. 代码模块 :

关键字：信息传递、减少循环

1. 在开发过程中由于WebGL的资源限制，我们要和数据库进行数据传输时候不能直接访问数据库；

解决方法：我们可以通过JS作为中转站来访问，我们可以使用

Application.ExternalCall()来调用，可以传递一些参数和信息。

1. 脚本中不用的代码一定要删除，因为有些代码会产生GC
2. Getcomponent  Gameobject.find（）等这些方法尽量少用，而且千万不要放在Update中循环执行
3. Update里面的逻辑尽量不要太复杂

1. 1. 打包设置：

关键字：位置、调试

1. 在Publishing Settings设置里面找到压缩格式 勾选为Gzip；"Enable Exceptions"是异常捕获的一个开关，开发期间可以打开进行调试，当我们最终发布时候要将这个选为None；
2. 打包位置要和工程包在同一级；
3. 打包的每一级目录必须为全英文，不能出现中文；
4. 打包时候，减少包里程序代码量可以在othersetting中启用Strip Engine Code；
5. 目前webgl支持的浏览器为火狐、谷歌、Safari浏览器；

1. WebGL在移动端的应用（）
   1. 实现方法：

Unity发布webGL后，很多时候我们需要在移动端展示，此时找到UnityLoader.js文件，做下面的修改即可在手机端打开：

compatibilityCheck:function(e,t,r){

    UnityLoader.SystemInfo.hasWebGL?

        UnityLoader.SystemInfo.mobile?

            t()

           :["Firefox","Chrome","Safari"].indexOf(UnityLoader.SystemInfo.browser)==-1?

        :e.popup("Yourbrowse does not support WebGL",[{text:"OK",callback:r}])    },

1. 1. 注意事项：
2. 当我们在移动端进行三维模型的展示时，我们在开发过程中需要对模型进行三维动画的录制，通过点触屏幕调用方法即可实现，包括三维模型的全景展示、三维模型局部放大展示、信息调用等等，需要注意的是那些需要点击的按钮或者隐藏按钮的坐标问题，因为发布到webGL手机端时，按钮的实际坐标可能会发生变化；

解决方法：使用锚点来做场景的UI部分

1. 当在手机端打开时，我们要设置webGL自适应屏幕；

解决方法：下面是关键代码