Flutter调用本地FastAPI上传图片转SVG，确认请求实现是否正确

整体来说，你选择Multipart方式上传图片的思路是完全正确的，这确实是FastAPI处理文件上传的标准方式。不过代码里存在几处细节问题和未完成的逻辑，下面逐一说明：

Flutter端代码问题与修正 #

1. API路径不匹配：FastAPI的路由是/convert/（末尾带斜杠），但你Flutter里写的是http://localhost/convert，FastAPI默认会重定向带斜杠的路由，但可能导致额外的请求开销，建议统一为带斜杠的路径：

   String apiUrl = 'http://localhost/convert/';
   

2. 错误处理优化：可以在非200状态时打印响应体，方便排查API返回的具体错误信息：

   } else {
     print('API错误详情: ${response.body}');
     throw Exception('Error al convertir la imagen');
   }
   

修正后的Flutter代码：

Future uploadImage() async {
  if (_image == null) return;
  String apiUrl = 'http://localhost/convert/';
  var request = http.MultipartRequest('POST', Uri.parse(apiUrl))
    ..files.add(await http.MultipartFile.fromPath('file', _image!.path));

  try {
    var streamedResponse = await request.send();
    var response = await http.Response.fromStream(streamedResponse);
    if (response.statusCode == 200) {
      var jsonResponse = json.decode(response.body);
      setState(() {
        _imageUrl = jsonResponse['url'];
      });
    } else {
      print('API错误详情: ${response.body}');
      throw Exception('Error al convertir la imagen');
    }
  } catch (e) {
    print(e);
  }
}

FastAPI端代码问题与修正 #

你的API代码有几个关键的未完成部分和冗余项：

1. 冗余参数：request: Request参数没有被使用，可以直接移除。
2. 缺少文件保存逻辑：只是定义了文件路径，但没有把上传的文件内容写入到本地，需要添加文件读写操作来保存文件。
3. 缺少SVG转换逻辑：代码里只定义了输出路径，但没有实际执行转换操作（比如使用Pillow或其他图像转换库）。
4. 缺少响应返回：Flutter端在等待包含url字段的JSON响应，你需要在函数末尾返回对应的结果。

另外，记得导入必要的依赖模块。

修正后的FastAPI代码示例（包含基础的文件保存和响应返回，转换逻辑需要你根据实际使用的库补充）：

from fastapi import FastAPI, File, UploadFile, HTTPException
import os

app = FastAPI()

input_dir = "input_images"
output_dir = "output_images"

os.makedirs(input_dir, exist_ok=True)
os.makedirs(output_dir, exist_ok=True)

@app.post("/convert/")
async def convert_image(file: UploadFile = File(...)):
    if file.content_type not in ["image/jpg", "image/png", "image/jpeg"]:
        raise HTTPException(status_code=400, detail="Archivo no soportado. Solo se aceptan imágenes JPEG o PNG.")

    filename = os.path.basename(file.filename)
    input_path = os.path.join(input_dir, filename)
    # 保存上传的图片到本地
    with open(input_path, "wb") as f:
        f.write(await file.read())
    
    # --- 这里添加你的SVG转换逻辑 ---
    # 示例：假设你用某个库完成转换，生成output_path的SVG文件
    output_filename = f"{os.path.splitext(filename)[0]}.svg"
    output_path = os.path.join(output_dir, output_filename)
    # 比如：convert_image_to_svg(input_path, output_path)
    
    # 返回Flutter端需要的URL（这里假设是本地可访问的路径，你可以根据实际部署情况调整）
    return {"url": f"/{output_dir}/{output_filename}"}

额外注意事项 #

• 确保Flutter设备能访问到FastAPI服务：如果是Android模拟器，需要把localhost换成10.0.2.2；iOS模拟器可以直接用localhost。
• 转换SVG的逻辑需要你自行实现，可以参考Pillow（处理图像）+svglib或其他专门的图像转SVG库。

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