describe
When using Vue to develop a public account, if you encounter this problem when sharing a link, you will intercept all the addresses after #, and then jump to the homepage. If you use the history mode, this problem does not exist, but Vue needs background configuration support to enable this mode. After asking about our backend, I directly said no, there is no way, I can only find a way to solve it myself.
train of thought
At that time, I searched roughly and tried various methods. Transcoding and splicing were useless. Later, I used a transfer page to help me realize the jump.
The principle is roughly to write a third-party page, and then we take parameters when making WeChat sharing links, jump to this third-party page, and then re-join the parameters in this page, and finally redirect to the need to share the link Go to the page you shared.
This is also based on demand, because I need to initiate WeChat authorization and obtain the code when I enter the page, so this method is adopted. So it also depends on your project needs.
the code
Create a new redirect.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
</head>
<body>
<script>
var str = window.location.search
//这里写处理代码，因为我的分享链接有四个场景，所以在这里对str做了一些处理和判断
window.location.href = '域名' + '/#/' + strr + '?' + can
</script>
</body>
</html>
When sharing link injection
const newUrl = window.location.protocol + "//" + window.location.host + "存放的路径/redirect.html?" + '拼接你的参数'
wx.onMenuShareAppMessage({
title: title, // 分享标题
desc: desc, // 分享描述
link: newUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: img, // 分享图标
type: "", // 分享类型,music、video或link，不填默认为link
dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
success: function() {
// 用户点击了分享后执行的回调函数
// alert("分享成功");
},
cancel: function() {
// 用户取消分享后执行的回调函数
// alert("分享取消");
}
});
But when requesting the WeChat server to obtain the code, the redirect_uri must ensure this path, and be careful when processing links. I was screwed here.
The personal level is limited. If you have any questions, please leave a message for guidance. It is only for learning and reference.
There is no limit to learning! Work hard, encourage each other!