更新时间:
2021/03/17
业务需求:
比如某公司的小程序要举办一次宣传或促销活动,为微信小程序引流,除了通过微信、朋友圈宣传,还需要非微信环境的渠道,比如短信、app、h5链接分享,用户通过点击直接跳转到微信小程序。
场景一、微信外网页
注意是微信外网页场景,如果把链接发送到微信,点击链接的话,是无法访问的。
结论:
可以从短信、邮件、微信外网页等场景打开小程序。
参考链接:
步骤:
在小程序管理后台-工具-生成URL Scheme,
生成的URL Scheme如下所示:
weixin://dl/business/?t= *TICKET*
iOS系统支持识别URL Scheme,可在短信等应用场景中直接通过Scheme跳转小程序。
Android系统不支持直接识别URL Scheme,用户无法通过Scheme正常打开小程序,开发者需要使用H5页面中转,再跳转到Scheme实现打开小程序,跳转代码示例如下:
location.href = 'weixin://dl/business/?t= *TICKET*'
该跳转方法可以在用户打开H5时立即调用,也可以在用户触发事件后调用。
注意:针对国内非个人主体小程序开放。
场景二、微信公众号
结论:
可通过关联小程序,通过自定义菜单跳转。
步骤:
通过公众号管理后台关联小程序,并在自定义菜单中配置即可。
场景三、微信内网页
结论:
可通过开放标签打开微信小程序。
参考链接:
步骤:
微信开放标签使用步骤与微信JS-SDK类似,也需要引入JS文件等步骤。
所有开放标签都能像普通的HTML标签一样在页面中直接使用,不需要再进行额外的处理。
跳转小程序:wx-open-launch-weapp
用于页面中提供一个可跳转指定小程序的按钮。使用此标签后,用户需在网页内点击标签按钮方可跳转小程序
<wx-open-launch-weapp
id="launch-btn"
username="gh_xxxxxxxx"
path="pages/home/index?user=123&action=abc"
>
<template>
<style>.btn { padding: 12px }</style>
<button class="btn">打开小程序</button>
</template>
</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>
场景四、APP
结论:
可以通过App分享小程序卡片到微信,然后在微信上点击小程序卡片打开小程序。
也可以通过App主动调用api 打开小程序。
参考链接:
使用步骤:
开发者在App中在集成微信SDK后,可调用接口实现