调用微信api解决上传图片问题

首先安装wxapi
npm i weixin-jsapi

然后请求接口
updateimg() {
            const self = this
            const params = {
                url: window.location.href//获取本页的url
            }
            api.getWxSdkInfo(params).then((res) => {// 获取微信SDK配置（按照自己项目获取api方式获取）
                wx.config({
                    // debug: true,  //false:关闭调试   开启调试模式,调用的所有api的返回值会在客户端alert出来
                    appId: res.data.app_id,
                    timestamp: res.data.timestamp,
                    nonceStr: res.data.noncestr,
                    signature: res.data.signature,
                    jsApiList: [
                        'chooseImage',
                        'getLocalImgData'
                    ]  // 必填，签名
                })
              
            })

        },

chooseWxImg(xxx){
            var that = this
            // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
            wx.chooseImage({
                count: 1, // 默认9
                sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有
                sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                success: function(imgs) {
                    var localIds = imgs.localIds;
                    self.imgs = localIds[0]
                    // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                    wx.getLocalImgData({
                        localId: localIds[0], // 图片的localID
                        success: function(res) {
                            var localData = res.localData; // localData是图片的base64数据，可以用img标签显示
                            if (/(Android)/i.test(navigator.userAgent)) {
                                localData = localData.toString().replace(/\s/g, "");
                                localData = 'data:image/jpg;base64,' + localData;
                            }
                            let fileName =new Date().getTime()+''+ (parseInt(Math.random()*10000))
                            xxx && xxx(that.dataURLtoFile(localData, fileName))   
                        }
                    });
                }
            });
        }

如果不能传给后台base64，那么利用以下方法可将base64转成file文件
dataURLtoFile(dataurl, filename) {

            var arr = dataurl.split(',');
            var mime = arr[0].match(/:(.*?);/) ? arr[0].match(/:(.*?);/)[1] : '';
            var bstr = atob(arr[1] || arr[0]);

            var n = bstr.length;
            var u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            var fill = new File([u8arr], filename, {
                type: mime
            });
            return fill
        },

上述3个为一个配置文件，下面的方法放入需上传img的页面methods中进行调用（引入方式自行解决）。

最后利用自己的api将获取到的file文件交给后台处理。
如下方式仅供参考
mounted(){
        this.updateimg()//mixins引入的
    },
      
methods：{
    upimg(){
            this.chooseWxImg(file=>{//mixins引入的
                let user_id = JSON.parse(storage.get('member')).id
                let param = new FormData();
                param.append('user_id',user_id)
                param.append('file', file);
                api.postUploadFile(param).then((res) => {
                    console.log(res.url);
                    // sucMsg('提交成功')
                    // this.avatar = res.data.url
                    let params = {
                        "avatar":res.url
                    }
                    api.updateUserInfo(params).then((res)=>{
                        console.log(res);
                        this.imgs=res.data.avatar
                    })
                },
                (err) => {
                    console.log(err);
                    
                })
            })
        },
}