Hello everyone i'm using gcp bucket for resumable upload i have created an endpoint on backend whihc will give me a signedUrl. BACKEND CODE:-

async getSignedUrl(query, res) {

try {

res.set('Access-Control-Allow-Origin', '<http://localhost:3000>');

const [url] = await storage

.bucket('my-pandume-bucket')

.file(query.fileName)

.getSignedUrl({

action: 'resumable',

version: 'v4',

expires: Date.now() + 12 * 60 * 60 * 1000,

contentType: 'application/octet-stream',

});

return res.json({

url,

});

} catch (error) {

throw new HttpException(

error.message || error.response || error,

HttpStatus.BAD_REQUEST,

);

}

}

Now i want to use signedUrl given by this endpoint on front end for resumable upload.Now inorder to used it as resumable according to documetation we have to hit a post request using this signedUrl that will give us SessionUrl this session url will be used for resumable upload but when i'm hitting post request using signedUrl which i got from backed refer to above code i'm getting this error. FRONT END CODE:-

const uploadChunk = useCallback(

(readerEvent) => {

axios({

method: "POST",

url, ===> Reffering signedUrl which we got from backend code .

})

.then((res) => {

console.log(res.data);

})

.catch((err) => {

console.log(err);

});

},

[url]

);

Access to XMLHttpRequest at 'https://storage.googleapis.com/blahblahbla...' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Than using gsutils my cors config is this:

[{"maxAgeSeconds": 3600, "method": ["GET", "POST", "PUT", "DELETE", "HEAD", "OPTIONS"], "origin": ["<http://localhost:3000>"], "responseHeader": ["Content-Type", "Authorization", "x-goog-resumable", "Access-Control-Allow-Origin"]}]

Than why i'm getting this error any idea please.