Flutter 在发布 PNG 文件时收到来自 Fastapi 的 422 响应

Question

我已经用 FastAPI 创建了一个可用的本地主机 API。当我单击 FastAPI 生成的文档中的 'try it out' 按钮时，POST 接受一个 PNG，进行一些图像处理和 returns 一个 PNG ： curl post命令显示如下：

curl -X 'POST' \
  'http://localhost:8345/api/predict' \
  -H 'accept: application/json' \
  -H 'Content-Type: multipart/form-data' \
  -F 'file=@test_img.png;type=image/png'

已成功从图像选择器库中检索到图像文件。（其中 image1 对象已在应用程序页面的 class.

中初始化为 File image1;

Future getImage() async {
    var imageTmp = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      image1 = imageTmp;
      print('Image Path $image1');
    });
  }

我尝试在 Flutter 中使用以下函数模拟 API 调用。

  doUpload() {
    /*
    curl -X 'POST' \
  'http://192.168.178.26:8345/api/predict' \
  -H 'accept: application/json' \
  -H 'Content-Type: multipart/form-data' \
  -F 'file=@test_img.png;type=image/png'

     */
    var request = http.MultipartRequest(
      'POST',
      Uri.parse("http://<my locally hosted ip>:8345/api/predict"),
    );
    Map<String, String> headers = {"Content-type": "multipart/form-data"};
    request.files.add(
      http.MultipartFile(
        'image',
        image1.readAsBytes().asStream(),
        image1.lengthSync(),
        filename: 'filename',
        contentType: MediaType('image', 'png'),
      ),
    );
    request.headers.addAll(headers);
    print("request: " + request.toString());
    request.send().then((value) => print(value.statusCode));
  }

当我运行 doUpload()函数时，一个POST成功发送到本地主机API，但是它returns一个422错误'unprocessable entity'。我尝试了什么：

我尝试将doUpload中的图像类型设置为jpg、jpeg，但我一直收到422错误。
我试着查找 image_picker 应该存储临时文件的位置，看看它是否存储正确，但是当我查看生成的文件路径时，我没有看到实际的文件和 tmp 文件夹: 文件路径：File: '/data/user/0/<my package name>/cache/image_picker3300408791299772729jpg'

查看我的本地 UI 文件路径，我看到：

它没有显示名为缓存的文件夹，所以我不能这样检查它。但是图片选择器保存的最后是一个jpg（不是.jpg，这正常吗？）

我也尝试将此调试器功能添加到我的 fastAPI server.py，但我不确定如何检查当前 flutter 代码中的结果数据： https://fastapi.tiangolo.com/tutorial/handling-errors/#use-the-requestvalidationerror-body 结果 value 具有 statusCode 和 reason 等属性，但我没有看到完整的 json 输出选项。

Answer 1

要准确模仿 curl 命令，请使用：（为简单起见，我使用了方便的构造函数）

  final request = http.MultipartRequest(
    'POST',
    Uri.parse('http://<my locally hosted ip>:8345/api/predict'),
  );

  request.files.add(
    await http.MultipartFile.fromPath(
      'file', // NOTE - this value must match the 'file=' at the start of -F
      image1.path,
      contentType: MediaType('image', 'png'),
    ),
  );

  final response = await http.Response.fromStream(await request.send());

  print(response.body);

Flutter 在发布 PNG 文件时收到来自 Fastapi 的 422 响应

Flutter receives 422 response from Fastapi when posting a PNG file

http-post

dart

flutter

flutter-image

fastapi