使用 Next Js 应用程序路由器、react hook forms、react dropzone 和路由处理程序上传多个数据（文本和图像上传）

问：

在我的 Next 13 Web 应用程序中，我希望经过身份验证的用户能够上传产品数据，其中包括一组字符串、数字、单个特色图片和一组产品图片。表单是使用 direction 的客户端组件。 由于我可以在服务器组件中使用表单提交，因此我必须以这种方式从客户端组件生成表单数据 ->路由处理程序（这样我就可以在请求中使用 cookie） -> Strapi 上传 api 和产品 apiuse client

1. 我已经能够成功地从反应放置区获取图像并将它们设置为 uploadedImage 状态。
2. 我已经能够将图像添加到提交处理程序中的 react hook 表单数据中，如下所示：

    const fd = new FormData();

    const { featuredImage, images, ...rest } = formData;

    Object.entries(rest).forEach(([key, value]) => {
      fd.append(key, value);
    });

    if (featuredImage) {
      const featuredImageData = images[featuredImage];
      fd.append("featuredImage", featuredImageData);
    }

    images.forEach((image) => {
      fd.append("images", image);
    });

    const response = await fetch("/api/createProduct", {
      method: "POST",
      body: fd,
    });

    const data = await response.json();
  };

现在，在文件中的路由处理程序中，我尝试像这样获取formData：/api/createProduct/route.js

export async function POST(request) {
const formData = await request.formData()

console.log('ROUTE formData', formData);

return Response.json({ status: 'done' })
  }

当我控制台.log表单数据时，我得到的只是：

ROUTE formData FormData {
  [Symbol(state)]: [
    { name: 'title', value: 'Bakabaka' },
    { name: 'price', value: '124' },
    { name: 'category', value: '1876' },
    { name: 'brand', value: '227' },
    { name: 'images', value: [File] },
    { name: 'images', value: [File] },
    { name: 'images', value: [File] },
    { name: 'images', value: [File] }
  ]

我不知道如何以 Strapi 理解的形式获取数据。我在网上到处搜索，但所有的解决方案都不起作用。有没有人有任何资源可以让我一步一步地清晰地概述？