You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Nuxt3 Multipart Form Data图片上传失败,RapidAPI可正常上传求助

图片上传服务器失败,但RapidAPI可正常上传,求排查问题

我无法将图片上传至服务器,但使用RapidAPI上传同一张图片却能正常工作,请问我哪里操作有误?

QuillEditor代码

<template>
  <QuillEditor :modules="modules" :toolbar="toolbar" theme="snow" toolbar="full" />
</template>

<script>
import { QuillEditor } from '@vueup/vue-quill'
import '@vueup/vue-quill/dist/vue-quill.snow.css';
import ImageUploader from "quill-image-uploader";
const runtimeConfig = useRuntimeConfig();
const { fetch } = useSmartFetch();

export default {
  setup: () => {
    const toolbar = [
      ['image', 'link'],
      ['emoji']
    ];
    const modules = {
      name: "imageUploader",
      module: ImageUploader,
      options: {
        upload: (file) => {
          return new Promise(async (resolve, reject) => {
            const formData = new FormData()
            formData.append('image', file);

            console.log(file)
            console.log(formData)

            const authStore = useAuthStore()
            const response = await $fetch(runtimeConfig.public.api.image.upload, {
              method: 'POST',
              body: formData,
              headers: {
                'Authorization': 'Bearer ' + authStore.accessToken,
                'Content-Type': 'multipart/form-data'
              }
            })


          });
        },
      },
    };

    return { toolbar, modules };
  },
  components: {
    QuillEditor,
  },
};
</script>

请求相关信息

  • 已设置Bearer token用于认证(否则会返回401而非当前的422),同时手动设置了Content-Type: multipart/form-data
  • 前端开发者控制台显示请求载荷包含表单数据,开头内容如下:
-----------------------------118964521239883964394155378140
Content-Disposition: form-data; name="image"; filename="1705385217523.jpg"
Content-Type: image/jpeg
...
  • 但Laravel Telescope中显示请求载荷为空
  • 使用RapidAPI执行完全相同的上传操作时,请求正常,后端能正确接收载荷数据

更新:补充开发者控制台截图信息

  • OPTIONS预检请求返回204,请求头包含Origin、Access-Control-Request-Method等CORS相关字段
  • POST请求返回422,请求头包含Authorization、Content-Type等字段,Payload部分显示存在form-data内容,但后端仍无法接收

我确定后端没问题(已通过RapidAPI测试验证),也认为自己的请求配置是正确的,有人能帮我解决这个问题吗?

顺颂时祺


内容的提问来源于stack exchange,提问作者Jan

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.25 03:37:13