springboot+element-ui实现文件的上传下载

描述：
   文件上传：通过element-ui的完成文件的上传到服务端，并将文件的二进制数据存储到mysql。
   文件下载：查询mysql将文件二进制数据以流形式输出。

1. 上传
   进入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 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

2. 下载
   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 保存图片 至数据库 以及 从数据库读取 保存到本地