微信小程序 MiniProgram

首页 / 知识 / 微信小程序 MiniProgram

短信-链接跳转

场景

推送营销短信，希望通过点击短信中的链接，跳转打开小程序。

实现基础

要打开小程序，需要用到小程序的 Url Scheme，形如：

weixin://dl/business/?t=hQm43F0Axxx

条件限制

直接在短信中使用 weixin:// ，android 会认为不是链接，也就是无法直接点击打

过程

  1. 准备weixin://链接：登录小程序管理后台，右上角工具--》生成小程序Url Scheme，设定指定参数，点击生成，获取到最终weixin://
  2. 准备短链接，越短越好：因为一条短信一般限制为70个字符，超过70个字符，会收两条短信以上的钱
  3. 当点击短信链接后，将打开短链接所在的html页面，html中使用js进行自动跳转weixin://
  4. 浏览器将weixin:// 请求打开微信
  5. 微信根据weixin://内容，使用相关参数打开小程序

短链接优化

  • 短链接会最终跳转到html页面，例如 cscoder.cn/1.html，那么后面的.html 可以优化，可省5个字符
  • 短信中可以不带http://,例如 http://cscoder.cn/1，可以简化为 cscoder.cn/1

html 页面参考

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" 
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
    <title></title>
    <style>
        .button {
            display: inline-block;
            width: 115px;
            height: 25px;
            background: #4E9CAF;
            padding: 10px;
            text-align: center;
            border-radius: 5px;
            color: white;
            font-weight: bold;
            text-decoration: none;
            }
    </style>
</head>
<body>
    <div style="text-align:center; padding-top:50px;">
        <p>正在尝试跳转打开小程序，</p>
        <p>请点击下面链接：</p>
        <p>
            <a  class="button" href="weixin://dl/business/?t=KM3KMjdSxxx">打开小程序</a>
        </p>
    </div>
    <script>
        window.location.href = "weixin://dl/business/?t=KM3KMjdSxxx";
        // 这个必须要放这里，在ios中，会弹出是否跳转的提示，
        // 当拒绝的时候，将不再往下执行，
        // 如果这个在head里面，也就是卡在了head处，将无法看到body的内容
    </script>
</body>
</html>