微信小程序上传图片

Posted 雨筠

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序上传图片相关的知识,希望对你有一定的参考价值。

/**
             * 选择图片上传服务器
             * num 允许传几张
             */
            const uploadImg = function(num, onlyCam = false) {
                return new Promise((resolve, reject) => {

                    wx.chooseImage({
                        count: num,
                        sizeType: [‘compressed‘], // 可以指定是原图还是压缩图,默认二者都有 ‘original‘,
                        sourceType: onlyCam ? [‘camera‘] : [‘album‘, ‘camera‘],
                        success: function(pic) {
                            let g_data = getApp()
                            let address = g_data.server_address;
                            let upImg = []
                            wx.showLoading({
                                title: ‘上传中‘,
                                mask: true,
                                icon: ‘none‘,
                            })
                            pic.tempFilePaths.forEach((list, index) => {
                                upImg[index] = new Promise((resSing, rejSing) => {
                                    wx.uploadFile({
                                        url: `${address}/WxFile/UploadImg`,
                                        filePath: list,
                                        header: {
                                            "Content-Type": "multipart/form-data"
                                        },

                                        name: ‘Image‘,
                                        success: function(res) {
                                            let res_data = res.data;
                                            let brand = g_data.globalData.system_info.brand;
                                            if(brand == ‘iPhone‘) {
                                                console.log(‘苹果:‘, res_data)
                                                res_data = res_data.replace(/\/g, ‘‘);
                                            } else {
                                                console.log(‘其他::‘, res_data)
                                            }
                                            res_data = res_data.substring(res_data.indexOf(‘{‘), res_data.lastIndexOf(‘}‘) + 1);
                                            res_data = JSON.parse(res_data);
                                            if(res_data.Stat != 1) {
                                                return rejSing()
                                            }
                                            resSing(res_data.Data)
                                        },
                                        fail: function(err) {
                                            rejSing(err)
                                        }
                                    });
                                })
                            })
                            //上传完图片才reject数据  (resAll返回的是一个数组)
                            Promise.all(upImg).then((resAll) => {
                                wx.hideLoading()
                                resolve(resAll)
                            }).catch((errAll) => {
                                wx.hideLoading()
                                wx.showToast({
                                    title: ‘上传失败‘,
                                    icon: ‘none‘
                                })
                                reject()
                            })
                        },
                        fail: function(err) {
                            if(err.errMsg === "chooseImage:fail cancel") {
                                reject()
                            } else {
                                wx.showToast({
                                    title: ‘上传失败‘,
                                    icon: ‘none‘
                                })
                                reject()
                            }

                        }
                    });
                })
            }
            // 图片预览 ind:当前浏览索引   list:需要预览的图片数组
            const picBroser = function(ind, list) {
                wx.previewImage({
                    current: ind, // 当前显示图片的http链接
                    urls: list // 需要预览的图片http链接列表
                })
            }

 

以上是关于微信小程序上传图片的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序实现图片是上传预览功能

微信小程序上传图片+图片预览

微信小程序拍照和上传图片实现

微信小程序多张图片上传

5行代码实现微信小程序图片上传与腾讯免费5G存储空间的使用

微信小程序--实现图片上传