React JS使用API​​上传图像

Question

因此，我正在尝试使用React JS Ant设计上传组件上传文件，现在我面临的问题是，每当我尝试提交图像时，我都会收到以下错误：

访问'https://freeimage.host/api /1/upload'从原始''http：// localhost：3000'被CORS策略阻止：没有“访问control-wall-allow-origin”标题在请求的资源上存在。如果不透明的响应满足您的需求，请将请求模式设置为“无库”，以通过禁用CORS来获取资源。

我已经附上了我编写的代码上传和处理文件提交的代码。

​/I.sstatic.net/si1nb.png“ alt =”在此处输入图像描述”>

Answer 1

我将尝试将标题添加到您的Handlesubmission Arrow功能中的获取并串起身体。

fetch('https://freeimage.host/api/1/upload', {
  key: apiKey,
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(formData),
})

Answer 2

如果您使用后端作为 Node js，请添加以下代码

const cors = require("cors");
const corsOpts = {
origin: "*",
  credentials: true,
};

app.use(cors(corsOpts));