关于表单中`enctype`的用法

一、使用 enctype="multipart/form-data" 和未使用的区别：

1. 数据提交方式：

   • enctype="multipart/form-data"：使用这个属性时，表单数据会以多部分（multipart）方式进行提交。这种方式适用于包含文件上传的表单提交。
   • 未使用 ：表单数据以默认的方式进行提交，即 application/x-www-form-urlencoded，适用于普通的文本字段提交。

2. 数据格式：

   • enctype="multipart/form-data"：多部分提交方式适用于带有文件上传的表单，能够支持文件和二进制数据的上传，如上传图片、文件等。
   • 未使用：默认的表单提交方式适用于普通文本字段的提交，例如输入框中的文本内容。

二、在前后端如何使用（使用ssm框架时）

 1、引入文件上传依赖：

<!-- 文件上传依赖 -->
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.4</version>
</dependency>
<dependency>
    <groupId>commons-io</groupId>
    <artifactId>commons-io</artifactId>
    <version>2.11.0</version>
</dependency>

2、SpringMVC核心配置：文件上传解析器multipartResolver

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <!-- 配置最大上传文件大小为 10 MB -->
    <property name="maxUploadSize" value="10MB" />
</bean>

属性解释：若不设置`maxUploadSize`，则默认不限制上传的文件大小

3、前端代码（HTML页面）：

<form action="/upload" method="post" enctype="multipart/form-data">
  <!-- 文件上传输入框 -->
  <input type="file" name="file" id="fileInput" required>
  
  <!-- 其他表单字段 -->
  <input type="text" name="name" placeholder="Name" required>

  <!-- 提交按钮 -->
  <button type="submit">Upload</button>
</form>

4、后端代码

@Controller
public class FileUploadController {

    @RequestMapping(value = "/upload", method = RequestMethod.POST)
    @ResponseBody
    public String handleFileUpload(@RequestParam("file") MultipartFile file,
                                   @RequestParam("name") String name) throws IOException {
        // 处理上传的文件
        if (!file.isEmpty()) {
            // 获取文件名
            String fileName = file.getOriginalFilename();
            // 保存文件到指定目录
            String uploadDir = "/path/to/upload/directory";
            saveFile(file, fileName, uploadDir);
        }

        // 其他后续处理逻辑...

        return "File uploaded successfully!";
    }

    private void saveFile(MultipartFile file, String fileName, String uploadDir) throws IOException {
        File dir = new File(uploadDir);
        if (!dir.exists()) {
            dir.mkdirs();
        }

        File targetFile = new File(uploadDir, fileName);
        file.transferTo(targetFile);
    }
}