一、绑定域名
先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
备注：登录后可在“开发者中心”查看对应的接口权限。
二、引入JS文件
三、通过config接口注入权限验证配置
（由于有些属性需要异步，所以可以使用action通过api来获得各个值，固定不变的可以放在state中，再将这些值在mutation中赋值给config）
官方config需要的配置信息如下。
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '', // 必填，公众号的唯一标识
timestamp: , // 必填，生成签名的时间戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名
jsApiList: [] // 必填，需要使用的JS接口列表
});四、通过ready接口处理成功验证
wx.ready(function(){
});config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
五、通过error接口处理失败验证
wx.error(function(res){
});config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
以上为配置，配置了之后就可以使用微信的一些接口了。
下面挑几个示例来演示接口。
1.通过接口来获得地理坐标
mLocation (state, payload) {
wx.getLocation({
type: 'wgs84',
// 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
success: function (res) {
console.log(res)
alert(res.longitude)
}
})
},然后再在需要使用的vue页面引用该函数。
ps：获得的地址为wgs84的gps坐标。百度、谷歌等地图所需要的坐标与wgs84的坐标有些差距，需要用一些函数来转换。
2.通过接口来上传图片
upPic (state, payload) {
wx.chooseImage({
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function (res) {
state.images.localId = res.localIds
// 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
alert('选择了' + res.localIds.length + '张图片')
if (state.images.localId.length === 0) {
alert('请先选择图片')
return
}
var i = 0
var length = state.images.localId.length
state.images.serverId = []
function upload () {
wx.uploadImage({
localId: state.images.localId[i], // 需要上传的图片的本地ID，由chooseImage接口获得
isShowProgressTips: 1, // 默认为1，显示进度提示
success: function (res) {
i++
alert('upload:' + i + '/' + length)
state.images.localId.push(res.serverId)// 返回图片的服务器端ID
if (i < length) {
upload()
}
},
fail: function (res) {
console.log(res)
}
})
}
upload()
}
})
},在state中声明一个数组images{localId：[], serverId:[]}