Django/React/Firebase - CORS error when uploading big files-CodePudding

I have a website with React hosted on Firebase, with Django for backend running on a server with nginx.

On this website I have a form where the user can upload up to 3 images. On my local PC it works fine, but on the production environment I get this error when I try to upload big files (more than 5mb):

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

Now the thing is that the images get uploaded normally, I can see them when I check the submitted form on the website admin area, but on the frontend, after submitting the form, instead of the success message I get that error.

I have incresed nginx client_max_body_size 15M, but I still get the error.

But given that the images do get uploaded, I think the max body size is not the problem.

CodePudding user response：

I found the problem! It was a very dumb thing, but I didn't notice it before.

Basically I had this

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

I set the timeout to 5000ms in axios. I changed it to 30000ms. All good.