微信公众号-上传图片顺便转base64

拍照或从手机相册中选图接口,这个接口会返回图片的本地ID是上传图片或获取base64图的关键。值得注意的地方是在调取wx.getLocalImgData接口时,其返回的图片路径,安卓手机上会默认不带`data:image/jpeg;base64,`头部,所以在掉你后台接口时可能会报错,导致不能上传;而IOS则是返回的头部是一个不常见的格式jgp,为了兼容手机能够识别该图片需要将jgp替换为jpeg等常见格式。

    wx.chooseImage({
        count: 1,//选择图片的数量限制
        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
        success: function(res) {
            console.log(JSON.stringify(res))
            var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
             //获取图片的宽高
            wx.getLocalImgData({
                localId: localIds[0],//图片的本地ID
                success: function (res) {
                    var localData = res.localData;
                    if (localData.indexOf('data:image') != 0) {                       
                            //判断是否有这样的头部                                               
                             localData = 'data:image/jpeg;base64,' +  localData                    
                     }                    
                    localData = localData.replace(/
|
/g, '').replace('data:image/jgp', 'data:image/jpeg')
                    //将base64图片路径传给后台然后返回我们一个全域名路径的图片,用于其它操作
            $.ajax({ type:
'POST', url: globalObj.url + '/api/User/uploads', header: { //请求头和ajax写法一样 "Content-Type": "application/x-www-form-urlencoded" }, data: { image:localData }, success: function(res) { imgsrchtml = '<div class="img _img">' + '<img src=' + res.images + ' >' + '<span class="del active">X</span>' + '</div>' console.log(res.images) _this.before(imgsrchtml) $('.del').on('tap', function() { $(this).parent().remove() }) }, error: function(error) { } }) } }); } });

微信JS_SDK还提供了上传图片和下载图片的接口

上传:上传图片有效期3天,可用微信多媒体接口下载图片到自己的服务器,此处获得的 serverId 即 media_id。

wx.uploadImage({
    localId: '', // 需要上传的图片的本地ID,由chooseImage接口获得
    isShowProgressTips: 1, // 默认为1,显示进度提示
    success: function (res) {
        var serverId = res.serverId; // 返回图片的服务器端ID
    }
});

下载图片的接口:

wx.downloadImage({
    serverId: '', // 需要下载的图片的服务器端ID,由uploadImage接口获得
    isShowProgressTips: 1, // 默认为1,显示进度提示
    success: function (res) {
        var localId = res.localId; // 返回图片下载后的本地ID
    }
});
当你微笑的时候,全世界都会对你微笑。
原文地址:https://www.cnblogs.com/liruoruo/p/10273205.html