uni图片上传前后端实现

2022-08-10 15:01:03 阅读：138 来源： 互联网

标签：return String tempFile fileName file uni fileUser 上传图片

1.前端

<view class="u-m-r-10"><u-avatar :src="pic" size="140" @click="img"></u-avatar></view>

/* 图片上传 */
        img:function(){
            uni.chooseImage({
                 count: 9,
                sizeType:"compressed",
                success: (res) => {
                    console.log('chooseImage<<',res);
                    //图片集合
                    var filePaths = res.tempFilePaths;
                    for(var i =0; i<filePaths.length;i++){
                        const imgsFile = res.tempFilePaths[i];
                        const uploadTask = uni.uploadFile({
                                        url: getApp().globalData.$websiteUrl+'/system/user/savePicByFormData',
                                        filePath: imgsFile,
                                        name: 'file',
                                        formData: {
                                            'fileUser': this.Name+i
                                        },
                                        header:{"Content-Type": "multipart/form-data"},
                                        success:(uploadFileRes)=>{
                                            
                                            if(uploadFileRes.statusCode === 200){
                                                console.log('上传文件名称<<',uploadFileRes);
                                            }
                                        }
                                    });
                    }
                    
                    
                }
            })
        }

说明：formData:用于向后台传输其他二外参数。

2.后台

controller层

   /**
     * @param fileUser 请求其他参数
     * @param file     文件流
     * @return
     * @throws IOException
     */
    @RequestMapping(value ="/savePicByFormData",method = RequestMethod.POST)
    @ResponseBody
    public String savePicByFormData(@RequestParam("file") MultipartFile file, String fileUser) throws IOException {
        try {
            //文件保存名字
            String fileName = service.savePicByFormData(file,fileUser);
            return fileName;
        } catch (Exception exception) {
            return ResponseMsg.INSERT_UPDATE_ERROR;
        }
    }

service实现类

/**
     * 保存图片方式二
     *
     * @param file
     * @return
     * @throws IOException
     */
    @Override
    public String savePicByFormData(MultipartFile file,String fileUser) {
        try {
            // 图片存储路径
            String path = "C:\\image\\factory";

            // 判断是否有路径
            if (!new File(path).exists()) {
                new File(path).mkdirs();
            }
            //String fileName = UUID.randomUUID().toString().replace("-", "") + ".jpg";
            String fileName = fileUser + ".png";
            File tempFile = new File(path, fileName);
            if (!tempFile.exists()) {
                tempFile.createNewFile();
            }
            file.transferTo(tempFile);
            return fileName;
        } catch (Exception exception) {
            System.out.println(exception.getMessage());
            return exception.getMessage();
        }

    }

参考文章：

https://javaforall.cn/147987.html

http://t.zoukankan.com/flypig666-p-12488556.html

标签：return,String,tempFile,fileName,file,uni,fileUser,上传,图片
来源： https://www.cnblogs.com/ckfuture/p/16572452.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

uni图片上传前后端实现