AJAX - brak połączenia z serwerem na Chromie

Question

Witam!

Wysyłając zapytanie do lokalnego serwera (mam zainstalowanego Xampp'a), przeglądarka Chrome zwraca mi błąd:

XMLHttpRequest cannot load file:///C:/xampp/htdocs/KursJsAjax/plik1.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

Jednak na Firefoxie wszystko działa. Ma ktoś pomysł co może być przyczyną?

 

	<form>
	<label for="#choice">Wybierz pliki:</label>
	<select onchange="fileToDiv('tekst', this.value);" id="choice">
		<option value="plik1.txt">1</option>
		<option value="plik2.php">2</option>
		<option value="plik3.html">3</option>
		<option value="plik4.xml">4</option>
	</select>
	</form>

	<div id="tekst">
		
	</div>

if (typeof XMLHttpRequest == "undefined"){
	XMLHttpRequest = function(){
		return new ActiveXObject(
			navigator.userAgent.indexOf("MSIE 5") >=0 ? "Microsoft.XMLHTTP" : "Msxml2.XMLHTTP"
		);
	}
};

var xml = new XMLHttpRequest();

function fileToDiv(id, URL){
	xml.open("GET", URL, true);
	xml.onreadystatechange = function(){
		if (xml.readyState == 4){

			if (xml.status == 200){
			document.getElementById('tekst').innerHTML = xml.responseText;
		}else{
			alert("Wystąpił błąd" + xml.status);
		}
		}
	}

	xml.send(null);
};

 

Answer 1

XMLHttpRequest cannot load file:///C:/xampp/htdocs/KursJsAjax/plik1.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https

Ze względów bezpieczeństwa Chrome blokuje asynchroniczne wczytywanie danych bezpośrednio z dysku. W panelu XAMPP włącz server apache i zmień url w JS na: http://localhost/KursJsAjax/plik.txt