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

 

unity发消息给前端:

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

unity发布ios16 unity发布webgl_输入框

 

脚本内写入下列代码:

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

unity发布ios16 unity发布webgl_json_02

注意:(1)这里面的方法不要写错,否则会导致unity打包不成功的问题出现。

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

            (3)这里的SendMessage2方法可以使用不传参或单个传参,看自己的需求。

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

unity发布ios16 unity发布webgl_unity发布ios16_03

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”方法的代码

unity发布ios16 unity发布webgl_WebGL_04

 

开发过程中遇到的坑(发布webgl版本后与编辑器运行不一致的坑):

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

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

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

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

5. 开发时unity安装地址和发布后的播放地址都不要存在中文路径