vue+springboot图片上传和显示的示例代码

2020-06-16 06:49:10易采站长站整理

// },
// images_upload_handler(blobInfo, success, failure, progress) {
// progress(0);
// const token = _this.$store.getters.token;
// getToken(token).then(response => {
// const url = response.data.qiniu_url;
// const formData = new FormData();
// formData.append('token', response.data.qiniu_token);
// formData.append('key', response.data.qiniu_key);
// formData.append('file', blobInfo.blob(), url);
// upload(formData).then(() => {
// success(url);
// progress(100);
// })
// }).catch(err => {
// failure('出现未知问题,刷新页面,或者联系程序员')
// console.log(err);
// });
// },
})
},
destroyTinymce() {
const tinymce = window.tinymce.get(this.tinymceId)
if (this.fullscreen) {
tinymce.execCommand('mceFullScreen')
}

if (tinymce) {
tinymce.destroy()
}
},
setContent(value) {
window.tinymce.get(this.tinymceId).setContent(value)
},
getContent() {
window.tinymce.get(this.tinymceId).getContent()
},
imageSuccessCBK(arr) {
const _this = this
arr.forEach(v => {
window.tinymce.get(_this.tinymceId).insertContent(`<img class="wscnph" src="${v.url}" >`)
})
}
}

第二步:后台代码


@RequestMapping(value = "/imageUpload", method = RequestMethod.POST)
public void imageUpload(@RequestParam("file") MultipartFile file, HttpServletRequest request, HttpServletResponse response) {
try {
logger.info("上传图片名 :" + file.getOriginalFilename());

if (!file.isEmpty()) {
// Properties p = new Properties();// 属性集合对象
// String path = RedisUtil.class.getClassLoader().getResource("").getPath()+"global.properties";
// FileInputStream fis = new FileInputStream(path);// 属性文件输入流
// p.load(fis);// 将属性文件流装载到Properties对象中
// fis.close();// 关闭流
// String uploadPath = p.getProperty("imgUpload.url");
// //路径名称上加上-年/月日:yyyy/MMdd
// uploadPath += "Uploads/"+new SimpleDateFormat("yyyy").format(new Date())+ "/" +new SimpleDateFormat("MMdd").format(new Date())+"/";

String path= request.getServletContext().getRealPath("/");

path="/Users/qinshengfei/fsdownload";
logger.error("path:"+path);
//路径名称上加上-年/月日:yyyy/MMdd
String uploadPath = File.separatorChar+"Uploads"+File.separatorChar+new SimpleDateFormat("yyyy").format(new Date())+
File.separatorChar +new SimpleDateFormat("MMdd").format(new Date())+File.separatorChar;

// 文件上传大小
long fileSize = 10 * 1024 * 1024;
//判断文件大小是否超过
if (file.getSize() > fileSize) {
backInfo(response, false, 2, "");