让网页一秒抵达微信小程序
——「快缩短网址」suo.run 优雅指南
一、在微信内:丝滑 JS-SDK 方案
当页面栖居于微信浏览器,最优雅的姿势莫过于官方 JS-SDK。
1. 引入
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
2. 鉴权
后端按微信规则生成签名,前端轻量配置:
wx.config({
debug: false,
appId: '你的AppID',
timestamp, nonceStr, signature, // 由后端注入
jsApiList: ['navigateToMiniProgram']
});

3. 一触即发
wx.ready(() => {
document.getElementById('enter').onclick = () => {
wx.navigateToMiniProgram({
appId: '目标小程序AppID',
path: 'pages/index/index?id=123',
extraData: { via: 'suo.run' }
});
};
});
仅需确认:公众号已关联小程序、域名已备案、用户微信为最新版。
二、脱离微信:URL Scheme 直链
若用户正徜徉在 Chrome、Safari 等外域浏览器,可祭出 URL Scheme。
1. 后端瞬时生成(有效期 30 天)
POST https://api.weixin.qq.com/wxa/generatescheme?access_token=TOKEN
{
"jump_wxa": {
"path": "pages/index/index",
"query": "id=123"
}
}
2. 前端一键唤醒
<a id="deepLink" href="weixin://dl/business/?t=生成的Scheme">立即进入小程序</a>
iOS 需用户主动点击,自动跳转将被拦截;Android 则相对宽容。
三、云开发托管:零后端捷径
网页若栖身于微信云开发静态托管,可让云函数代劳生成 Scheme,前端直接
window.location.href 即可,全程无服务器。四、绝境逢生:二维码兜底
非微信环境且 Scheme 被拦?别慌,祭出小程序码:
<img src="https://api.qrserver.com/v1/create-qr-code/?data=小程序码地址" alt="扫码直达">
或温柔提示:“请复制链接到微信打开”。
五、完整示例(JS-SDK 版)
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<title>快缩短网址 · 一键入小程序</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
</head>
<body>
<button id="enter">嗖地一下,进小程序</button>
<img src="https://suo.run/uploads/20251015/16.png" alt="" class="img-fluid" />
<script>
fetch('/api/wx-config') // 由 suo.run 后端提供
.then(r => r.json())
.then(cfg => {
wx.config({ ...cfg, jsApiList: ['navigateToMiniProgram'] });
wx.ready(() => {
document.getElementById('enter').onclick = () =>
wx.navigateToMiniProgram({
appId: '目标小程序AppID',
path: 'pages/index/index?from=suo.run'
});
});
});
</script>
</body>
</html>
六、常见迷障
• 跳转无响应?八成不在微信内,或签名已过期。
• 页面空白?业务域名未配置。
• iOS 拦截?务必让用户亲手点击按钮触发。
更多细节,请以微信官方文档为圭臬。愿「快缩短网址」suo.run 成为你通往小程序的轻盈桥梁。