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)
  },

看,成功接收到啦

相关推荐
wuyoula16 小时前
全新多平台电商代付商城源码
开发语言·c++·ui·小程序·php源码
低代码布道师16 小时前
微搭低代码MBA 培训管理系统实战 36——小程序端课程预约功能实现
低代码·小程序
万岳科技系统开发16 小时前
小程序直播架构调整指南:H5嵌套模式的优化与替代方案
小程序·架构
Greg_Zhong18 小时前
学习AI 工程师第 3 天:小程序中调用豆包模型,实现ai助手(打字机效果与流式输出)
小程序·ai工程师·小程序调用豆包实现ai助手
于先生吖18 小时前
家政派单小程序定制厂家
大数据·小程序
00后程序员张19 小时前
完整指南 iOS App上架到App Store的步骤详解
macos·ios·小程序·uni-app·objective-c·cocoa·iphone
久爱@勿忘20 小时前
uniappH5跳转小程序
前端·小程序·uni-app
文慧的科技江湖2 天前
光储充一体化开源能源管理系统 需求说明书(简单版) - 慧知开源充电桩平台
小程序·开源·能源·光储充·光伏系统·实现光储充全设备统一监控·光储充一体化开源能源管理系统
eric*16882 天前
Mac反编译小程序教程
小程序·小程序反编译
打瞌睡的朱尤2 天前
微信小程序50~75
微信小程序·小程序