vue开发企业微信_vue全局api

// 先安装下微信的js-sdk
npm install weixin-js-sdk

// 然后在页面中引入
import wx from 'weixin-js-sdk'

{ 
   
   "errcode":0,
   "errmsg":"",
   "access_token": "accesstoken000001",
   "expires_in": 7200
}

{ 
   
    "errcode":0,
    "errmsg":"ok",
    "ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA",
    "expires_in":7200
}

const that = this
// 生成时间戳
var timestamp = getTimestamp()
// 生成的随机字符串
var nonceStr = randomString(16)
// 有效期2小时，用localStorage做本地缓存
localStorage.setItem('timestamp', timestamp)
that.$wx.config({ 

beta: true,// 必须这么写，否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: this.corpid, // 必填，企业微信的corpID
timestamp: timestamp , // 必填，生成签名的时间戳
nonceStr: nonceStr , // 必填，生成签名的随机串
signature: getSignature(ticket, nonceStr, timestamp),// 必填，签名，见 附录-JS-SDK使用权限签名算法
jsApiList: [
'scanQRCode',
'hideOptionMenu'
] // 必填，需要使用的JS接口列表，凡是要调用的接口都需要传进来
});

import sha1 from 'js-sha1'
/** * 获取当前时间 时间戳 * @returns {number} */
export function getTimestamp() { 

return Date.parse(new Date());
}
/** * 获取随机字符串 * @param len 可指定长度 * @returns {string} */
export function randomString(len) { 

len = len || 32
var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'
var maxPos = $chars.length
var pwd = ''
for (var i = 0; i < len; i++) { 

pwd += $chars.charAt(Math.floor(Math.random() * maxPos))
}
return pwd
}
/** * 拼接签名字符串 * @param ticket 通过access_token获取的jsapi_ticket * @param noncestr 自己生成的随机字符串 * @param timestamp 生成签名时的时间戳 * @returns {*} */
export function getSignature(ticket, noncestr, timestamp) { 

let url = window.location.href.split("#")[0]
let jsapi_ticket = `jsapi_ticket=${ 
ticket}&noncestr=${ 
noncestr}&timestamp=${ 
timestamp}&url=${ 
url}`
return sha1(jsapi_ticket);
}

npm install js-sha1

/** * config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后， * config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。 * 对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。 */
that.$wx.ready(function () { 

that.$wx.scanQRCode({ 

desc: "scanQRCode desc",
needResult: 1, // 默认为0，扫描结果由企业微信处理，1则直接返回扫描结果，
scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是条形码（一维码），默认二者都有
success: function (res) { 

// 业务代码
},
error: function (res) { 

// 业务代码
},
});
});