微信webapp分享出去带分享参数 form 导致进入分享无法正常匹配路由 vue

Posted by Yinode on Tuesday, October 30, 2018

TOC

以下是某个单页应用的地址

http://m.cswh.me/dh/#/activity/flagRaisingPolice?act_token=b5f01112731d4c47bc5a7214d17365b2

而在这个页面使用微信的JSAPI进行分享之后,即使你设置了

wx.ready(function() {
        wx.onMenuShareAppMessage({
          link: window.location.href ,
          title: that.config.share_title,
          imgUrl: uploadURL + that.config.share_icon,
          desc: that.config.share_text
        })
        wx.onMenuShareTimeline({
          link: window.location.href,
          title: that.config.share_title,
          imgUrl: uploadURL + that.config.share_icon,
          desc: that.config.share_text
        })
      })

link: window.location.href

分享出去的地址依旧会带上一个参数,并且这个参数还是放到了页面Hash的前面,导致你的单页进入之后路由匹配都会有问题

http://m.cswh.me/dh/?from=singlemessage#/activity/flagRaisingPolice?act_token=b5f01112731d4c47bc5a7214d17365b2

解决办法

 window.location.href =
      window.location.origin +
      window.location.pathname +
      '#/' +
      window.location.href.split('#/')[1]

在main.js 里面进行一次地址重新拼接 直接删除掉这个干扰因素。

另外实在是觉得微信很傻逼,都什么年代了 对于spa的支持还是那么的辣鸡。