[SpringBoot+Html]实现简单的文件上传并存储至本地，含前后端代码

后端SpringBoot代码：




import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
 
import java.io.File;
import java.io.IOException;
import java.nio.file.Paths;
 
@RestController
public class FileUploadController {
 
    @PostMapping("/upload")
    public String handleFileUpload(@RequestParam("file") MultipartFile file) {
        if (file.isEmpty()) {
            return "文件为空，请选择有效文件上传。";
        }
        try {
            String uploadDirectory = System.getProperty("user.dir") + "/uploads/";
            File directory = new File(uploadDirectory);
            if (!directory.exists()) {
                directory.mkdirs();
            }
            String filePath = uploadDirectory + file.getOriginalFilename();
            file.transferTo(Paths.get(filePath));
            return "文件上传成功：" + filePath;
        } catch (IOException e) {
            e.printStackTrace();
            return "文件上传失败：" + e.getMessage();
        }
    }
}

前端HTML和JavaScript代码：




<!DOCTYPE html>
<html>
<head>
    <title>文件上传示例</title>
</head>
<body>
    <form id="uploadForm" enctype="multipart/form-data">
        <input type="file" name="file" id="file" />
        <button type="button" onclick="uploadFile()">上传文件</button>
    </form>
 
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script>
        function uploadFile() {
            var formData = new FormData($('#uploadForm')[0]);
            $.ajax({
                url: '/upload',
                type: 'POST',
                data: formData,
                contentType: false,
                processData: false,
                success: function(response) {
                    alert(response);
                },
                error: function() {
                    alert('文件上传失败');
                }
            });
        }
    </script>
</body>
</html>

在这个例子中，前端使用HTML定义了一个文件上传表单，并通过JavaScript使用FormData对象和Ajax请求发送文件到后端。后端SpringBoot应用通过@RestController和@PostMapping注解处理文件上传请求，并保存文件到服务器的uploads目录下。

[SpringBoot+Html]实现简单的文件上传并存储至本地，含前后端代码

评论已关闭

推荐阅读