小程序中嵌套的h5页面设置分享转发
场景描述:当在小程序中打开h5页面时,希望小程序的转发出去的标题,图片,跳转link可以通过h5通信实现自定义。
实现方式:通过h5给小程序通信,发送标题,图片,跳转link等信息,让小程序设置分享。
- h5发送给小程序通信代码
引用微信js1.3.2以上才支持,<script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
判断h5是在小程序环境中打开代码://判断是否是小程序环境
function doMiniProgram(callback) {
try {
//小程序环境设置分享
var ua = window.navigator.userAgent.toLowerCase();
//判断是否是微信环境
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
//微信环境
wx.miniProgram.getEnv(function (res) {
if (res.miniprogram) {
callback();
}
})
}
}
catch (ex) {
console.log(ex);
}
}给小程序发送数据设置小程序分享:
//设置小程序分享
function setMiniProgramShare(shareTitle, imageUrl, shareUrl) {
try {
doMiniProgram(function () {
// 小程序环境下逻辑
wx.miniProgram.postMessage({ data: { title: shareTitle, path: shareUrl, imageUrl: imageUrl } })
});
}
catch (ex) {
console.log(ex);
}
} - 小程序接收&处理逻辑
h5页面: <web-view src="{{url}}" bindmessage="message"/>
js逻辑:Page({
data: {shareData:{}},
onShareAppMessage(options) {
return this.shareData
},
message (e) {
var that = this
console.log(e)
that.shareData = e.detail.data[0]
}
})
小程序中嵌套的h5页面设置分享转发的更多相关文章
- 高大上的微信小程序中渲染html内容—技术分享
大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题.但是,在微信小程序(下文简称为「小程序」)中,应当如何渲染这部分内容呢? 解决方案 wxP ...
- 小程序中页面兼容h5标签的解析
有时候当小程序向后台拿数据是一篇html标签的文章时,把它放进小程序会发现很多标签就不兼容,如果要一个个改又很麻烦,有没有方法可以很快地兼容html标签呢? 有个工具可以做到:wxParse 下载了它 ...
- 小程序中使用、H5、uniapp下使用阿里巴巴iconfront图标或者新增图标
第一步:登录iconfont的账号,创建项目. 第二步:选择自己需要的图标,并添加入库(就是那个购物车的图标). 第三步:将选好的图片添加到项目.(点击上图中右上角的购物车图标). 第四步:下载资源到 ...
- 一招解决微信小程序中的H5缓存问题
一招解决微信小程序中的H5缓存问题1.问题描述开发过程中,为了更新代码方便,往往会在小程序中嵌入H5页面.但问题来了,小程序原生代码更新版本后,简单的从微信中删除或者代码强刷就可以解决缓存问题,但小程 ...
- 小程序中的web-view与h5网页之间的交互
官方文档:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html web-view 基础库 1.6.4 开始支 ...
- 微信小程序中使用 <web-view> 内嵌 H5 时,登录问题的处理方法
在微信小程序的开发中,经常遇到需要使用 <web-view></web-view> 内嵌 H5 的需求.在这种需求中比较棘手的问题应该就是登录状态的判断了,小程序中的登录状态怎 ...
- 小程序中搜索文件,阅览pdf,分享文件链接,评论表情符号
小程序中搜索文件,阅览pdf,分享文件链接,评论表情符号 https://blog.csdn.net/hotqin888/article/details/84111389 小程序中打开网页和pdf h ...
- H5本地存储技术和微信小程序中的本地存储
1.H5的本地存储 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- WePY 在手机充值小程序中的应用与实践
wepyjs 发布了两个月了,中间经历了很多版本更新,也慢慢开始有一些用户选择 wepyjs 作为开发框架来开发小程序,比如一些线上小程序. 以及一些来自网上的 wepyjs 的相关资源: demo源 ...
随机推荐
- 浅谈Vue.js2.0某些概念
Vue.js2.0是一套构建用户界面的渐进式框架,目标是实现数据驱动和组件系统. A 渐进式框架 Vue.js是一个提供MVVM数据双向绑定的库,只专注于UI层面,这是它的核心.它本身没有解决SP ...
- org.w3c.dom document 和xml 字符串 互转
转自:https://blog.csdn.net/wmyasw/article/details/8686420 package com.mymhotel.opera; import java.io.F ...
- Mysql8.0.17安装(windows10)
1.因为系统重装 又双叒叕开始了装mysql数据库 下载安装包 https://dev.mysql.com/downloads/mysql/ 2.解压到你想安装的地方 3.解压完是没有图红色框中的文 ...
- postgressql启动与关闭
POSTGRESSQL启动和停止数据库可以通过service方式 .POSTGRESSQL的命令行工具进行启动与停止. 1.使有SERVICE方式 启动数据库服务的命令如下·: #service po ...
- git注册和基本命令
注册账户以及创建仓库 要想使用github第一步当然是注册github账号了.之后就可以创建仓库了(免费用户只能建公共仓库),Create a New Repository,填好名称后Create,之 ...
- ISCC之msc_无法运行的exe
打开hxd,里面老长一串base64 解码试了一下,解出来是png文件头,但是图片有错误 百度了一下,PNG文件头是89 50 4E 47 0D 0A 1A 0A 再回去看 改成0A了事, 出来一张二 ...
- MyBatis-Plus-Generator配置
本文仅对使用MyBatis-Plus的代码生成器配置做保存,适合使用了该插件的童鞋做参考. 内部有大量默认配置,有性趣的童鞋可以研究下源码. ps:官方文档更齐全http://mp.baomidou. ...
- .net System.IO.Stream 流操作类(FileStream等)
Stream 是所有流的抽象基类.流是字节序列的抽象概念. 流涉及到的3个基本操作: 读取流,读取是指从流到数据结构(如字节数组)的数据传输. 写入流,写入是指从数据结构到流的数据传输. 流查找,查找 ...
- ASP.NET MVC 入门11、使用AJAX
asp.net mvc 支持微软自身Ajax 和 JQuery框架 asp.net mvc View视图可以理解为 一个包含"<%%>"变量引和的模板. Script与 ...
- 在idea中编写自动拉取、编译、启动springboot项目的shell脚本
idea 开发环境搭建 idea中安装shell开发插件 服务器具备的条件 已经安装 lsof(用于检查端口占用) 已安装 git 安装 maven 有 java 环境 背景 代码提交到仓库后,需要在 ...