unity发布WebGL版本与前端交互

由unity官方给该的方法亲测无法成功传参，故亲手写一篇相关教程，开发中实测下列方式可用。

unity发消息给前端：

1. 首先在unity的Plugins文件夹下创建一个后缀为.jslib（例：WebGL.jslib，名称随便起，只要位置放对，unity就能检测到。）的脚本。

脚本内写入下列代码：

mergeInto(LibraryManager.library, {
SendMessage2: function (str,jsonData) {
ReactUnityWebGL.SendMessage(Pointer_stringify(str),Pointer_stringify(jsonData));
//这里使用通过方法发送给前端消息
//console.log("SendMsgToVue msg:"+str);
}
});

注意：（1）这里面的方法不要写错，否则会导致unity打包不成功的问题出现。

           （2）一定要带Pointer_stringify方法，否则会导致前端接收到的数据是一个随机的数字。

            （3）这里的SendMessage2方法可以使用不传参或单个传参，看自己的需求。

2. 在unity的一个全局脚本中写下引用代码，方便后续代码调用。

3. 在前端框架页面上监听方法

<script>
var unityInstance = UnityLoader.instantiate("unityContainer", "Build/WebGL.json", {onProgress: UnityProgress});
function SendMessage2(str) {
// alert("传出来了")
// alert(str)
window.parent.postMessage({ handle: str }, '*'
)
}
</script>

前端发消息给unity：

 简单说就是使用unityInstance发消息就行了。具体方法定义如下：

1. 前端网页代码：
unityInstance.SendMessage(objectName, methodName, value);

其中的参数objectName是Unity场景列表中的物体的名字，这里注意要保证场景中只有一个叫这个名字的物体，别出现重名的，否则乱套了。methodName是发消息的方法名，value是方法的参数，这个参数可以没有，有的话可以是整数或者字符串。

具体使用方式参考如下：

unityInstance.SendMessage('UnityToWebMsg', 'MyFunction'); 
unityInstance.SendMessage('UnityToWebMsg', 'MyFunction', 5); 
unityInstance.SendMessage('UnityToWebMsg', 'MyFunction', 'MyString');

2. unity接收前端的消息：

（1）创建一个叫“UnityToWebMsg”的物体，保证其在整个生命周期都存在，方便随时接受前端的消息，这里建议用单例写。并在该物体上挂在单例脚本。

（2）在脚本上写一个叫“MyFunction”方法的代码

开发过程中遇到的坑（发布webgl版本后与编辑器运行不一致的坑）：

1. 在编辑器下解析正常的json数据出现解析失败的问题。暂时没有发现问题处在哪里

2. 给到前端去用，他们发布后发现本地文件路径无法访问（ Application.streamingAssetsPath）。

3. 发布webgl版本后出现后端接口访问受限问题，这个要后台接口方发布公网地址。

4. 模型加载成功后会影响到前端输入框的正常输入，此时让前端在输入框后面多加几个Image来做遮挡。