从H5(阿里健康)跳转到支付宝小程序指定页面和接收参数的方法

原创 Uniapp
阅读数: 13673 2020年12月09日

最近有个项目是支付宝小程序,其中需要从阿里健康配置的banner图跳转到指定的小程序页面。在开发调试过程中被对方带歪了,遇到各种坑,总结下正确姿势:

阿里健康其实就是H5,从这里跳转到支付宝小程序就是H5跳转到支付宝小程序,在阿里健康配置的时候需要注意。


可参考此官方文档(其实写的很清楚了):https://opensupport.alipay.com/support/helpcenter/142/201602496413?ant_source=manual&recommend=d6cd07a68fd4161c6573bb7773e91068


URL格式

alipays://platformapi/startapp?appId=[appId]&page=[pagePath]&query=[params]

参数

描述

示例

appId

要跳转的目标小程序appId

20170713077xxxxx

pagePath

要跳转到目标小程序的具体 page 页面,该值等于 app.json 里面的配置值;如果不带 page 字段,默认跳转到小程序首页。

pages/index/index

query

表示从外部 APP 携带的参数透传到目标小程序;如果不需要携带参数给小程序,可以不带该参数。

query:启动参数,内容按照格式为参数名=参数值&参数名=参数值(

注:query携带的启动参数必须进行UrlEncode否则只能获取第一个参数!

xx%3dxx

注意:query 后面的内容必须要经过 urlencode,否则无法接收到。

//例子:跳转到小程序(appid=123456),页面路径 pages/luckdraw/index 并带上来源 comefrom=alipay,后面要跟上阿里健康的数据 code=码&uid=用户ID&sign=验签 
alipays://platformapi/startapp?appId=123456&page=pages/luckdraw/index&query=comefrom%3dalipay%26code%3d%e7%a0%81%26uid%3d%e7%94%a8%e6%88%b7ID%26sign%3d%e9%aa%8c%e7%ad%be

上面方法仅在外部 APP 唤起小程序。


在手机浏览器调试跳转到支付宝小程序

需要借助:https://ds.alipay.com/?scheme=

注意:scheme 后面的参数必须再次经过 urlencode,否则跳转不到指定小程序页面。

上面例子转换成:

//加入域名,在手机浏览器调试 https://ds.alipay.com/?scheme=alipays%3a%2f%2fplatformapi%2fstartapp%3fappId%3d123456%26page%3dpages%2fluckdraw%2findex%26query%3dcomefrom%253dalipay%2526code%253d%25e7%25a0%2581%2526uid%253d%25e7%2594%25a8%25e6%2588%25b7ID%2526sign%253d%25e9%25aa%258c%25e7%25ad%25be

总结:

1、alipays:// 里面的 query 参数必须经过 urlencode 变成一个独立的值才能保护里面的值不会丢失。

2、https://ds.alipay.com/?scheme= 后面的也必须经过 urlecndoe 变成一个独立的值保护里面的值不丢失。


如何接收值

我只在 onLaunch 获取到了参数,onShow 没有获得参数。

页面 pages/luckdraw/index 代码如下(uni-app 代码):

//直接在页面获取 启动参数,避免本地存储后在获取。
 let lanuchOptions = my.getLaunchOptionsSync();

如何获取启动参数,官方文档:https://opensupport.alipay.com/support/helpcenter/142/201602630793?ant_source=antsupport


总结阿里健康 banner 活动处理逻辑,个人猜想:

因为配置的时候,必须配置:

alipays://platformapi/startapp?appId=123456&page=pages/luckdraw/index&query=comefrom%3dalipay


其中 comefrom%3dalipay 是我们自定义参数,在阿里健康页面点击后会在后面带上经过 urlencode 的 uid、code、sign,最终带入我们指定的 pages/luckdraw/index 页面;


phpriji.cn | 网站地图 | 沪ICP备17015433号-1