0
点赞
收藏
分享

微信扫一扫

SpringBoot+ElementUI实现通用文件下载请求(全流程图文详细教程)


场景

在某些场景下需要前端浏览器从服务器端下载文件,比如需要下载导入Excel的模板。

SpringBoot+ElementUI实现通用文件下载请求(全流程图文详细教程)_文件名

 

注:

实现

既然是实现通用下载接口,就要实现在后端配置一个下载文件的路径,在前端进行下载请求时传递要下载的文件的名字,然后请求公共接口进行下载。

首先是在前端使用ElementUI的el-link添加一个下载链接

<el-link
type="info"
style="font-size:12px"
@click="downloadTemplate('lxszTemplate.xlsx')"
>下载模板</el-link>

这里设置了其点击事件是调用downloadTemplate方法并传递一个文件名参数,这个文件名就是要下载的文件名。

然后在对应的点击事件中

downloadTemplate(value) {
download(value)
.then((response) => {})
.catch((error) => {
alert("错误:" + error);
});
},

这里执行了一个download方法并传递文件名参数。

这个download方法是引用的第三方js中作为公共方法的。

引入方式

import { download } from "@/utils/badao";

在utils下的badao.js中

// 通用下载方法
export function download(fileName) {
window.location.href = baseURL + "/common/download?fileName=" + encodeURI(fileName) + "&delete=" + false;
}

将此方法进行暴露,作为公共方法。

在通用下载方法中使页面跳转window.location.href ,对应的url是SpringBoot中后台的接口。

这里的baseURL是在badao.js中声明的常量

const baseURL = process.env.VUE_APP_BASE_API

对此常量的赋值是取得全局变量process的属性,它对应的是在vue.config.js中配置的代理的地址

proxy: {
[process.env.VUE_APP_BASE_API]: {
target: `http://localhost:8080`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
}
},

这里是我本地的8080端口。

然后在上面的通用的下载方法中在URL中还拼接了两个参数

一个是文件名参数,调用的js的encodeURI方法可以将字符串作为URL进行编码,一个是是否删除的参数,默认是false,作为下载成功后是否将文件给删除,即实现单次下载还是多次下载。

然后在这个url对应SprinBoot后台接口方法中

@GetMapping("common/download")
public void fileDownload(String fileName, Boolean delete, HttpServletResponse response, HttpServletRequest request) {
try {
if (!FileUtils.isValidFilename(fileName)) {
throw new Exception(StringUtils.format("文件名称({})非法,不允许下载。 ", fileName));
}
String realFileName = System.currentTimeMillis() + fileName.substring(fileName.indexOf("_") + 1);
String filePath = RuoYiConfig.getDownloadPath() + fileName;

response.setCharacterEncoding("utf-8");
response.setContentType("multipart/form-data");
response.setHeader("Content-Disposition",
"attachment;fileName=" + FileUtils.setFileDownloadHeader(request, realFileName));
FileUtils.writeBytes(filePath, response.getOutputStream());
if (delete) {
FileUtils.deleteFile(filePath);
}
} catch (Exception e) {
log.error("下载文件失败", e);
}
}

首先调用了文件处理工具类的验证方法,验证文件名称是否合法。

这里是设置了指定文件名称格式。

方法实现

public static boolean isValidFilename(String filename)
{
return filename.matches(FILENAME_PATTERN);
}

其中参数为常量

public static String FILENAME_PATTERN = "[a-zA-Z0-9_\\-\\|\\.\\u4e00-\\u9fa5]+";

下面是对服务器上文件路径的获取

String filePath = RuoYiConfig.getDownloadPath() + fileName;

其中RuoyiConfig是配置类,用来读取项目相关配置,即配置在application.yml中的内容。

import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.stereotype.Component;

/**
* 读取项目相关配置
*
* @author ruoyi
*/
@Component
@ConfigurationProperties(prefix = "ruoyi")
public class RuoYiConfig
{
/** 项目名称 */
private String name;

/** 版本 */
private String version;

/** 版权年份 */
private String copyrightYear;

/** 实例演示开关 */
private boolean demoEnabled;

/** 上传路径 */
private static String profile;

/** 获取地址开关 */
private static boolean addressEnabled;

public String getName()
{
return name;
}

public void setName(String name)
{
this.name = name;
}

public String getVersion()
{
return version;
}

public void setVersion(String version)
{
this.version = version;
}

public String getCopyrightYear()
{
return copyrightYear;
}

public void setCopyrightYear(String copyrightYear)
{
this.copyrightYear = copyrightYear;
}

public boolean isDemoEnabled()
{
return demoEnabled;
}

public void setDemoEnabled(boolean demoEnabled)
{
this.demoEnabled = demoEnabled;
}

public static String getProfile()
{
return profile;
}

public void setProfile(String profile)
{
RuoYiConfig.profile = profile;
}

public static boolean isAddressEnabled()
{
return addressEnabled;
}

public void setAddressEnabled(boolean addressEnabled)
{
RuoYiConfig.addressEnabled = addressEnabled;
}

/**
* 获取头像上传路径
*/
public static String getAvatarPath()
{
return getProfile() + "/avatar";
}

/**
* 获取下载路径
*/
public static String getDownloadPath()
{
return getProfile() + "/download/";
}

/**
* 获取上传路径
*/
public static String getUploadPath()
{
return getProfile() + "/upload";
}
}

这里的getDownloadPath就是获取设置的下载路径的方法,方法具体实现

public static String getDownloadPath()
{
return getProfile() + "/download/";
}

就是返回profile这个节点

public static String getProfile()
{
return profile;
}

