console.log有文件内容但Laravel后端请求对象获取文件为空

后端无法获取文件的核心问题出在前端请求构造逻辑上：

• 你直接把File类型的文件对象塞进普通JS对象传给axios，axios默认会将普通JS对象序列化为application/json格式发送，而JSON格式本身不支持二进制文件内容传输。哪怕控制台能打印出data对象上挂载的文件实例，实际请求传输过程中文件内容根本没有被正确编码发送到后端。
• 你写的form标签encType="multipart/form-data/"末尾多了冗余斜杠，本身写法不规范，而且因为你用e.preventDefault()拦截了原生表单提交、手动用axios发请求，这个标签属性实际上根本没有生效。

修改前端提交逻辑 #

把handleSubmit方法里构造请求参数的逻辑替换为FormData实现，不要手动设置Content-Type请求头，让axios自动识别FormData类型、自动生成带boundary分隔符的合法请求头，手动设置头反而会丢失分隔符导致后端解析失败：

const handleSubmit = (e) => {
    e.preventDefault();

    // 用FormData承载所有请求参数，支持二进制文件传输
    const data = new FormData();
    data.append('name', name);
    data.append('email', email);
    data.append('file', fileContent);
    data.append('messageText', messageText);

    // 验证FormData内容可以用data.get('file')查看，直接打印FormData实例看不到内部参数是正常现象
    const headers = {
        "Accept": 'application/json'
    };

    axios.post('http://127.0.0.1:8000/api/support', data, {headers})
        .then(resp => {
            console.log(resp);
        }).catch(error => {
        const errorMessage = error.response.data.message;
        const errorStatus  = error.response.status;
        setErrorMessage(errorMessage);
        setErrorStatus(errorStatus);
    });
};

修正表单属性（可选，规范写法） #

把form标签的enctype属性拼写修正，去掉末尾多余的斜杠：

<form onSubmit={handleSubmit} method="POST" encType="multipart/form-data">

后端逻辑无需调整 #

前端改完之后，原有$request->file('file')代码就可以正常获取到上传的文件实例，不要用$request->get('file')取上传文件，该方法仅能获取普通文本表单字段，无法正确解析文件上传内容。

排查提示：如果你的axios做了全局配置，默认给所有请求加了Content-Type: application/json请求头，需要针对该接口跳过这个默认配置，否则FormData请求依旧会被错误编码。

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