# H5跳转小程序
H5页面跳转小程序进行绑定、授权等功能
注意:相对于客户端打开小程序的限制是,无法通过点击小程序按钮返回app
# 跳转微信小程序
# 场景1 微信外跳转小程序
方案说明: 在微信外浏览器基于scheme模式跳转到微信小程序,其中scheme地址为调用livelink后台接口得到
限制: scheme打开微信小程序有次数限制(微信侧限制每天300万打开次数,QQ侧暂无限制),具体查看接口返回提示
# scheme获取接口
- 接口基础路径
- 测试环境:
https://testapi-open.livelink.qq.com/livelink - 生产环境:
https://s1.livelink.qq.com/livelink
- 接口路由
?c=Sdk&a=GenMiniappScheme&跟上具体的sdkQuery参数
- 接口类型
POST
- body入参
{
"accountType": "wx" // qq或wx,默认wx,跳转微信小程序传入wx
}
2
3
- 接口返回
{
"jData": {
"urlScheme": "xxxxx" // 直接在页面中使用该链接跳转即可
},
"iRet": 0,
"sMsg": "succ"
}
2
3
4
5
6
7
sdkQuery参数: 参照微信小程序query参数
注意:如果返回-1290000错误码,则需兜底方案: 提示用户在微信内打开livelink中转页进行跳转,中转页地址及参数需平台侧拼接后提供给用户
- 示例
请求示例:
curl --location 'https://s1.livelink.qq.com/livelink?c=Sdk&a=GenMiniappScheme&livePlatId=douyin&t=1762915055&code=D65phwLE7dOArpdiR9K75PzFFFlnxP5dv1ThDtgkENE%3D&nickName=%E5%B7%A9%E5%BF%97%E5%BD%AC&faceUrl=https%3A%2F%2Fgame.gtimg.cn%2Fimages%2Fmp%2Flivelink-logo.png&gameIdList=yxzj&actId=14691&sig=5303a154d18d57e38db19d71ca8cedf4' \
--data '{"accountType":"wx"}'
2
返回示例:
{
"iRet": 0,
"sMsg": "ok",
"jData": {
"urlScheme": "weixin://dl/business/?appid=wx707e2eb408780a5b&path=pages/gameAccountBind/index&query=scheme_id%3D50349104715411UJgaKtZuAGllvYtcTNYKoGrNVD"
},
"tid": "229aef5ebc05a6c8180dd011077291a6",
"v": 2,
"apiName": "GenMiniappScheme"
}
2
3
4
5
6
7
8
9
10
# 场景2 微信内跳转小程序
# 方案1 独立开发
方案说明:在微信内浏览器打开活动页面,基于微信开放标签直接进行跳转小程序,参照文档:跳转小程序 (opens new window)
- 优势:体验号,在活动页直接跳转到小程序
- 劣势:需要公众号,且类型必须为服务号;需项目开发页面
小程序appid: wx707e2eb408780a5b
路径:pages/gameAccountBind/index
query参数: 参照微信小程序query参数
示例:
<wx-open-launch-weapp
id="launch-btn"
appid="wx707e2eb408780a5b"
path="pages/gameAccountBind/index?redirectUrl=&nickName=%E5%B0%8F%E6%A3%AE6%E5%8F%B7&faceUrl=http%3A%2F%2Fp5.a.yximgs.com%2Fuhead%2FAB%2F2024%2F02%2F26%2F13%2FBMjAyNDAyMjYxMzU2MDdfMzk4NDQ3OTA2NV8yX2hkNjMzXzI0Mw%3D%3D_s.jpg&actId=9163&sig=fcd625213050eaf993055fdd97c28441&livePlatId=kuaishou&gameIdList=yxzj&t=1727168121&code=pCWxzhlW3vvq8%2BDEr%2F2ffRgrYCIqAra2UYfoOR5Mexg%3D"
>
<script type="text/wxtag-template">
<style>.btn { padding: 12px }</style>
<button class="btn">打开小程序</button>
</script>
</wx-open-launch-weapp>
<script>
var btn = document.getElementById('launch-btn');
btn.addEventListener('launch', function (e) {
console.log('success');
});
btn.addEventListener('error', function (e) {
console.log('fail', e.detail);
});
</script>
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 方案2 使用livelink中转页
方案说明:在微信内浏览器打开活动页,绑定前跳转打开livelink中转页,在livelink中转页完成绑定后返回活动页
- 优势:无需活动方开发,接入快速
- 劣势:需要用户多一个跳转到中转页的步骤
中转页地址: https://livelink.qq.com/h5-open-mp/wx/
中转页query参数:参数与小程序query参数相同,参照微信小程序query参数
示例:
// url
https://livelink.qq.com/h5-open-mp/wx/?redirectUrl=&nickName=%E5%B0%8F%E6%A3%AE6%E5%8F%B7&faceUrl=http%3A%2F%2Fp5.a.yximgs.com%2Fuhead%2FAB%2F2024%2F02%2F26%2F13%2FBMjAyNDAyMjYxMzU2MDdfMzk4NDQ3OTA2NV8yX2hkNjMzXzI0Mw%3D%3D_s.jpg&actId=9163&sig=fcd625213050eaf993055fdd97c28441&livePlatId=kuaishou&gameIdList=yxzj&t=1727168121&code=pCWxzhlW3vvq8%2BDEr%2F2ffRgrYCIqAra2UYfoOR5Mexg%3D
2
# 跳转QQ小程序
方案说明: 基于scheme模式跳转到QQ小程序,其中scheme地址为调用livelink后台接口得到
接口说明:参照微信小程序scheme接口进行,需注意是
accountType传参为qq- queryString参数: 参照QQ小程序query参数,scheme模式拉起无法返回原拉起方,可不传入
appPackageName,appBundleId,appQQConnectId三个参数
其他:QQ小程序获取scheme没有限制,无需兜底方案
← 小程序跳转小程序 PC WEB 中间页接入 →