vue页面嵌入unity,通过iframe通信问题

rustum

第一步


在public文件夹下新建unity文件夹，用于存放unity工程师打包好的web文件

image.png

第二步


在vue项目app.vue文件中通过iframe引入unity文件夹下的index.html文件（）

image.png

第三步（接收untiy数据）


找到unity文件夹下的index.html，将unity工程师提供的通信方法加工（）

image.png

regionName为unity需要传入js的数据，vue中通过在mounted中使用监听

image.png

image.png

image.png

第四步（向untiy传入数据）


根据需求传入数据，我这边是需要初始化传入指定数据，用于展示，通过)传入
并且需要在unity加载完成之后（onload）才传输数据

image.png

unity文件夹下的index.html通过监听

image.png

image.png

完整代码：


unity——index.html

image.png

vue——app.vue

image.png