最近最用 vue 开发微信服务号 ，也是第一次调用微信的sdk ， （ 先吐槽下自己 断断续续的整理一个星期才搞出来 ） 日了狗了 ，坑太多 ， 更多是 ios 不兼容 ，图片不显示呀 ， 不能上传多张啦 这里就可以帮你解决 ！ 废话不多说 直接上代码 ：
第一步 ：首先你得引人 文件：
http://res./open/js/jweixin-1.2.0.js （目前最新版本）
支持使用 AMD/CMD 标准模块加载方法加载 同时也支持 npm 安装
第二步：通过config接口注入权限验证配置 （获取签名）
getUrlConfig(){let wiexin = apiRouter.GET_CONFIG + encodeURIComponent(this.urlPath)this.$http.get(wiexin).then(response => {let data = response.bodywx.config({// debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。appId: data.appId, // 必填，企业号的唯一标识，此处填写企业号corpidtimestamp: data.timestamp, // 必填，生成签名的时间戳nonceStr: data.nonceStr, // 必填，生成签名的随机串signature: data.signature,// 必填，签名，见附录1jsApiList: ["chooseImage", "uploadImage", "downloadImage",] // 必填，需要使用的JS接口列表});wx.error(function (res) {alert(res)});}, response => {// console.log("请求失败了!!!!")});},
getUrlConfig 方法里面得
let wiexin = apiRouter.GET_CONFIG + encodeURIComponent(this.urlPath)
apiRouter.GET_CONFIG ：这个是我 url 定义得常量
encodeURIComponent ：可把字符串作为URI 组件进行编码
this.urlPath ： 当前得url
这个时候就可以看到成功与否了！
第三步 ： 选择图片
onClickUp(){let _this = this;wx.chooseImage({count: _this.imgaesMaxLenght - _this.localIdImgs.length, // 默认9sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有success: function (res) {let localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片// 判断 ios if (window.__wxjs_is_wkwebview) { _this.wxgetLocalImgData(localIds);}else{localIds.forEach((item, index) => {_this.localIdImgs.push(item);if( _this.localIdImgs.length >= _this.imgaesMaxLenght ){_this.imgLenght = false}});}_this.wxuploadImage(localIds);},fail: function (res) {console.log("失败")}});}
然后你们自己看吧
wxuploadImage(localIds) {let _this = this;var i = 0; var length = localIds.length;var upload = function() {let loacId = localIds[i];if (window.__wxjs_is_wkwebview) {if (loacId.indexOf("wxlocalresource") != -1) {loacId = loacId.replace("wxlocalresource", "wxLocalResource");}}wx.uploadImage({localId: loacId, // 需要上传的图片的本地ID，由chooseImage接口获得isShowProgressTips: 1, // 默认为1，显示进度提示success: function (res) {// alert(res.serverId);var serverId = {id:'',serverid:res.serverId}_this.serverId.push(serverId);i++;i < length && upload();},fail: function (error) {alert("失败11")}});}upload();},wxgetLocalImgData(localIds){let _this = this;var i = 0; var length = localIds.length;var upload = function() {wx.getLocalImgData({localId: localIds[i], // 图片的localIDsuccess: function (res) {let localData = res.localData; // localData是图片的base64数据，可以用img标签显示localData = localData.replace('jgp', 'jpeg');_this.localIdImgs.push(localData);if( _this.localIdImgs.length >= _this.imgaesMaxLenght ){_this.imgLenght = false}i++;i < length && upload();}});}upload();},
到这里程序就以及完成了 ， 代码可以直接 复制用 ！
经测试 android ios 都兼容
