FormData上传文件时后端收不到file字段怎么办？

问题大概率出在你手动设置了Content-Type头。

浏览器会自动给FormData设置正确的Content-Type，包含boundary参数。你要是手动写了 Content-Type: multipart/form-data，boundary就丢了，后端解析不了。

改一下就行：

const fileInput = document.querySelector('#avatar');

const file = fileInput.files[0];



if (!file) {

  console.log('没选文件');

  return;

}



const formData = new FormData();

formData.append('file', file);



// 别手动加Content-Type，让浏览器自己加

fetch('/upload.php', {

  method: 'POST',

  body: formData

  // 删掉 headers 里的 Content-Type

}).then(res => res.json()).then(console.log);

PHP端接收：

// 用 $_FILES，不是 $_POST

if (isset($_FILES['file'])) {

  $file = $_FILES['file'];

  // $file['tmp_name'] 是临时路径，$file['name'] 是原文件名

  move_uploaded_file($file['tmp_name'], './uploads/' . $file['name']);

  echo json_encode(['success' => true]);

}

还有个容易漏的点：fileInput.files[0] 可能是undefined，确认下用户真的选了文件再append。

如果用的是axios，axios会自动处理，但fetch得注意别手动改Content-Type。

问题应该出在fetch请求的配置上。我遇到过好几次类似情况，都是因为fetch默认不会自动设置Content-Type的boundary参数，导致后端无法正确解析multipart数据。

试试这样改：

const fileInput = document.querySelector('#avatar');

const formData = new FormData();

formData.append('file', fileInput.files[0]);



fetch('/upload.php', {

  method: 'POST',

  body: formData,

  headers: {

    // 这行是关键，让浏览器自动设置完整的Content-Type

    'Content-Type': 'multipart/form-data'

  }

});

或者更简单点，直接把headers那部分去掉也行，因为FormData对象会自动处理这些。我之前就被这个坑过，明明觉得都写对了却死活传不上去，后来发现是fetch太"智能"了。

另外记得检查下后端PHP的配置，确保upload_max_filesize和post_max_size够大，不然文件大了也传不上去。