Flutter Dio：将图像上传到服务器失败

Question

首先，我先在 Postman 中尝试，它的工作。

之后，我创建了我的 dio 函数来像这样上传到服务器。

Future<AttendanceResponse> checkOut(
    String timeOfCheckout,
    File image,
    String notes,
  ) async {
    try {
      String fileName = image.path.split('/').last;
      print("Image name --> $fileName");
      print("Image path --> ${image.path}");
      final formData = FormData.fromMap({
        "out": timeOfCheckout,
        "out_picture": await MultipartFile.fromFile(
          image.path,
          filename: fileName,
        ),
        "out_note": notes,
        "late": 0,
      });
      final response = await dio.post("attendances/check-out", data: formData);
      return AttendanceResponse.fromJson(response.data);
    } on DioError catch (e) {
      return e.error;
    }
  }

但得到如下错误。

Dio Response Error --> DioError [DioErrorType.RESPONSE]: Http status error [302]

这是来自相机的文件和路径。

I/flutter ( 2163): Image name --> scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg
I/flutter ( 2163): Image path --> /storage/emulated/0/Android/data/id.cometdev.bozzetto.dev/files/Pictures/scaled_32592bd5-704d-4e0a-9976-9ea94c667f7d4583818212866102164.jpg

我已经在谷歌上搜索并阅读了 dio 的文档并按照它进行操作，但仍然会出现此错误。

Answer 1

这是我的错，我忘记在我的 dio 函数中添加 token。

Future<AttendanceResponse> checkOut(
    String timeOfCheckout,
    File image,
    String notes,
  ) async {
    try {
      var fileName = image.path.split('/').last;
      var token = await prefHelper.getToken();
      print("Token --> $token");

      var headers = {
        'content-type': 'application/json',
        'accept': 'application/json',
        'authorization': 'Bearer $token',
      };

      final formData = FormData.fromMap({
        "out": timeOfCheckout,
        "out_picture": await MultipartFile.fromFile(
          image.path,
          filename: fileName,
        ),
        "out_note": notes,
        "late": 0,
      });
      final response = await dio.post("attendances/check-out",
          data: formData, options: Options(method: "POST", headers: headers));
      return AttendanceResponse.fromJson(response.data);
    } on DioError catch (e) {
      return e.error;
    }
  }

Answer 2

您需要在表单数据中添加contentType 属性。它看起来像这样，

  final formData = FormData.fromMap({
    "out": timeOfCheckout,
    "out_picture": await MultipartFile.fromFile(
        image.path, 
        filename: fileName,
        contentType: new MediaType("image", "jpeg"), // Here we add the content type!
     ),
    "out_note": notes,
    "late": 0,
  });