uni图片上传前后端实现
作者:互联网
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