第十六篇：关于Unity开发WebGL遇到的坑

1、资源消耗问题。

Unity开发Web 项目，发布出来的项目是很消耗内存资源的，这是Unity引擎决定，我们要做的就是尽可能的优化，通常的方法有降低模型面数，降低贴图的大小，减少点光源，减小烘焙贴图大小等。当然也可以使用three.js开发Web端的三维项目，感兴趣的朋友可以去了解学习一下，但是毕竟它不像Unity有这么集成良好的平台，所以开发起来会比Unity慢很多的，同时还要求你有很好的代码能力和OpenGL知识。

2、连接数据库问题。

Unity连接数据库相信很多人都很熟练了，但是发布成WebGL后就无效了，因为Unity发布WebGL是不支持直连数据库的。那怎么办呢？现在最常见的办法就是Unity传消息到JS页面，然后JS页面再去获取数据库数据，然后传回到Unity中。也就是说JS充当了Unity和数据库之间的一个中转站。
在这里插入图片描述
（1）Unity向JS界面传递消息的方法是下面这个：
Application.ExternalCall("SayHello", s);
SayHello是在JS界面定义的方法，s是需要传过去的一个string类型的值。

（2）打包出WebGL后，打开Html页面，编写如下代码：

function SayHello(){    
    SendMessage("Main Camera", "Receive", s);   
}

SayHello是定义的方法，在Unity中调用，SendMessage是传值回Unity的函数，里面的参数：第一个，Unity中绑定接收方法的对象，第二个，Unity中定义的用于接收值的方法，第三个，传回去的string类型的值。

3、视频播放问题。

通常我们最常用的视频播放方法是使用Unity自带的Video Player 组件，可是当我发布出WebGL的时候，他是没用的，所以今天给大家推荐一个一个名为Simple MovieTextures for Unity WebGL的Unity插件，插件下载链接：
（https://download.csdn.net/download/dianmoliu/10436690?utm_source=bbsseo）这是一位博友提供的。
导入插件后，可以看到Sample中有一个demo场景和VideoTest脚本，打开SampleScene场景，并打开VideoTest脚本查看使用方法。场景中只包括一个Cube，将脚本放入并生成WebGL即可看到播放效果。（注意，不能直接调试！）
代码分析
打开 VideoTest脚本，对代码进行分析。

头文件（除了两个基本的，还要加入第三个）

using UnityEngine;
using System.Collections;
using System.Runtime.InteropServices;

Start（）方法

  WebGLMovieTexture tex;    //创建视频纹理信息
            public GameObject cube;    //选取视频播放所用的Cube
 
            void Start () {
                        tex = new WebGLMovieTexture("StreamingAssets/Chrome_ImF.mp4");
                        cube.GetComponent<MeshRenderer>().material = new Material (Shader.Find("Diffuse"));
                        cube.GetComponent<MeshRenderer>().material.mainTexture = tex;
            }

Update（）方法

void Update()
            {
                        tex.Update();
                        cube.transform.Rotate (Time.deltaTime * 10, Time.deltaTime * 30, 0);
            }
并且提供了GUI控件功能
            void OnGUI()
            {
                        GUI.enabled = tex.isReady;
                        
                        GUILayout.BeginHorizontal();
                        if (GUILayout.Button("Play"))    //播放按钮
                                    tex.Play();
                        if (GUILayout.Button("Pause"))    //暂停按钮
                                    tex.Pause();
                        tex.loop = GUILayout.Toggle(tex.loop, "Loop");    //是否循环
                        GUILayout.EndHorizontal();
 
                        var oldT = tex.time;
                        var newT = GUILayout.HorizontalSlider (tex.time, 0.0f, tex.duration);
                        if (!Mathf.Approximately(oldT, newT))
                                    tex.Seek(newT);
 
                        GUI.enabled = true;
            }

这个方法只能打包成WebGL才能测试，大家可以根据实际需求修改代码。

4、弹框报错问题。

在最后发布出来之后我发现页面经常会报弹框报错，而点击确定后又不影响运行，代码也不报错，一开始不知道该如何解决，后来就想了一下强制关闭的方法，打包成WebGL后，在Build文件夹里会看到一个UnityLoader的文件
在这里插入图片描述打开UnityLoader，可以用这个软件打开

找到弹框信息对应的代码出，把代码注释掉就不会再报错了，当然不是所有的弹框报错都这么做，首先先排除不是Unity和JS代码方面的原因。

找到console开头的就是弹出框的信息，找到对应的注释掉就可以了。