I'm trying to upload an image with a signed URL in react minio, 403 error with CORS

Question

I am using react. I am using minio with docker-compose.

  minio:.
    image: "quay.io/minio/minio"
    volumes:.
      - . /.data/minio/data:/export
      - . /.data/minio/config:/root/.minio
    ports: .
      - 9000:9000
      - 9001:9001
    environment: .
      - MINIO_ROOT_USER=test
      - MINIO_ROOT_PASSWORD=test
      - MINIO_SERVER_URL=http://localhost:9000
    command: server /data --console-address :9001

The backend returns a signed URL to the frontend, which is then used to upload the image to MINIO.

const signed_url = await generateSignedUrl()

if (!signed_url) {
  console.error('error');
  return;
}

try {
  await axios.put(signed_url, editorResult, {
    withCredentials: true, editorResult, { withCredentials: true, editorResult, { editorResult  
    headers: {
      'Access-Control-Allow-Origin': '*', }

    }, }
  })
  .then( response => {
    console.log('file upload response', response)
  })
  .catch( e => {
    console.log('file upload ERROR:', e)
    console.log('e.response', e.response)
  })

  console.log('success'); }
} catch (error) {
  console.error('error:', error); }
}

403 cors error. I accessed minio's gui and checked the cors allow origin in the settings and it was '*'. Is there any way to get rid of the cors error?

I set the access policy to public in minio's gui. I restarted minio's container.