h5和小程序通信

相信大部分人可能都会遇到要在微信小程序里面嵌入h5,这个时候h5和小程序之间的通信就成了不可避免的一环,不用紧张,其实很简单。

看一下微信小程序官方文档怎么说

首先我们按照文档上的指示,在需要向小程序传递参数的页面引入 jweixin-1.3.2.js

html 复制代码
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

接下来在需要传参的js里面直接使用

javascript 复制代码
if (res.data === 200) {
    wx.miniProgram.postMessage({ data: { message: '200Hello from H5' } });
} else{
    wx.miniProgram.postMessage({ data: { message: 'Hello from H5' } });
}

最后在小程序的 handleGetMessage 方法里面接收就好啦

javascript 复制代码
  // 接收从h5传递过来的数据
  handleGetMessage: function(e) {
    console.log('查看h5传递过来的数据:',e.target.data)
  },

看,成功接收到啦

相关推荐
优雅的大白鹅8 小时前
创建uniapp小程序
小程序·uni-app
liangdabiao10 小时前
开源AI拼豆大升级 - 一键部署cloudflare page - 全免费 web和小程序
前端·人工智能·小程序
px不是xp11 小时前
DeepSeek API集成:让小程序拥有AI大脑
javascript·人工智能·小程序
小汪说干货12 小时前
2026年4月最新|公众号文章插入文档附件3种技术方案
javascript·小程序
小汪说干货18 小时前
2026年4月优化版|公众号文档格式附件插入3种方案(推荐“附链”小程序)
小程序·微信公众平台
万岳科技系统开发1 天前
商城系统搭建自建平台与入驻第三方平台对比分析
数据库·小程序·架构
double_eggm2 天前
微信小程序3
微信小程序·小程序
杰建云1672 天前
小程序如何提升留存?
小程序·小程序制作
PinTrust SSL证书2 天前
Geotrust企业型OV通配符SSL
网络协议·网络安全·小程序·https·云计算·ssl
怀君2 天前
Uniapp——微信小程序Canvas层级过高问题解决
微信小程序·小程序·uni-app