vue微信分享出来的链接点开是首页问题的解决方法
2019-01-29 12:43
821 查看
最近工作上遇到了这样一个Bug:“vue微信分享出来的链接点开是首页”
公司网站有PC端和移动端,两个版本。其中如果手机访问PC端,则自动跳转到移动端。(这是常规操作,没啥稀奇点。)
可神奇的问题来了。
在移动端中有微信分享功能,如果手机直接访问手机端的地址进入子页面分享,点开分享的链接进入的是子页面。但是如果是从PC端跳转进入手机端,分享子页面链接打开将会是主页。
这个问题我也百度了各种方法,折腾了一天,然而都没啥用。
最后自己想了一个替代方案:
在static目录下新建一个名为html的文件夹,在html文件夹中再新建一个redirect.html(看到这个文件名是不是知道我要干啥了)
没错,我们做一个重定向。
html中写入以下内容
<script> let url = location.href.split('?') let pars = url[1].split('&') let data = {} pars.forEach((n, i) => { let p = n.split('=') data[p[0]] = p[1] }) if (!!data.app3Redirect) { self.location = decodeURIComponent(data.app3Redirect) } </script>
只需要script标签就可以了,反正只是做重定向。
接下来就简单了,原本设置给微信的分享链接是
shareWxLink = window.location.href
现在我们给他改成
shareWxLink = window.location.href.split('#')[0] + 'static/html/redirect.html?app3Redirect=' + encodeURIComponent(window.location.href)
这样,我们就把当前页的地址编码后放到参数app3Redirect里面,当访问redirect.html时将自动重定向到解码后的原地址。
到此,终于把这个坑爹的Bug给修复了。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- 关于微信二次分享,描述变链接的解决方法(一)----文档说明
- 关于微信二次分享,标题变链接的解决方法(二)----代码部分
- iphone微信分享链接时出现乱码的解决方法
- 微信平台中get传递跳转链接-get值为网址-出现not find file等问题解决方法。
- iOS 分享到微信 缩略图显示不出来问题解决办法
- 关于微信二次分享,描述变链接的解决方法(一)----文档说明
- Android微信分享大图遇到的问题的解决方法
- wampserver 2.5 首页链接域名重定向问题解决方法
- 百度云此链接内容可能涉及侵权,分享的文件已经被取消等屏蔽问题的解决方法
- 关于微信二次分享,描述变链接的解决方法(一)----文档说明
- Android;Share SDK微信分享中遇到的问题以及解决方法
- 客户端机器经常从域里面掉出来的问题解决之方法
- 微信分享屏蔽跳转appstore解决方法
- 分享:sql server 连接mysql的问题和解决方法
- ffmpeg库在windows下编译出现无法链接的问题的解决方法
- adb 链接手机offline的问题解决方法
- 友盟集成微信分享,显示您的设备没有安装微信问题及解决办法
- linux下用php调用PDO链接出错问题 pdo未加载解决方法
- IE6、IE内核国产浏览器 png 图片热点链接 不显示问题解决方法
- 轻松解决asp.net用户ASPNET登录失败问题的方法分享