vue微信分享出来的链接点开是首页问题的解决方法


Posted in Javascript onNovember 28, 2018

最近工作上遇到了这样一个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给修复了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery时间轴特效(三种不同类型)
Nov 02 Javascript
jQuery根据表单name获取值的方法
May 24 Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 Javascript
JavaScript中ES6 Babel正确安装过程
Jul 18 Javascript
jQuery动态生成不规则表格(前后端)
Feb 21 Javascript
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
Aug 24 Javascript
ES6学习笔记之map、set与数组、对象的对比
Mar 01 Javascript
vue动画打包后失效问题的解决方法
Sep 18 Javascript
实现一个 Vue 吸顶锚点组件方法
Jul 10 Javascript
javascript中this的用法实践分析
Jul 29 Javascript
layui 富文本赋值,取值,取纯文本值的实例
Sep 18 Javascript
JS实现电脑虚拟键盘打字测试
Jun 24 Javascript
vue实现微信分享功能
Nov 28 #Javascript
vue微信分享到朋友圈 vue微信发送给好友
Nov 28 #Javascript
详解小程序rich-text对富文本支持方案
Nov 28 #Javascript
微信小程序实现简单评论功能
Nov 28 #Javascript
微信小程序实现省市区三级地址选择
Jun 21 #Javascript
Vue一次性简洁明了引入所有公共组件的方法
Nov 28 #Javascript
react脚手架如何配置less和ant按需加载的方法步骤
Nov 28 #Javascript
You might like
PHP实时显示输出
2008/10/02 PHP
php计算十二星座的函数代码
2012/08/21 PHP
克隆一个新项目的快捷方式
2013/04/10 PHP
phpmailer简单发送邮件的方法(附phpmailer源码下载)
2016/06/13 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
js或css实现滚动广告的几种方案
2010/01/28 Javascript
JavaScript ( (__ = !$ + $)[+$] + ({} + $)[_/_] +({} + $)[_/_] )
2011/02/25 Javascript
分享27个jQuery 表单插件集合推荐
2011/04/25 Javascript
javascript数组去重3种方法的性能测试与比较
2013/03/26 Javascript
JavaScript中的单引号和双引号报错的解决方法
2014/09/01 Javascript
使用微信小程序开发前端【快速入门】
2016/12/05 Javascript
详解Python中logging日志模块在多进程环境下的使用
2016/12/26 Javascript
angular.js 路由及页面传参示例
2017/02/24 Javascript
深入理解vue-router之keep-alive
2017/08/31 Javascript
nodejs操作mongodb的增删改查功能实例
2017/11/09 NodeJs
基于$.ajax()方法从服务器获取json数据的几种方式总结
2018/01/31 Javascript
基于Vue的延迟加载插件vue-view-lazy
2018/05/21 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
2018/10/24 jQuery
vue.js自定义组件directives的实例代码
2018/11/09 Javascript
详解关于React-Router4.0跳转不置顶解决方案
2019/05/10 Javascript
基于js实现抽红包并分配代码实例
2019/09/19 Javascript
微信小程序scroll-view隐藏滚动条的方法详解
2020/03/25 Javascript
[53:13]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第三场 1月18日
2021/03/11 DOTA
利用django-suit模板添加自定义的菜单、页面及设置访问权限
2018/07/13 Python
对Python闭包与延迟绑定的方法详解
2019/01/07 Python
python求加权平均值的实例(附纯python写法)
2019/08/22 Python
余弦相似性计算及python代码实现过程解析
2019/09/18 Python
python构造IP报文实例
2020/05/05 Python
keras model.fit 解决validation_spilt=num 的问题
2020/06/19 Python
如何用python免费看美剧
2020/08/11 Python
weblogic面试题
2016/03/07 面试题
金融专业大学生职业生涯规划范文
2014/01/16 职场文书
办理护照介绍信
2014/01/16 职场文书
竞争上岗实施方案
2014/03/21 职场文书
乡镇遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
病假证明模板
2015/06/19 职场文书