架构师_程序员_码农网

 找回密码
 注册[Register]

QQ登录

只需一步,快速开始

搜索
查看: 426|回复: 1

微信小程序分享 WebView 内 H5 页面

[复制链接]
发表于 2025-2-20 08:52:38 | 显示全部楼层 |阅读模式
需求:微信小程序内使用 WebView 嵌套了 H5 页面,需要点击分享给朋友或者朋友圈的时候,用户点击分享的卡片进入展示 H5 页面。

首先,先看下分享到聊天的效果图:

QQ截图20250220083123.jpg

原理:H5 页面向小程序发送消息,小程序点击分享读取该消息,如下图:

bindmessage        eventhandler                否        网页向小程序 postMessage 时,会在以下特定时机触发并收到消息:小程序后退、组件销毁、分享、复制链接(2.31.1)。e.detail = { data },data是多次 postMessage 的参数组成的数组。

wx.miniProgram.postMessage        向小程序发送消息,会在以下特定时机触发组件的message事件:小程序后退、组件销毁、分享、复制链接(2.31.1)

QQ截图20250220083910.jpg

web-view:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

H5 页面

H5 页面使用 postMessage 向小程序发送消息,代码如下:

微信小程序

代码如下:

备注:分享出去的是还是小程序页面路径,只是要在路径上面带上 h5 页面的参数链接。

onShareAppMessage:用于分享给好友或群聊时的配置。
onShareTimeline:用于分享到朋友圈时的配置。

操作步骤

操作步骤如下图:

QQ截图20250220084758.jpg QQ截图20250220085034.jpg QQ截图20250220085115.jpg




上一篇:.NET/C# 使用 HttpClient 常用请求技巧方法
下一篇:RMSE、MSE、MAE、SD 简单介绍
码农网,只发表在实践过程中,遇到的技术难题,不误导他人。
 楼主| 发表于 2025-2-20 09:01:22 | 显示全部楼层
码农网,只发表在实践过程中,遇到的技术难题,不误导他人。
您需要登录后才可以回帖 登录 | 注册[Register]

本版积分规则

免责声明:
码农网所发布的一切软件、编程资料或者文章仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。如有侵权请邮件与我们联系处理。

Mail To:help@itsvse.com

QQ|手机版|小黑屋|架构师 ( 鲁ICP备14021824号-2 )|网站地图

GMT+8, 2025-4-20 08:56

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表