探秘小程序(10):分享功能+webview
场景:
小程序页面用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回调方法中可能会拿不到值哦~~~~
探秘小程序(10):分享功能+webview的更多相关文章
- 微信小程序之分享功能
说到分享 大家都会想到手机右上角点击不就分享了么?对的没错,那样是分享转发的是小程序 而不是指定的某个页面,所以自己动手丰衣足食,自己写一个转发功能被, 其实也没那么可怕,主要参考的是微信小程序AP ...
- 微信小程序---转发分享功能
1. 转发---onShareAppMessage 2.不带参数 //用户点击右上角分享 onShareAppMessage: function (res) { return { title: 'xx ...
- 微信小程序的分享功能-css文字超过两行隐藏
.info{ width:100px; word-break:break-all; display:-webkit-box; -webkit-box-orient:vertical; -webkit- ...
- 微信小程序绘制分享图
微信小程序绘制分享图例子: demo下载地址:https://gitee.com/v-Xie/wxCanvasShar 大致代码会再以下说明 实际开发项目: 基础知识点: 了解canvas基础知识 w ...
- 微信小程序之内嵌网页(webview)
设置权限 要在小程序中访问外部网页,需要先设置允许访问的业务网站的域名.让我们先登录小程序平台管理后台页面,进入“设置” => "开发设置",可以看到这边多出来了一块“业务域 ...
- 微信小程序在线支付功能使用总结
最近需要在微信小程序中用到在线支付功能,于是看了一下官方的文档,发现要在小程序里实现微信支付还是很方便的,如果你以前开发过服务号下的微信支付,那么你会发现其实小程序里的微信支付和服务号里的开发过程如出 ...
- 微信小程序与内嵌webview之间来回跳转的几点总结,以及二维码的使用
截止到发稿小程序支持的功能,后续如果小程序更新在完善文稿. 1. 小程序可以内嵌组件跳转到h5页面,前提是在小程序后台配置相应的业务域名.新打开的h5页面会替代小程序组件内的其它组件,即为h5不能与小 ...
- [小程序开发] 微信小程序内嵌网页web-view开发教程
为了便于开发者灵活配置小程序,微信小程序开放了内嵌网页能力.这意味着小程序的内容不再局限于pages和large,我们可以借助内嵌网页丰富小程序的内容.下面附上详细的开发教程(含视频操作以及注意事项) ...
- 微信小程序调用蓝牙功能控制车位锁
第一次学用微信小程序,项目需要,被逼着研究了一下,功能是调用微信小程序的蓝牙功能,连接上智能车位锁,控制升降,大概步骤及调用的小程序接口API如下: 1.打开蓝牙模块 wx.openBluetooth ...
随机推荐
- left join on 和where中条件的放置位置
转自:http://blog.csdn.net/muxiaoshan/article/details/7617533 select * from td left join (select case_ ...
- python闭包的详细解析
一.什么是闭包? 如果一个内嵌函数访问外部嵌套函数作用域的变量,并返回这个函数,则这个函数就是闭包 闭包必须满足三个条件: 1. 必须有一个内嵌函数 2. 内嵌函数必须引用外部嵌套函数中的变量 ...
- OpenCV库框架结构
在上文已经学习过了opencv的编码规则,为了能够方便灵活的运用OPECV库,我们需要对其框架结构进行学习了解,以方便我们进行实际工程调用调用. 1.Opnecv库到底提供了什么? 打开opencv源 ...
- SOPC与 hello world
本次设计实验源码位于:http://download.csdn.net/detail/noticeable/9922865 实验目的:通过系统的搭建进一步了解FPGA的SOPC开发流程,并借此了姐pl ...
- spring redis @Cacheable注解使用部分错误及无效原因
spring redis @Cacheable注解使用部分错误及无效原因 说明: spring项目用到redis注解无效,解决问题中遇到一堆BUG,各种搜索,看了许多错误解决方案一一测试,对于 ...
- 深圳scala-meetup-20180902(3)- Using heterogeneous Monads in for-comprehension with Monad Transformer
scala中的Option类型是个很好用的数据结构,用None来替代java的null可以大大降低代码的复杂性,它还是一个更容易解释的状态表达形式,比如在读取数据时我们用Some(Row)来代表读取的 ...
- Java代码审计入门篇
作者:i春秋核心白帽yanzmi 原文来自:https://bbs.ichunqiu.com/thread-42149-1-1.html 本期斗哥带来Java代码审计的一些环境和工具准备. Java这 ...
- java中的io系统详解
相关读书笔记.心得文章列表 Java 流在处理上分为字符流和字节流.字符流处理的单元为 2 个字节的 Unicode 字符,分别操作字符.字符数组或字符串,而字节流处理单元为 1 个字节,操作字节和字 ...
- php cli模式和浏览器访问下加载php.ini文件的注意事项[架构篇]
使用wampserver或Xampp时,会将配置文件放在一个统一的目录中去调用,这时如果都使用浏览器访问,自然是没有问题的,但是如果换成cli命令行模式运行,则会出现加载了的扩展无法使用的问题. 案例 ...
- 第五篇: 路由网关(zuul)
在微服务架构中,需要几个基础的服务治理组件,包括服务注册与发现.服务消费.负载均衡.断路器.智能路由.配置管理等,由这几个基础组件相互协作,共同组建了一个简单的微服务系统. 在Spring Cloud ...