场景:

小程序页面用webview嵌入了h5页面,h5页面需要与小程序进行交互,h5页面内容不同,分享的链接也不一样

分享功能:

小程序的分享功能即用户点击小程序右上角,转发功能页面。可以指定分享卡片的标题,分享的图片,以及用户点击分享卡面的后跳转的地址demo如下所示:

Page({

   onShareAppMessage: function (res) {

     if (res.from === 'button') { // 来自页面内转发按钮

       console.log(res.target)

     } 

    return {

       title: '自定义转发标题', path: '/page/user?id=123'

     }

   }

})
下面重点来了,踩过的坑了解一下:
onShareAppMessage,方法必须包含return,并且return 有效,何时无效呢?如果将return包裹在setTimeout这样的异步函数中便无效。

②return中path,必须是小程序的页面路径

③path中如果包含了其他参数,而参数中又包含了url链接,需要进行encodeURIComponent/decodeURLComponent进行编码解码操作

④webview想小程序发送消息时,

  通过h5页面 通过jssdk的postmessage发送数据:wx.miniProgram.postMessage({ data: 'foo' }),必须有data!!!!!!!

  小程序通过bindmessage="XXX"进行获取数据:回调函数xxx中,通过e.detail.data拿到数据、

⑤:postmessage在分享、推出页面或者巴拉巴拉的场景下才会执行,那执行的顺序如何呢?猜的没错是postmessage先执行然后onshareAppMessage方法后执行。可是如果在postmessage中使用setData等异步方法进行赋值操作,share回调方法中可能会拿不到值哦~~~~

  1.  

探秘小程序(10):分享功能+webview的更多相关文章

  1. 微信小程序之分享功能

    说到分享 大家都会想到手机右上角点击不就分享了么?对的没错,那样是分享转发的是小程序  而不是指定的某个页面,所以自己动手丰衣足食,自己写一个转发功能被, 其实也没那么可怕,主要参考的是微信小程序AP ...

  2. 微信小程序---转发分享功能

    1. 转发---onShareAppMessage 2.不带参数 //用户点击右上角分享 onShareAppMessage: function (res) { return { title: 'xx ...

  3. 微信小程序的分享功能-css文字超过两行隐藏

    .info{ width:100px; word-break:break-all; display:-webkit-box; -webkit-box-orient:vertical; -webkit- ...

  4. 微信小程序绘制分享图

    微信小程序绘制分享图例子: demo下载地址:https://gitee.com/v-Xie/wxCanvasShar 大致代码会再以下说明 实际开发项目: 基础知识点: 了解canvas基础知识 w ...

  5. 微信小程序之内嵌网页(webview)

    设置权限 要在小程序中访问外部网页,需要先设置允许访问的业务网站的域名.让我们先登录小程序平台管理后台页面,进入“设置” => "开发设置",可以看到这边多出来了一块“业务域 ...

  6. 微信小程序在线支付功能使用总结

    最近需要在微信小程序中用到在线支付功能,于是看了一下官方的文档,发现要在小程序里实现微信支付还是很方便的,如果你以前开发过服务号下的微信支付,那么你会发现其实小程序里的微信支付和服务号里的开发过程如出 ...

  7. 微信小程序与内嵌webview之间来回跳转的几点总结,以及二维码的使用

    截止到发稿小程序支持的功能,后续如果小程序更新在完善文稿. 1. 小程序可以内嵌组件跳转到h5页面,前提是在小程序后台配置相应的业务域名.新打开的h5页面会替代小程序组件内的其它组件,即为h5不能与小 ...

  8. [小程序开发] 微信小程序内嵌网页web-view开发教程

    为了便于开发者灵活配置小程序,微信小程序开放了内嵌网页能力.这意味着小程序的内容不再局限于pages和large,我们可以借助内嵌网页丰富小程序的内容.下面附上详细的开发教程(含视频操作以及注意事项) ...

  9. 微信小程序调用蓝牙功能控制车位锁

    第一次学用微信小程序,项目需要,被逼着研究了一下,功能是调用微信小程序的蓝牙功能,连接上智能车位锁,控制升降,大概步骤及调用的小程序接口API如下: 1.打开蓝牙模块 wx.openBluetooth ...

随机推荐

  1. tomcat 配置 使用 HTTPS

    1.生成证书 keytool -genkeypair -alias "tomcat" -keyalg "RSA" -keystore "d:\temp ...

  2. Codeforces791 B. Bear and Friendship Condition

    B. Bear and Friendship Condition time limit per test 1 second memory limit per test 256 megabytes in ...

  3. [转]kaldi中的特征提取

    转:http://blog.csdn.net/wbgxx333/article/details/25778483 本翻译原文http://kaldi.sourceforge.net/feat.html ...

  4. 【spring源码分析】IOC容器初始化——查漏补缺(一)

    前言:在[spring源码分析]IOC容器初始化(十一)中提到了初始化bean的三个步骤: 激活Aware方法. 后置处理器应用(before/after). 激活自定义的init方法. 这里我们就来 ...

  5. 谷歌浏览器怎么FQ(一)(想使用谷歌浏览器应用商城的小伙伴这边看)

    谷歌浏览器的应用商城里本身有很多不错的扩展程序和插件,比如Wappalyzer(能够识别某个网站用的什么框架和库)广告终结者(能屏蔽大部分浮动,弹窗,甚至视频广告)等 但是谷歌因为某些原因需要FQ以后 ...

  6. Servlet案例5:用户登录失败信息回显

    登录失败信息回显不会的新的一个页面,而是显示在登录页面 一种方法是: 登录页面表单中每个字段后添加<span>标签写入失败信息,利用ajax技术 通过改变<span>标签的di ...

  7. OpenStack-Ocata版+CentOS7.6 云平台环境搭建 — 1.操作系统环境配置

    1.OpenStack示例的架构介绍 1.1 各节点介绍 (1)控制节点(controller)控制节点(controller)上运行身份服务,镜像服务,计算节点管理,网络管理,各种网络代理和仪表板. ...

  8. python中使用双端队列解决回文问题

    双端队列:英文名字:deque (全名double-ended queue)是一种具有队列和栈性质的抽象数据类型. 双端队列中的元素可以从两端弹出,插入和删除操作限定在队列的两边进行. 双端队列可以在 ...

  9. Maven - 实例-4-依赖传递

    这里以Eclipse创建Maven工程来演示. Setp-1 创建Maven项目 File ---> New ---> Maven Project ---> 默认勾选"Us ...

  10. 排序算法系列:快速排序算法JAVA版(靠谱、清晰、真实、可用、不罗嗦版)

    在网上搜索算法的博客,发现一个比较悲剧的现象非常普遍: 原理讲不清,混乱 啰嗦 图和文对不上 不可用,甚至代码还出错 为了不误人子弟耽误时间,推荐看一些靠谱的资源,如[啊哈!算法]系列: https: ...