关于uniapp上传头像功能实现代码如下

最新推荐文章于 2024-07-26 21:53:17 发布

小李小李，知书达理

最新推荐文章于 2024-07-26 21:53:17 发布

阅读量608

点赞数

文章标签： uni-app javascript

本文链接：https://blog.youkuaiyun.com/ajhdcjksdhfs/article/details/130504119

版权

这段代码展示了如何在小程序中从本地相册或相机选择图片，然后使用uni.uploadFile接口上传到服务器，同时携带token进行身份验证。成功上传后，会显示成功提示，并在2秒后跳转到指定页面并刷新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

    ChangeAvatar() {
                //从本地相册选择图片或使用相机拍照
                uni.chooseImage({
                    sourceType: ['album', 'camera'],//选择方式相册或者相机
                    success: (res) => {
                        console.log('图片', res)
                        var tempFilePath = res.tempFilePaths;
                        var filePath = tempFilePath[0];
                        console.log(filePath);//输出本地头像路径
                //调用上传下载api

                        uni.uploadFile({
                            url: '后端提供', //这个是你服务上的php用来处理图片上传的路径（可var_dump($_FILE)出来看看）
                            filePath: filePath,//要上传文件资源的路径。
                            name: 'image', //文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
                            fileType: 'image',//文件类型，image/video/audio
                            /* 在请求头里边携带的东西
                             header: {
                                 'content-type': 'multipart/form-data',
                                  token: uni.getStorageSync('token')
                             
                             },*/
                            
                            formData: {
                                 //HTTP 请求中其他额外的formdata数据
                                token: uni.getStorageSync('token')
                            },
                            success: (res) => { //成功回调函数
                                console.log('this', JSON.parse(res.data), res)
                                let code = JSON.parse(res.data).code
                                if (code == 200) {
                                    uni.showToast({
                                        title: '上传成功',
                                        icon: 'success',
                                        duration: 2000
                                    })

                                   //成功后2秒跳转到其他页面并刷新目标页面开始
                                    setTimeout(() => {
                                        uni.redirectTo({
                                            url: '要跳转的页面路径',
                                            success: function(e) {
                                                var page = getCurrentPages()
                                                    .pop();
                                                console.log('page', page)
                                                if (page == undefined ||
                                                    page == null) return;
                                                page.onLoad();
                                            }
                                        })
                                    }, 2000)

                                    //成功后2秒跳转到其他页面并刷新目标页面结束
                                }
                            },
                            fail: (e) => {
                                console.log(e, 'shangchuanshibai1');
                                uni.showToast({
                                    title: '上传失败',
                                    icon: 'loading',
                                    duration: 2000
                                })
                            }
                        })

                    }
                });
            },