1.unity部分

在assets目录的Plugins文件夹新建一个文档文字随便命名,后缀名改为xxxx.jslib

在里面写入这样一段代码

mergeInto(LibraryManager.library, {
    SendMsgToVue: function (msg) {
        TestSend(Pointer_stringify(msg)) //新的unity版本Pointer_stringify,改为UTF8ToString
        console.log("SendMsgToVue msg=="+msg)
    },
 
    ReportReady: function () {
        window.ReportReady()
    },
})

SendMsgToVue这是需要在unity里面调用的,用来unity给vue发送消息

TestSend需要在打包生成webgl后在index.html里面调用的

然后,在unity新建一个脚本文件

2.vue部分

以下是unity打包成webgl后生成的index.html

 红色框部分是我后面根据需要加进去的,其它是打包生成的代码

打包之后的目录结构为

 根据需要可放在public目录下,例如

 然后在vue代码里面引入index.html

<iframe ref="unityIframe" src="/unity3D/index.html" frameborder="0"></iframe>

在mounted()里面监听

window.addEventListener('message', this.unityWatch)

unityWatch(e) {
    console.log('unityWatch方法调用 e==' + e.data.guid + '    event=' + e.data.event)
  if (e.data.event == 'ReportReady') {

  }
  if (e.data.guid != null&& e.data.event == 'guid') {

  }
  if (e.data.event == 'modelLoadingFinish') {

  }
},

unityWatch这方法里面监听来自unity发送过来的消息

最后vue里面调用

this.$refs.unityIframe.contentWindow.VueSendToUnity(data)

向unity发送消息。VueSendToUnity方法是我自己定义的,此方法先得在index.html里面定义好,才能调用。

以下是unity脚本接收的函数,SetGuid对应之前在index.html里面定义好的

注意:

unity打包成webgl时得注意下设置,设置不对可能会报以下错误

unity的设置请参考以下

demo下载链接:

https://download.csdn.net/download/qq_29194615/85214479

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