文件上传 React Fetch 到 ExpressJS 服务器“失败”，即使上传成功

Question

有一个我无法解决的错误，希望有人能提供帮助。

我有一个 React 模块，它对文件执行以下操作：

async function uploadFile(file, typeSent) {
        console.log("SENT FILE:")
        console.log(file)
        let formInfo = new FormData();
        formInfo.append("file", file)
        formInfo.append("name", file.name)

        const requestOptions2 = {
            method: "POST",
            body: formInfo,
            redirect: "follow"
        };

        console.log("ATTEMPTING UPLOAD:")
        await fetch("https://blah.herokuapp.com/upload-files", requestOptions2)
            .then((response) => response.json())
            .then((response) => {
                console.log("UPLOAD RESULT: ")
                console.log(response)
            })
            .catch((error) => {
                console.log("Upload error?")
                console.error(error)
            });
}

这样就成功将文件发送到服务器了，服务器有一个非常简单的axios函数来上传文件：

await axios(config)
            .then(function (response) {
                console.log(JSON.stringify(response.data));
                res.status(200).send({response: response.data})
            })
            .catch(function (error) {
                console.log(error);
                res.status(400).send({errormsg: error.message})
            });

这一切都有效，服务器上传图像并返回响应，但是在 React 模块中执行该提取时，它立即出错并提供以下错误：

TypeError: Failed to fetch
    at main.js:2:553951
    at c (main.js:2:543956)
    at Generator._invoke (main.js:2:543709)
    at Generator.next (main.js:2:544319)
    at mu (main.js:2:549193)
    at i (main.js:2:549397)
    at main.js:2:549458
    at new Promise (<anonymous>)
    at main.js:2:549337
    at te (main.js:2:554346)

这并没有太大帮助，因为它被 webpack 最小化了。文件仍在上传，但实际响应再也不会点击 React，这使得“不可能”实际使用从服务器返回的响应......

所以，我想知道是否有人可以让我知道我错过了什么/有一个高级时刻。

感谢您的帮助！

Answer 1

事实证明这是一个 CORS 错误，正如 GitHub 上的 orengatigno 所发现的那样

https://github.com/axios/axios/issues/4420