uni-app 上传图片到服务器

页面结构

                
             

定义属性
Data(){
    Return {
        iconcheck: 0, //头像是否改变
            image: '' //默认头像
    }
}

点击头像
upload() {
            let _self = this;
        
            uni.chooseImage({
                count: 1,
                sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
                sourceType: ['album'], //从相册选择
                success: function(res) {
                    const tempFilePaths = res.tempFilePaths;
                    _self.image = tempFilePaths[0];
                    // console.log('tempFilePaths[0]', tempFilePaths[0]); //能够打印出选中的图片
                    console.log(_self.image);
                    _self.iconcheck = 1; //点击后图片更改状态由0变成1
                    _self.touxiang(_self.image);    
                },
                error: function(e) {
                    console.log(e);
                }
            });
        },
        拿到上传的图片路径
        touxiang(path) {
            let token = uni.getStorageSync('storage_token');
            console.log(token);
            uni.uploadFile({
                url: this.baseUrl + '/api/uploadFile',
                method: 'POST',
                formData: {
                    file: path
                },
                filePath: path,
                name: 'file',
                header: {
                    token: token
                },
                success: res => {
                    console.log(res.data);
                    console.log(JSON.parse(res.data).code);
                    let img = JSON.parse(res.data).data.img_path;
                    // let img = res.data.data.img_path;
                    console.log(img);
                    uni.showToast({
                        title: JSON.parse(res.data).msg,
                        icon: 'none',
                        duration: 800
                    });
                    console.log("22222222222");
                    console.log(img);
                    this.shangChuanImg(img);
                    
                },
                fail: () => {},
                complete: () => {}
            });
        },
        进行图片更新
        shangChuanImg(img) {
            var that = this;
            let token = uni.getStorageSync('storage_token');
            // console.log(path);
            uni.request({
                url: this.baseUrl + '/api/portrait',
                method: 'POST',
                data: {
                    path: img
                },
            
                header: {
                    'content-type': 'application/x-www-form-urlencoded',
                    token: token
                },
                success: res => {
                    console.log(res.data);
                    if (res.data.code == '200') {
                        uni.showToast({
                            title: res.data.msg,
                            icon: 'none',
                            duration: 800
                        });
                        that.userinfo();
                    } else {
                        uni.showToast({
                            title: res.data.msg,
                            icon: 'none',
                            duration: 800
                        });
                        return false;
                    }
                },
                fail: () => {},
                complete: () => {}
            });
        },

你可能感兴趣的:(uni-app)