因为使用了@ConfigurationProperties(prefix = "ruoyi")

所以在对应的application.yml中获取profile就是获取ruoyi下的profile的值

SpringBoot+ElementUI实现通用文件下载请求(全流程图文详细教程)_文件名_02

 

这里配置的路径加上/download/再加上一个文件名就是服务器上要下载的模板文件的位置。

所以要提前将此文件放置在服务器上对应的位置。

这里服务器是我本地

 

然后对文件名进行一个添加时间戳的操作,防止多次下载重名问题。

然后设置响应编码、响应头、响应类型。

然后调用了文件工具类的输出文件到Byte数组的方法writeBytes

方法实现

/**
* 输出指定文件的byte数组
*
* @param filePath 文件路径
* @param os 输出流
* @return
*/
public static void writeBytes(String filePath, OutputStream os) throws IOException
{
FileInputStream fis = null;
try
{
File file = new File(filePath);
if (!file.exists())
{
throw new FileNotFoundException(filePath);
}
fis = new FileInputStream(file);
byte[] b = new byte[1024];
int length;
while ((length = fis.read(b)) > 0)
{
os.write(b, 0, length);
}
}
catch (IOException e)
{
throw e;
}
finally
{
if (os != null)
{
try
{
os.close();
}
catch (IOException e1)
{
e1.printStackTrace();
}
}
if (fis != null)
{
try
{
fis.close();
}
catch (IOException e1)
{
e1.printStackTrace();
}
}
}
}

以及下载文件名重新编码的方法setFileDownloadHeader

方法实现

 

/**
* 下载文件名重新编码
*
* @param request 请求对象
* @param fileName 文件名
* @return 编码后的文件名
*/
public static String setFileDownloadHeader(HttpServletRequest request, String fileName)
throws UnsupportedEncodingException
{
final String agent = request.getHeader("USER-AGENT");
String filename = fileName;
if (agent.contains("MSIE"))
{
// IE浏览器
filename = URLEncoder.encode(filename, "utf-8");
filename = filename.replace("+", " ");
}
else if (agent.contains("Firefox"))
{
// 火狐浏览器
filename = new String(fileName.getBytes(), "ISO8859-1");
}
else if (agent.contains("Chrome"))
{
// google浏览器
filename = URLEncoder.encode(filename, "utf-8");
}
else
{
// 其它浏览器
filename = URLEncoder.encode(filename, "utf-8");
}
return filename;
}

然后根据传递的参数是否删除模板文件,执行删除的工具类方法deleteFile

方法实现

/**
* 删除文件
*
* @param filePath 文件
* @return
*/
public static boolean deleteFile(String filePath)
{
boolean flag = false;
File file = new File(filePath);
// 路径为文件且不为空则进行删除
if (file.isFile() && file.exists())
{
file.delete();
flag = true;
}
return flag;
}

完整的文件操作工具类代码

package com.ruoyi.common.utils.file;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.io.OutputStream;
import java.io.UnsupportedEncodingException;
import java.net.URLEncoder;
import javax.servlet.http.HttpServletRequest;

/**
* 文件处理工具类
*
* @author ruoyi
*/
public class FileUtils
{
public static String FILENAME_PATTERN = "[a-zA-Z0-9_\\-\\|\\.\\u4e00-\\u9fa5]+";

/**
* 输出指定文件的byte数组
*
* @param filePath 文件路径
* @param os 输出流
* @return
*/
public static void writeBytes(String filePath, OutputStream os) throws IOException
{
FileInputStream fis = null;
try
{
File file = new File(filePath);
if (!file.exists())
{
throw new FileNotFoundException(filePath);
}
fis = new FileInputStream(file);
byte[] b = new byte[1024];
int length;
while ((length = fis.read(b)) > 0)
{
os.write(b, 0, length);
}
}
catch (IOException e)
{
throw e;
}
finally
{
if (os != null)
{
try
{
os.close();
}
catch (IOException e1)
{
e1.printStackTrace();
}
}
if (fis != null)
{
try
{
fis.close();
}
catch (IOException e1)
{
e1.printStackTrace();
}
}
}
}

/**
* 删除文件
*
* @param filePath 文件
* @return
*/
public static boolean deleteFile(String filePath)
{
boolean flag = false;
File file = new File(filePath);
// 路径为文件且不为空则进行删除
if (file.isFile() && file.exists())
{
file.delete();
flag = true;
}
return flag;
}

/**
* 文件名称验证
*
* @param filename 文件名称
* @return true 正常 false 非法
*/
public static boolean isValidFilename(String filename)
{
return filename.matches(FILENAME_PATTERN);
}

/**
* 下载文件名重新编码
*
* @param request 请求对象
* @param fileName 文件名
* @return 编码后的文件名
*/
public static String setFileDownloadHeader(HttpServletRequest request, String fileName)
throws UnsupportedEncodingException
{
final String agent = request.getHeader("USER-AGENT");
String filename = fileName;
if (agent.contains("MSIE"))
{
// IE浏览器
filename = URLEncoder.encode(filename, "utf-8");
filename = filename.replace("+", " ");
}
else if (agent.contains("Firefox"))
{
// 火狐浏览器
filename = new String(fileName.getBytes(), "ISO8859-1");
}
else if (agent.contains("Chrome"))
{
// google浏览器
filename = URLEncoder.encode(filename, "utf-8");
}
else
{
// 其它浏览器
filename = URLEncoder.encode(filename, "utf-8");
}
return filename;
}
}

 

 

举报

相关推荐

springboot实现excel文件下载

0 条评论