如何通过XMLHttpRequest将HTML中的音视频文件传入Java Servlet并获取？

我来帮你一步步搞定这个问题——从前端用XMLHttpRequest传文件，到Java Servlet接收并转为File对象处理，整个流程很清晰：

1. 前端：用XMLHttpRequest构建文件上传请求 #

首先得确保前端正确发送文件，这里需要用FormData来封装文件，再通过XHR发送POST请求：

HTML部分 #

<input type="file" id="fileInput" accept="image/*,video/*">
<button onclick="uploadFile()">上传文件</button>

JavaScript部分 #

function uploadFile() {
    const fileInput = document.getElementById('fileInput');
    const selectedFile = fileInput.files[0];
    
    if (!selectedFile) {
        alert('请先选择文件');
        return;
    }

    // 用FormData封装文件，key要和Servlet中获取的参数一致
    const formData = new FormData();
    formData.append('uploadedFile', selectedFile);

    const xhr = new XMLHttpRequest();
    xhr.open('POST', '/uploadServlet', true); // 替换成你的Servlet路径

    xhr.onload = function() {
        if (xhr.status === 200) {
            console.log('上传结果：', xhr.responseText);
            alert('上传成功！');
        } else {
            console.error('上传失败，状态码：', xhr.status);
            alert('上传失败，请重试');
        }
    };

    xhr.onerror = function() {
        console.error('请求出错');
        alert('请求出错，请检查网络');
    };

    xhr.send(formData);
}

2. 后端Servlet：接收文件并转为File对象 #

Servlet 3.0及以上版本提供了Part API来处理文件上传，核心步骤如下：

第一步：给Servlet添加@MultipartConfig注解 #

这个注解是处理multipart请求的关键，必须加上，还可以配置文件大小限制：

import javax.servlet.annotation.MultipartConfig;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.Part;
import java.io.File;
import java.io.IOException;

@WebServlet("/uploadServlet")
@MultipartConfig(
    fileSizeThreshold = 1024 * 1024 * 2, // 当文件超过2MB时，先写到临时文件
    maxFileSize = 1024 * 1024 * 10,      // 单个文件最大10MB
    maxRequestSize = 1024 * 1024 * 50    // 整个请求最大50MB
)
public class UploadServlet extends HttpServlet {

第二步：在doPost方法中接收并处理文件 #

@Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException {
        // 设置编码，避免文件名乱码
        request.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=UTF-8");

        // 获取上传的文件Part（参数名要和前端FormData的key一致）
        Part filePart = null;
        try {
            filePart = request.getPart("uploadedFile");
        } catch (Exception e) {
            response.getWriter().write("获取文件失败：" + e.getMessage());
            return;
        }

        if (filePart == null || filePart.getSize() == 0) {
            response.getWriter().write("未检测到上传的文件");
            return;
        }

        // 获取原始文件名
        String originalFileName = filePart.getSubmittedFileName();
        // 定义文件保存目录（比如项目下的uploads文件夹）
        String saveDirPath = getServletContext().getRealPath("/uploads");
        File saveDir = new File(saveDirPath);
        
        // 如果目录不存在，创建目录
        if (!saveDir.exists()) {
            boolean isCreated = saveDir.mkdirs();
            if (!isCreated) {
                response.getWriter().write("创建保存目录失败");
                return;
            }
        }

        // 创建目标File对象
        File targetFile = new File(saveDir, originalFileName);

        // 将Part中的文件内容写入到目标File
        try {
            filePart.write(targetFile.getAbsolutePath());
            response.getWriter().write("文件上传成功，保存路径：" + targetFile.getAbsolutePath());
            
            // 这里就可以用targetFile进行后续处理了，比如读取文件内容、移动文件等
            // 示例：打印文件大小
            System.out.println("上传文件大小：" + targetFile.length() + "字节");
        } catch (Exception e) {
            response.getWriter().write("写入文件失败：" + e.getMessage());
        }
    }
}

3. 关键注意事项 #

• Servlet版本要求：必须使用Servlet 3.0及以上版本（对应Java EE 6+），否则不支持@MultipartConfig和Part API
• 文件名乱码：一定要设置request.setCharacterEncoding("UTF-8")，同时确保前端页面的编码也是UTF-8
• 权限问题：要确保Servlet容器（比如Tomcat）对保存目录有读写权限，否则会写入失败
• 临时文件清理：如果设置了fileSizeThreshold，容器会生成临时文件，默认会自动清理，但也可以手动配置临时目录
• 重名文件处理：如果需要避免文件名重复，可以给文件名加上时间戳或随机字符串，比如System.currentTimeMillis() + "_" + originalFileName

内容的提问来源于stack exchange，提问作者MBJH