Products
GG网络技术分享 2025-08-16 20:46 4
在公众号页面嵌入跳转细小程序功能,能有效提升用户体验。用开放标签wx-open-launch-weapp实现这一功能。
细小程序与公众号,虽为微信平台上的不同应用,但彼此间跳转却至关关键。以下我们通过微信JS-SDK、细小程序API、公众号网页授权等方法,详细介绍实现跳转的具体步骤。
引入微信JS-SDK文件:
配置JS-SDK参数:
wx.config({
debug: false,
appId: 'APPID',
timestamp: TIMESTAMP,
nonceStr: NONCE_STR,
signature: SIGNATURE,
jsApiList:
});
实现跳转:
wx.ready {
wx.openLink({
url: 'http://mp.weixin.qq.com/s?__biz=MjM5NTg3NjE3Mg==∣=1000001&idx=1&sn=abcdefg',
success: function {
// 跳转成功
},
fail: function {
// 跳转输了
}
});
});
用细小程序API实现跳转, 代码如下:
wx.navigateToMiniProgram({
appId: 'TARGET_APPID',
path: 'TARGET_PATH',
extraData: {},
envVersion: 'release',
success: function {
// 打开成功
},
fail: function {
// 打开输了
}
});
配置授权回调域名,具体操作可参考微信文档。
引导用户授权, 代码如下:
var scope = 'snsapi_userinfo';
var redirect_uri = encodeURIComponent;
var state = 'wechat_redirect';
var url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxaaaaaaa&redirect_uri=' + redirect_uri + '&response_type=code&scope=' + scope + '&state=' + state + '#wechat_redirect';
window.location.href = url;
获取code,并用access_token和openid进行跳转:
var code = getQueryString;
function getQueryString {
var reg = new RegExp" + name + "=", "i");
var r = decodeURI.substr.match;
if return unescape;
return null;
}
function getAccessToken {
var appid = 'TARGET_APPID';
var secret = 'TARGET_SECRET';
$.ajax({
type: "GET",
dataType: "jsonp",
url: "https://api.weixin.qq.com/sns/oauth2/access_token?appid=" + appid + "&secret=" + secret + "&code=" + code + "&grant_type=authorization_code",
success: function {
callback;
},
error: function {
alert;
}
});
}
getAccessToken {
if {
var access_token = data.access_token;
var openid = data.openid;
// 跳转到公众号
window.location.href = "http://mp.weixin.qq.com/s?__biz=MjM5NTg3NjE3Mg==∣=1000001&idx=1&sn=abcdefg";
}
});
以上方法均能有效实现细小程序到公众号的精准跳转。用这些个方法,既能搞优良用户体验,又能满足搜索引擎抓取需求。
预计以后细小程序与公众号的联动将更加紧密。欢迎用实际体验验证这些个方法的效果。
Demand feedback