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}`

})

}

}

相关推荐
anyup15 小时前
uni-app X 全屏引导页组件,一套支持 App、H5、小程序多端引导
前端·架构·uni-app
织_网2 天前
UniApp 快速集成个推推送(UniPush2.0)完整实战教程
uni-app
星星~笑笑2 天前
vue 超简单 oss分片上传文件 大文件上传阿里云
前端·javascript·vue.js·uni-app
jingling5553 天前
uni-app农场地图——高德 JS API 实现全解析(天地图影像作为layers)
uni-app
2501_916008893 天前
Mac 上生成 AppStoreInfo.plist 文件,App Store 上架
android·macos·ios·小程序·uni-app·iphone·webview
__zRainy__3 天前
uni-app 全局容器实战系列(四):全局容器动态调用设计
uni-app
2501_916007474 天前
iOS开发中抓取HTTPS请求的完整解决方法与步骤详解
android·网络协议·ios·小程序·https·uni-app·iphone
00后程序员张4 天前
Windows 下怎么生成 AppStoreInfo.plist?不依赖 Xcode 的方法
ide·macos·ios·小程序·uni-app·iphone·xcode
__zRainy__4 天前
uni-app 全局容器实战系列(二):Vite 虚拟模块
windows·uni-app
__zRainy__4 天前
uni-app 全局容器实战系列(一):全局容器的实现
uni-app·vite