CORS mortale quando http: // localhost è l’origine

Sono bloccato con questo problema CORS, anche se ho impostato il server (nginx / node.js) con le intestazioni appropriate.

Posso vedere nel pannello Network di Chrome -> Intestazioni di risposta:

Access-Control-Allow-Origin:http://localhost 

che dovrebbe fare il trucco.

Ecco il codice che ora uso per testare:

 var xhr = new XMLHttpRequest(); xhr.onload = function() { console.log('xhr loaded'); }; xhr.open('GET', 'http://stackoverflow.com/'); xhr.send(); 

ottengo

 XMLHttpRequest cannot load http://stackoverflow.com/. Origin http://localhost is not allowed by Access-Control-Allow-Origin. 

Sospetto che sia un problema nello script del client e non nella configurazione del server …

Chrome non supporta localhost per le richieste CORS (un bug aperto dal 2010).

Per aggirare questo problema è ansible utilizzare un dominio come lvh.me (che punta a 127.0.0.1 come localhost) o avviare chrome con il flag --disable-web-security (supponendo che si stia solo testando).

Il vero problema è che se impostiamo “Consenti” per tutte le richieste (OPZIONI e POST), Chrome lo annullerà. Il seguente codice funziona per me con POST a LocalHost con Chrome

 < ?php if (isset($_SERVER['HTTP_ORIGIN'])) { //header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}"); header("Access-Control-Allow-Origin: *"); header('Access-Control-Allow-Credentials: true'); header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); } if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') { if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD'])) header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS'])) header("Access-Control-Allow-Headers:{$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}"); exit(0); } ?> 

Per la risposta di @ Beau, Chrome non supporta le richieste CORS di localhost e non vi è alcun cambiamento in questa direzione.

Io uso Allow-Control-Allow-Origin: * Chrome Extension per aggirare questo problema. L’estensione aggiungerà le intestazioni HTTP necessarie per CORS:

 Access-Control-Allow-Origin: * Access-Control-Allow-Methods: "GET, PUT, POST, DELETE, HEAD, OPTIONS" Access-Control-Expose-Headers:  

Il codice sorgente è pubblicato su Github .

Nota che l’estensione filtra tutti gli URL per impostazione predefinita. Questo potrebbe interrompere alcuni siti Web (ad esempio: Dropbox). L’ho modificato per filtrare solo URL localhost con il seguente filtro URL

 *://localhost:*/*