vue全局封装微信公众号分享模块

Posted 2023-03-31

参考技术A 1.新建一个文件夹，这里我以vxshare.js文件为例。

2.其他文件引入与使用

tips:如果不知道微信JSDK使用的话，可点击 微信jsdk文档进行访问查看

vue 微信公众号分享后支付失效页面URL不变的坑

微信分享后支付页面还是初始页面，这个问题解决了，

created(){
      //判断是否是IOS设备
      // IOS分享时的页面是首页，也就是进入页而不是当前页。所有可以采用刷新当前页，让进入页的链接改成当前页，再在页面卸载时删除缓存数据。
      let agent = navigator.userAgent
      let isIOS = !!agent.match(/(i[^;]+;( U;)? CPU.+Mac OS X/) // ios终端
      if(isIOS && !sessionStorage.getItem(‘isShareState‘)){
        sessionStorage.setItem(‘isShareState‘,true)
        this.$router.go(0)
      }
    },

发现又有另外一个坑，那就是hash 模式下url 参数回默认带回来微信浏览器内带回来的参数

https://xxx/vipidea-subscribe/index.html?from=singlemessage&isappinstalled=0#/buynew/  类似这种的情况。　　
最终没有办法只能换成history模式了
换成history 模式build 白屏 这个需要Nginx配置