uniapp(h5 app) 中 webview和h5通信

1 uniapph5 和h5页面 通信

h5

window.parent.postMessage(message, '*');

uniapph5 onload中

window.addEventListener('message', function (e) {

// 监听 message 事件

//console.log(e.origin)

console.log('收到的cocos游戏ID',e.data)

//收到cocos退出游戏返回的指令

if(e.data){

uni.navigateTo({

url:`/pages/salason/salason?id=${e.data}`

})

}

})

2 uniapp app 中 和h5通信

h5 index.html中 引入<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js">

uni.webView.postMessage({ data: { } }) 发送

uniapp app 中

<web-view :src="tlink" @message="getmessage"></web-view>

//app端接收数据

const getmessage = (e) => {

console.log('uniapp接收的数据', e.detail.data[0].name)

if(e.detail.data[0].name){

uni.navigateTo({

url:`/pages/salason/salason?id=${e.detail.data[0].name}`

})

}

}

相关推荐
web1508509664115 小时前
在uniapp Vue3版本中如何解决webH5网页浏览器跨域的问题
前端·uni-app
何极光1 天前
uniapp小程序样式穿透
前端·小程序·uni-app
User_undefined2 天前
uniapp Native.js 调用安卓arr原生service
android·javascript·uni-app
流氓也是种气质 _Cookie2 天前
uniapp blob格式转换为video .mp4文件使用ffmpeg工具
ffmpeg·uni-app
爱笑的眼睛112 天前
uniapp 极速上手鸿蒙开发
华为·uni-app·harmonyos
鱼樱前端2 天前
uni-app框架核心/常用API梳理一(数据缓存)
前端·uni-app
阿琳a_2 天前
解决uniapp中使用axios在真机和模拟器下请求报错问题
前端·javascript·uni-app
三天不学习2 天前
uni-app 跨端开发精美开源UI框架推荐
ui·uni-app·开源
多客软件佳佳2 天前
便捷的线上游戏陪玩、线下家政预约以及语音陪聊服务怎么做?系统代码解析
前端·游戏·小程序·前端框架·uni-app·交友
洗发水很好用3 天前
uniApp上传文件踩坑日记
uni-app