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