vue中ios 微信sdk 踩过的坑 ！！！

问题描述：

ios在微信浏览器中，vue history模式下 路由跳转后，调用微信sdk相关调用api不生效，但在该页面刷新后又恢复正常；
Android一切正常！

原因：

主要问题是ios在路由切换时 微信SPA始终都是首次进入时的URL地址，Android微信SPA则是同步路由切换时的地址

举例：

从首页进入 http://028h5.cn/?i=xxxxxxxxxx 点击跳转到 http://028h5.cn/order?i=xxxxxxxxxx
此时
ios微信SPA的地址 http://028h5.cn/?i=xxxxxxxxxx
Android微信SPA的地址 http://028h5.cn/order?i=xxxxxxxxxx

解决：

import wx from 'weixin-js-sdk'

let signLink;

// 切换路由
router.afterEach((to, from, next) => {

  // 如果是ios环境
  if( isIOS() ){
    // 记录进入app时的url
    if (typeof window.entryUrl === 'undefined' || window.entryUrl === '') {
      window.entryUrl = location.href.split('#')[0]
    }
    // 将http://028h5.cn/?i=xxxxxxxxxx 转为http://028h5.cn/index?i=xxxxxxxxxx 
    if( window.entryUrl.indexOf('/?') != -1 ){
      window.entryUrl = window.entryUrl.split('/?')[0]+'/index?'+window.entryUrl.split('/?')[1]
    }
    // 进行签名的时候  Android 不用使用之前的链接， ios 需要
    signLink =  /(Android)/i.test(navigator.userAgent) ? location.href.split('#')[0] : window.entryUrl;
  }
  else{
    signLink = window.location.origin + to.fullPath
  }

  http.ajax('/ffkj-main/api/share/friend',{
      url: signLink
    },'get',{}).then(res=>{
      if( res.code == 0 && res.data ){
        wx.config({
          debug: false, //调试模式
          appId: res.data.appId,
          timestamp: res.data.timestamp,
          nonceStr: res.data.nonceStr,
          signature: res.data.signature,
          jsApiList: [
            'hideMenuItems',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'checkJsApi',
            'openLocation',
            'getLocation',
            'chooseImage',
            'openAddress'
          ]
        });
      }
   })
})

// 调用微信收货地址
function fnOpenAddress(fn){
  wx.ready(function () {
    wx.openAddress({
      success: function (res) {
        fn(res)
      },
      cancel: function (res) {
        // alert('用户取消拉出地址');
      },
      fail: function (res) {
        Toast('拉取用户收货地址失败，请填写当前页面收货信息')
      }
    });
  })
}
Vue.prototype.fnOpenAddress = fnOpenAddress


// 门店地址
function fnOpenLocation(item){
  wx.ready(function () {
    wx.openLocation({
        latitude: parseFloat(item.latitude),  //经纬度必须为浮点数，否则ios端会失效
        longitude: parseFloat(item.longitude),  //经纬度必须为浮点数，否则ios端会失效
        name: item.title,
        address: item.address,
        scale: 14,
        infoUrl: 'http://weixin.qq.com'
    });
  })
}
Vue.prototype.fnOpenLocation = fnOpenLocation


// 获取地理位置接口
  function fnGetLocation(success){
    wx.ready(function () {
      wx.getLocation({
        type: 'gcj02',  //默认wgs84，gcj02更精准定位
        success: function (res) {
          success(res)
        },
        cancel: function (res) {
          store.commit('setLoading',false)
          Toast('你也可以点击"所在地区"选择哦~')
        },
        fail: function (res) {
          // alert(JSON.stringify(res));
          Toast('获取用户位置失败，也可以点击"所在地区"选择哦~')
        }
      });
    })
  }