springboot整合vue實(shí)現(xiàn)上傳下載文件
springboot整合vue實(shí)現(xiàn)上傳下載文件,供大家參考,具體內(nèi)容如下
環(huán)境
springboot 1.5.x
完整代碼下載:springboot整合vue實(shí)現(xiàn)上傳下載
1、上傳下載文件api文件
設(shè)置上傳路徑,如例子:
private final static String rootPath =
System.getProperty(“user.home”)+File.separator+fileDir+File.separator;
api接口:
下載url示例:http://localhost:8080/file/download?fileName=新建文本文檔.txt
//上傳不要用@Controller,用@RestController
@RestController
@RequestMapping("/file")
public class FileController {
private static final Logger logger = LoggerFactory.getLogger(FileController.class);
//在文件操作中,不用/或者\(yùn)最好,推薦使用File.separator
private final static String fileDir="files";
private final static String rootPath = System.getProperty("user.home")+File.separator+fileDir+File.separator;
@RequestMapping("/upload")
public Object uploadFile(@RequestParam("file") MultipartFile[] multipartFiles, final HttpServletResponse response, final HttpServletRequest request){
File fileDir = new File(rootPath);
if (!fileDir.exists() && !fileDir.isDirectory()) {
fileDir.mkdirs();
}
try {
if (multipartFiles != null && multipartFiles.length > 0) {
for(int i = 0;i<multipartFiles.length;i++){
try {
//以原來的名稱命名,覆蓋掉舊的
String storagePath = rootPath+multipartFiles[i].getOriginalFilename();
logger.info("上傳的文件:" + multipartFiles[i].getName() + "," + multipartFiles[i].getContentType() + "," + multipartFiles[i].getOriginalFilename()
+",保存的路徑為:" + storagePath);
Streams.copy(multipartFiles[i].getInputStream(), new FileOutputStream(storagePath), true);
//或者下面的
// Path path = Paths.get(storagePath);
//Files.write(path,multipartFiles[i].getBytes());
} catch (IOException e) {
logger.error(ExceptionUtils.getFullStackTrace(e));
}
}
}
} catch (Exception e) {
return ResultUtil.error(e.getMessage());
}
return ResultUtil.success("上傳成功!");
}
/**
* http://localhost:8080/file/download?fileName=新建文本文檔.txt
* @param fileName
* @param response
* @param request
* @return
*/
@RequestMapping("/download")
public Object downloadFile(@RequestParam String fileName, final HttpServletResponse response, final HttpServletRequest request){
OutputStream os = null;
InputStream is= null;
try {
// 取得輸出流
os = response.getOutputStream();
// 清空輸出流
response.reset();
response.setContentType("application/x-download;charset=GBK");
response.setHeader("Content-Disposition", "attachment;filename="+ new String(fileName.getBytes("utf-8"), "iso-8859-1"));
//讀取流
File f = new File(rootPath+fileName);
is = new FileInputStream(f);
if (is == null) {
logger.error("下載附件失敗,請(qǐng)檢查文件“" + fileName + "”是否存在");
return ResultUtil.error("下載附件失敗,請(qǐng)檢查文件“" + fileName + "”是否存在");
}
//復(fù)制
IOUtils.copy(is, response.getOutputStream());
response.getOutputStream().flush();
} catch (IOException e) {
return ResultUtil.error("下載附件失敗,error:"+e.getMessage());
}
//文件的關(guān)閉放在finally中
finally
{
try {
if (is != null) {
is.close();
}
} catch (IOException e) {
logger.error(ExceptionUtils.getFullStackTrace(e));
}
try {
if (os != null) {
os.close();
}
} catch (IOException e) {
logger.error(ExceptionUtils.getFullStackTrace(e));
}
}
return null;
}
}
訪問:http://localhost:8080

上傳:

批量上傳:

下載:

2.上傳大文件配置
/**
* 設(shè)置上傳大文件大小,配置文件屬性設(shè)置無效
*/
@Bean
public MultipartConfigElement multipartConfigElement() {
MultipartConfigFactory config = new MultipartConfigFactory();
config.setMaxFileSize("1100MB");
config.setMaxRequestSize("1100MB");
return config.createMultipartConfig();
}
3.vue前端主要部分
<template> <div style="top:100px;width:300px"> <el-form :model="form" label-width="220px"> <el-form-item label="請(qǐng)輸入文件名" required> <el-input v-model="form.fileName" auto-complete="off" class="el-col-width" required></el-input> </el-form-item> <el-form-item> <el-button size="small" type="primary" @click="handleDownLoad">下載</el-button> </el-form-item> <el-form-item> <el-upload class="upload-demo" :action="uploadUrl" :before-upload="handleBeforeUpload" :on-error="handleUploadError" :before-remove="beforeRemove" multiple :limit="5" :on-exceed="handleExceed" :file-list="fileList"> <el-button size="small" type="primary">點(diǎn)擊上傳</el-button> <div slot="tip" class="el-upload__tip">一次文件不超過1Gb</div> </el-upload> </el-form-item> </el-form> </div> </template>
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
SpringCloud筆記(Hoxton)Netflix之Ribbon負(fù)載均衡示例代碼
這篇文章主要介紹了SpringCloud筆記HoxtonNetflix之Ribbon負(fù)載均衡,Ribbon是管理HTTP和TCP服務(wù)客戶端的負(fù)載均衡器,Ribbon具有一系列帶有名稱的客戶端(Named?Client),對(duì)SpringCloud?Ribbon負(fù)載均衡相關(guān)知識(shí)感興趣的朋友一起看看吧2022-06-06
Maven實(shí)戰(zhàn)之搭建Maven私服和鏡像的方法(圖文)
本篇文章主要介紹了搭建Maven私服和鏡像的方法(圖文),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-12-12
反射機(jī)制:getDeclaredField和getField的區(qū)別說明
這篇文章主要介紹了反射機(jī)制:getDeclaredField和getField的區(qū)別說明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2021-06-06
springboot如何獲取相對(duì)路徑文件夾下靜態(tài)資源的方法
這篇文章主要介紹了springboot如何獲取相對(duì)路徑文件夾下靜態(tài)資源的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-05-05
SpringBoot 任務(wù)調(diào)度動(dòng)態(tài)設(shè)置方式(不用重啟服務(wù))
這篇文章主要介紹了SpringBoot 任務(wù)調(diào)度 動(dòng)態(tài)設(shè)置方式(不用重啟服務(wù)),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2021-11-11
java實(shí)現(xiàn)調(diào)用http請(qǐng)求的五種常見方式
在實(shí)際開發(fā)過程中,我們經(jīng)常需要調(diào)用對(duì)方提供的接口或測(cè)試自己寫的接口是否合適,本文主要介紹了java實(shí)現(xiàn)調(diào)用http請(qǐng)求的四種常見方式,感興趣的可以了解一下2024-07-07
Java學(xué)習(xí)之反射機(jī)制及應(yīng)用場(chǎng)景介紹
本篇文章主要介紹了Java反射機(jī)制及應(yīng)用場(chǎng)景,反射機(jī)制是很多Java框架的基石。非常具有實(shí)用價(jià)值,需要的朋友可以參考下。2016-11-11
JAVA求兩直線交點(diǎn)和三角形內(nèi)外心的方法
本文提供了JAVA求兩直線交點(diǎn)、三角形外心、三角形內(nèi)心的代碼和算法講解,大家可以參考使用2013-11-11

