在Flutter中发起HTTP POST请求时收到404响应，我遗漏了什么？

以下是针对你遇到的文件上传404问题，结合代码列出的常见遗漏点和修正建议：

• 请求URL拼接错误
  检查baseUrl与url拼接后的完整地址是否符合后端接口路径：

  • 注意斜杠是否缺失，比如baseUrl为https://api.example.com，url为upload时，拼接后会变成https://api.example.comupload，需手动补全斜杠为$baseUrl/$url
  • 打印uri.toString()获取最终请求地址，直接在Postman或浏览器中测试该地址是否可访问，确认后端接口路径是否与你使用的一致

• 手动覆盖Multipart请求头导致的问题
  你手动添加的content-Type: multipart/form-data会覆盖系统自动生成的带boundary的请求头，而Multipart请求必须依赖boundary才能被后端正确解析。必须删除这行手动设置的头，http.MultipartRequest会自动生成符合规范的Content-Type头。

• Authorization头格式错误
  多数后端要求Authorization头带Bearer 前缀，如果你的userToken是纯字符串，需修改为：

  HttpHeaders.authorizationHeader: 'Bearer $userToken'
  

  若格式不正确，部分后端会将未授权请求返回404而非401。

• 表单字段名不匹配
  确认imageUploadLocation参数是否与后端接口要求的表单字段名完全一致（比如后端要求字段名为file，你传的是image），字段名不匹配可能导致后端无法识别请求，进而返回404。

• 文件路径冗余处理
  File(fileLocation.path).path等价于fileLocation.path，直接使用fileLocation.path即可，避免多余处理可能引发的路径错误。

修正后的代码示例 #

Future<dynamic> uploadFile({
  required XFile fileLocation,
  required String userToken,
  required String url,
  required String imageUploadLocation,
}) async {
  // 注意补全斜杠，避免URL拼接错误
  Uri uri = Uri.parse("$baseUrl/$url");
  String filePath = fileLocation.path;
  var request = http.MultipartRequest('POST', uri);

  request.files.add(await http.MultipartFile.fromPath(imageUploadLocation, filePath));
  // 修正Authorization头格式，移除手动设置的content-type
  request.headers.addAll({
    HttpHeaders.authorizationHeader: 'Bearer $userToken',
  });

  http.StreamedResponse response = await request.send();

  return handleError(response);
}

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