I met an error in request download function by axios 1.html button onclick event call this function. 2.I get image url from s3 like {image_url}
function downloadImage() {
if(confirm("download")) {
axios({
url: '{image_url}',
method: 'GET',
responseType: 'blob'
})
.then((response) => {
const url = window.URL
.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', 'download.jpeg');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
}
};
I made 3 functions has same code but different image_url(same s3 path) and fetched individually in 3 buttons.
finally, 2 download button are worked but one download button isn't worked and occurs error like this at browser
Access to XMLHttpRequest at 'image path' from origin 'domain' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
image path:1 Failed to load resource: net::ERR_FAILED
spread.js:25 Uncaught (in promise) Error: Network Error
at e.exports (spread.js:25:1)
at l.onerror (spread.js:25:1)
but about 30minutes after, It can be downloaded also...
sorry for difficult explanation.