I'm getting cors error while uploading images with axios or fetch.
Cloudflare API return me for every request an cors error like this:
Access to XMLHttpRequest at 'https://api.cloudflare.com/client/v4/accounts/***********/images/v1' from origin 'https://dash.******.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I have test in local environnement and prod, this will be the same error
Did one have fix this issue ?
there is some code for upload images
// This code will make an cors error
fetch(`https://api.cloudflare.com/client/v4/accounts/${process.env.cloudflare_account_id}/images/v1`, {
method: 'POST',
headers: {
Authorization: `Bearer ${process.env.cloudflare_api_key}`,
Accept: "*/*",
},
body: body
}
But with this request will passing images to my next js api, the cors is not verified ? and i got an 415 error code
let headersList = {
Accept: '*/*',
'User-Agent': 'Thunder Client (https://www.thunderclient.com)',
Authorization: 'Bearer *******',
};
let formdata = new FormData();
formdata.append('file', new Blob(req.body.image, { type: data.files.image[0].mimetype }), data.files.image[0].originalFilename);
console.log(data.files.image[0])
let bodyContent = formdata;
let reqOptions = {
url: 'https://api.cloudflare.com/client/v4/accounts/****/images/v1 ',
method: 'POST',
headers: headersList,
data: bodyContent,
};
let response = await axios.request(reqOptions);
Is it possible to bypass cors ? Nextjs can run curl command by passing him the binary data of file or the temporary path of file
want to upload an images to cloudflare images trought api