描述：
文件上传：通过element-ui的<el-upload>完成文件的上传到服务端，并将文件的二进制数据存储到mysql。
文件下载：查询mysql将文件二进制数据以流形式输出。
- 上传
进入element-ui官方，找到Upload 上传组件，找第一个案例，点击在线运行，如下：
2.png
修改代码，添加自己预先定义好的上传接口，如下：
1.png
springboot后台代码，如下：
@RestController
@RequestMapping("/file")
@CrossOrigin //必须要加跨域请求注解
public class FileController {
@Autowired
private JdbcTemplate jdbc; //spring-jdbc
@RequestMapping("/upload")
public String upload(MultipartFile file) throws IOException {
String fileName = file.getOriginalFilename();
long size = file.getSize();
String type = fileName.substring(fileName.lastIndexOf(".") + 1);
//读取文件二进制存储到数据库，mysql字段类型longblob
byte[] buffer = file.getBytes();
final Map map = new HashMap<String, Integer>();
String uuid = UUID.randomUUID().toString().replace("-","");
String sql = "insert into files(id,name,size,type,data) values(?,?,?,?,?)";
final LobHandler lobHandler = new DefaultLobHandler();
jdbc.execute(sql, new AbstractLobCreatingPreparedStatementCallback(lobHandler) {
@Override
protected void setValues(PreparedStatement ps, LobCreator lobCreator) throws SQLException, DataAccessException {
ps.setString(1,uuid);
ps.setString(2,fileName);
ps.setDouble(3,size);
ps.setString(4,type);
lobCreator.setBlobAsBytes(ps,5,buffer);
}
});
//常规的存储到本项目files文件夹中
// OutputStreamWriter osw =
// new OutputStreamWriter(new FileOutputStream("./files/"+fileName));
// InputStreamReader isr =
// new InputStreamReader(file.getInputStream());
// char[] bytes = new char[12];
// while (isr.read(bytes) != -1){
// osw.write(bytes);
// }
// try{
// osw.close();
// isr.close();
// }catch (IOException e){
// e.printStackTrace();
// }
return null;
}
}
mysql表结构如下：
3.png
- 下载
springboot后台代码如下：
@RestController
@RequestMapping("/file")
@CrossOrigin
public class FileController {
@Autowired
private JdbcTemplate jdbc;
@RequestMapping("/down")
public String downLoad(HttpServletResponse response) throws Exception {
//第一种常规的从本地读取文件输出到response
// String filePath = "D:/图片资料/綦江人民政府.png";
// File file = new File(filePath);
// if (file.exists()){
// response.setContentType("application/vnd.ms-excel;charset=UTF-8");
// response.setCharacterEncoding("UTF-8");
// response.setHeader("Content-Disposition", "attachment;fileName=" + java.net.URLEncoder.encode("綦江人民政府.png","UTF-8"));
// byte[] buffer = new byte[1024];
//
// FileInputStream fis = null;
// BufferedInputStream bis = null;
// OutputStream os = null;
// try{
// os = response.getOutputStream();
// fis = new FileInputStream(file);
// bis = new BufferedInputStream(fis);
// int i = bis.read(buffer);
// while (i != -1){
// os.write(buffer);
// i = bis.read(buffer);
// }
// }catch (Exception e){
// e.printStackTrace();
// }
// try {
// bis.close();
// fis.close();
// }catch (IOException e){
// e.printStackTrace();
// }
// }
// 第二种读取数据库二进制数据输出
response.setContentType("application/vnd.ms-excel;charset=UTF-8");
OutputStream os = response.getOutputStream();
response.setCharacterEncoding("UTF-8");
final LobHandler lobHandler = new DefaultLobHandler();
String sql ="select name,data from files where id = '21d2caa89e1e4e2f8d3e422741f0d29d'";
jdbc.query(sql, new AbstractLobStreamingResultSetExtractor() {
@Override
protected void streamData(ResultSet resultSet) throws SQLException, IOException, DataAccessException {
String fileName = lobHandler.getClobAsString(resultSet,1);
response.setHeader("Content-Disposition", "attachment;fileName=" + java.net.URLEncoder.encode(fileName,"UTF-8"));
InputStream is = lobHandler.getBlobAsBinaryStream(resultSet, 2);
if (is != null) FileCopyUtils.copy(is,os);
}
});
try {
os.close();
}catch (IOException e){
e.printStackTrace();
}
return null;
}
}
参考：
SpringBoot实现文件的上传和下载
SpringBoot+element-ui进行文件上传
使用jdbcTemplate 保存图片 至数据库 以及 从数据库读取 保存到本地
