手把手教你入门vue+springboot开发（二十）--文件上传下载

前言

从去年10月份到12月底一直在参加阿里第六届数据库比赛，今年1，2月份又是春节假期，所以有5个月时间没有更新vue+springboot这个专题了，后续会继续跟大家一起学习研究。在业务开发场景中文件上传下载是个常用的基本功能，在C/S模式下我们一般使用ftp、tftp等文件传输服务器来实现。在vue+springboot的B/S模式下，如果传输的文件不大就没有必要使用文件传输服务器了，可以直接使用HTTP协议实现。本篇我们将通过一个简单的文件传输页面实例来研究一下HTTP协议如何实现文件传输，供大家参考。

一、接口定义

1.编码格式

multipart/form-data格式优点：
文件上传：支持上传单个或多个文件。
混合数据：可以同时传输文本字段和二进制文件。
大文件传输：适合传输大文件，因为它会将数据分块（multipart）传输。

2.下载文件

2.1、基本信息
请求路径：/file/download/{filename}
请求方式：GET
接口描述：该接口用于下载文件
2.2、请求参数
请求参数格式：x-www-form-urlencoded
请求参数说明：

请求数据样例：
path=E:\\file_test(windows系统)
path=/usr/local/file_test(linux系统)
2.3、响应数据
直接返回文件内容，二进制数据格式。

3.上传文件

3.1、基本信息
请求路径：/file/upload
请求方式：POST
接口描述：该接口用于上传文件
3.2、请求参数
请求参数格式：multipart/form-data
请求参数说明：

3.3、响应数据
响应数据类型：application/json
响应参数说明：

响应数据样例：
{
“code”: 0,
“message”: “文件上传成功”,
“data”: null
}

二、springboot后端实现

controller目录增加FileController类，实现上述接口，处理前端文件上传下载请求。

package com.example.demo.controller;

import com.example.demo.pojo.Result;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;

@RestController
@RequestMapping("/file")
public class FileController {
   
   
    @GetMapping("/download/{filename}")
    public @ResponseBody byte[] downloadFile(@PathVariable String filename, String path)  throws IOException {
   
   
        String filepath = path + "\\" + filename;
        System.out.print