Django/React/Firebase - 上传大文件时出现 CORS 错误

Posted 2023-02-21

【中文标题】Django/React/Firebase - 上传大文件时出现 CORS 错误

【英文标题】：Django/React/Firebase - CORS error when uploading big files

【发布时间】：2022-01-23 21:07:00

【问题描述】：

我有一个网站，React 托管在 Firebase 上，后端使用 Django，在带有 nginx 的服务器上运行。

在这个网站上，我有一个表单，用户最多可以上传 3 张图片。在我的本地 PC 上它工作正常，但在生产环境中，当我尝试上传大文件（超过 5mb）时出现此错误：

A server/network error occurred. Looks like CORS might be the problem. Sorry about this - we will get it fixed shortly.

现在的问题是图像可以正常上传，当我在网站管理区域检查提交的表单时可以看到它们，但是在前端，提交表单后，我收到的是错误消息，而不是成功消息。

我已经增加了 nginx client_max_body_size 15M，但我仍然收到错误。

但考虑到图片确实会上传，我认为最大身体尺寸不是问题。

【参考方案1】：

我发现了问题！这是一个非常愚蠢的事情，但我之前没有注意到。

基本上我有这个

        const instance = axios.create(
            baseURL: baseURL,
            timeout: 5000,
            headers: 
                Authorization: accessToken
                    ? 'JWT ' + accessToken
                    : null,
                'Content-Type': 'application/json',
                accept: 'application/json',
            , 
        );

我在 axios 中将timeout 设置为 5000ms。我将其更改为 30000 毫秒。都很好。