dimanche 26 janvier 2020

Downloading an image trough ajax, blocked by CORS [duplicate]

So I have this image I want to replace using AJAX. Here is the code.

HTML

<button type ="button" onclick="hentie()"> mange 1</button>
<div>
    <img id = "page" src="mange1/000.jpg" height="400px" height="auto"/>
</div>

JS

  function hentie(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (xhr.readyState==4 && xhr.status==200) {
      document.getElementById("page").src = "data:"+xhr.getResponseHeader("Content-Type")+";base64," + btoa(String.fromCharCode.apply(null, new Uint8Array(xhr.response)));
    }
  }
xhr.responseType = "arraybuffer";
xhr.open("POST","mange1/c01_01.jpg",true);
xhr.send();}

And when i initiate this function I get this error:

Access to XMLHttpRequest at 'file:///E:/sites/hh/reader/mange1/c01_01.jpg' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

main.js:18 POST file:///E:/sites/hh/reader/mange1/c01_01.jpg net::ERR_FAILED

Please pay no mind to titles of the files and functions in my example. I'm working on... something.




Aucun commentaire:

Enregistrer un commentaire