使用 wx.miniProgram.postMessage 传递网站数据来分享网站程序页面
在小程序里使用web-view组件,在对小程序点击顶部分享按钮分享时,分享的内容为当前页面的内容,需要使用wx.miniProgram.postMessage来进行处理
H5页面代码
created() {
this.$store
.dispatch({
type: "user/saveCurrentUrl",
data: {
current_url: window.location.pathname + window.location.search,
page_type: "3"
}
})
.then(res => {
if (res.code == 1) {
window.wx.miniProgram.postMessage({
data: {
title: res.data.title, // 标题
desc: "", // 描述
imgUrl: "", // 图片
link: res.data.url, // 链接
unique_mark: res.data.unique_mark
}
});
}
});
let id = this.$route.params.id;
let activityId = this.$route.query.activityId;
this.getActivityProductDetail(id, activityId);
}
小程序端代码
<web-view src='{{weburl}}' bindmessage="getSharePage"></web-view>
onShareAppMessage: function() {
let _this = this;
let title = "发现一件好物";
if (app.globalData.shopname) {
title = app.globalData.shopname;
}
console.log(this.data.sharePageModel);
let path = "pages/index/index";
if (this.data.sharePageModel) {
path += "?share_openid=" + app.globalData.openid + "&unique_mark=" + this.data.sharePageModel.unique_mark;
title = this.data.sharePageModel.title;
} return {
title: title,
path: path,
success: _suc => {
wx.showToast({
title: '分享成功',
})
},
fail: _fail => {
wx.showToast({
title: '分享失败',
})
}
};
},
getSharePage: function(e) {
console.log("获取网页内容");
console.log(e);
if (e && e.detail && e.detail.data) {
let len = e.detail.data.length;
this.setData({
sharePageModel: e.detail.data[len - 1]
});
} },
调试截图
注意点:wx.miniProgram.postMessage该方法的使用有条件,小程序分享、销毁等都会执行,H5页面每执行一次,会在小程序端记录一条数据(数组形式),我目前做的是用户分享时取的是数组下标最大的,但是也存在一个缺陷,当H5页面未设置分享参数,而用户点击了顶部分享操作,分享数据将取最后一条,目前还在处理中(每个H5页面加上分享postMessage感觉不现实),求招...
使用 wx.miniProgram.postMessage 传递网站数据来分享网站程序页面的更多相关文章
- 微信小程序的坑之wx.miniProgram.postMessage
工作中有个需求是小程序的网页在关闭的时候,需要回传给小程序一个参数 查阅小程序官方文档,有这样一个接口 wx.miniProgram.postMessage ,可以用来从网页向小程序发送消息,然后通过 ...
- 小程序web-view wx.miniProgram.postMessage 坑记录
web-view吧,其实微信官方应该是非常不支持在小程序上嵌套web的,它希望你直接用小程序上的代码,而放弃web的实现,当然,也是为了防止用小程序去嵌套别的广告页面.所以官方对web-view的操作 ...
- 在微信小程序页面间传递数据总结
在微信小程序页面间传递数据 原文链接:https://www.jianshu.com/p/dae1bac5fc75 在开发微信小程序过程之中,遇到这么一些需要在微信小程序页面之间进行数据的传递的情况, ...
- Android 使用剪贴板传递简单数据及复杂数据的方法
传递数据的场景在于不同页面之间跳转,需要携带数据:简单数据值指的是String, int等数据, 复杂数据指的是类 1. 使用剪贴板传递简单数据方法: 第一个页面里面放数据操作如下: Clipbo ...
- H5中用postMessage传递数据,解决localStorage不能跨域问题
localStorage不能跨域,所以在A域名下用localStorage.YourKey方式存储的值,在B域名下是不能取到的. 所以需要转变思路,目前主要使用的两种方式: 一种方式:在A.B两个页面 ...
- MFC用PostMessage传递消息
1.自定义消息ID. #define WM_MY_MESSAGE (WM_USER+100) WM_USER为windows系统为非系统消息保留的ID,这里至少要用100,因为其它控件 ...
- Ajax(form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传)
form表单文件上传 上菜 file_put.html <form action="" method="post" enctype="multi ...
- 小程序跨页面传递data数据的三种方法
Q:小程序怎么把页面data里的数据传到另外的页面? 或者小程序怎么吧表单里的数据传到另外的页面?A:1.可以使用url传递数据. 例如在A页面中传递数据,需要注意的是,wx.switchTab中的u ...
- android 多个notifycation向同一个Actiivity传递不同数据
如果你有这方面的需求,那你实践的时候可能会发现,多个Notifycation点击的时候会传递相同的数据. 通常情况下我们可能这样写. Notification notification = new N ...
随机推荐
- 【Gradle】Gradle任务
Gradle任务 多种方式创建任务 1.直接以一个任务名字创建一个任务的方式: def Task task1 = task(task1) task1.doLast{ println 'task1' } ...
- SQL高效运行注意事项(四)
为了SQLSERVER能高效运行,SQLSERVER的磁盘子系统是一个重要的方面 Avg. Disk Sec/Read 这个计数器是指每秒从磁盘读取数据的平均值 下面的列表显示这个计数器值的范围,并指 ...
- 3-SQL过滤
# 筛选最大生命值大于6000,最大法力值大1700的英雄,然后按照二者之和从高到低进行排序 SELECT NAME , hp_max, mp_max FROM he ...
- [Linux]线程分离状态的理解
在任何一个时间点上,线程是可结合的(joinable),或者是分离的(detached).一个可结合的线程能够被其他线程收回其资源和杀死:在被其他线程回收之前,它的存储器资源(如栈)是不释放的.相反, ...
- 算法问题实战策略 NTHLON
地址 https://algospot.com/judge/problem/read/NTHLON #include <iostream> #include <vector> ...
- 漫长的 windows caffe编译过程 (OnlyCpu)
在windows下 编译caffe代码. 官方推荐是vs2013 而我手头只有VS2017 .准备开始下载代码开始编译. 1 代码下载 windows版本的代码有两份,一份是官方的编译的windows ...
- 【转】bootstrap table轻松实现数据表格
在使用bootstrap table时可能在很多时候回用的表格来显示数据,如果自己写那肯定没问题,但是数据展示出来就麻烦多了,然而bootstrap table 封装了一套完善的数据表格组件,把从后台 ...
- mysql深入学习(一)
Mysql高级学习 一.Mysql简介 1.概述 MySQL是一个关系型数据库管理系统,由瑞典MySQL AB公司开发,目前属于Oracle公司. MySQL是一种关联数据库管理系统,将数据保存在不同 ...
- MVC、MTV、FBV、CBV、母版和继承:
cookie session cookie的定义: 保存在浏览器上的一组组键值对 (请求头) 为什么要有? http协议是无状态,每次的请求之间是相互独立的,没有办法保存状态. Django中操作co ...
- A1071 Speech Patterns (25 分)
一.技术总结 开始拿到这道题目时,思考的是我该如何区分它们每一个单词,不知道这里还是要学习得知在cctype头文件中有一个函数用于查看是否为0~9.a~z.A~Z,就是isalnum(),又因为题目中 ...