兼容ios的微信公众号调用JSSDK

1、request,js

import axios from 'axios'
import { Message } from 'element-ui'
// import { getToken } from '@/utils/auth'

// 创建axios实例
const service = axios.create({
  baseURL: '', // api的base_url
timeout: 5000 // 请求超时时间
})

// request拦截器
service.interceptors.request.use(config => {
  // if (store.getters.token) {
  // config.headers['X-Token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
// }
return config
}, error => {
  // Do something with request error
console.log(error) // for debug
Promise.reject(error)
})

// respone拦截器
service.interceptors.response.use(
  response => {
  /**
  * code为非20000是抛错 可结合自己业务进行修改
*/
// const res = response.data
    // console.log(res)
    // if (res.code !== 200) {
    //   Message({
    //     message: res.message,
    //     type: 'error',
    //     duration: 5 * 1000
    //   })
    //
    //   // 50008:非法的token; 50012:其他客户端登录了;  50014:Token 过期了;
    //   if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
    //     MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
    //       confirmButtonText: '重新登录',
    //       cancelButtonText: '取消',
    //       type: 'warning'
    //     }).then(() => {
    //       // store.dispatch('FedLogOut').then(() => {
    //       //   location.reload()// 为了重新实例化vue-router对象 避免bug
    //       // })
    //       location.reload()
    //     })
    //   }
    //   return Promise.reject(new Error('error'))
    // } else {
    //   return response.data
    // }
return response.data
},
error => {
    console.log(error)
    // console.log(error)// for debug
Message({
      message: error.response.data.msg,
type: 'error',
duration: 3 * 1000
})
    return Promise.reject(error)
  }
)

export default service

 

2、scanCode.js // 公众js 微信扫一扫

 

import request from '@/util/request'

let ready = false

export function isIOS () {
  let isIphone = navigator.userAgent.includes('iPhone')
  let isIpad = navigator.userAgent.includes('iPad')
  return isIphone || isIpad
}
export async function requestWxstr () {
  let uri = window.location.href
let res = await queryWxStr(uri)
  // eslint-disable-next-line no-undef
wx.config({
    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: res.appID, // 必填，公众号的唯一标识
timestamp: '' + res.timestamp, // 必填，生成签名的时间戳
nonceStr: res.nonce_str, // 必填，生成签名的随机串
signature: res.signature, // 必填，签名
jsApiList: [ 'checkJsApi', 'scanQRCode' ] // 必填，需要使用的JS接口列表
})
  // 阻止第二次调用
// eslint-disable-next-line no-undef
wx.ready(() => { ready = true })
}
export function queryWxStr (uri) {
  return request({
    url: 'http://*********',
method: 'get',
params: { uri }
  })
}

export function isReady () {
  return ready
}

 

3、main.js

判断兼容IOS

import { isIOS, requestWxstr, isReady } from '@/api/scanCode'

router.beforeEach((to, from, next) => {
  // console.log()
if (isIOS() && !isReady()) {
    if (from.path === '/') {
      requestWxstr()
    }
    if (to.meta.title) {
      document.title = to.meta.title
}
  }
  next()
})

 

4、在用的组件里使用

import {isIOS, requestWxstr} from '@/api/scanCode'

 created () {

　　if (!isIOS) {

　　　　requestWxstr ()

　　}

}