2012-06-04 10 views
70

Sono bloccato con questo problema CORS, anche se ho impostato il server (nginx/node.js) con le intestazioni appropriate.CORS mortale quando http: // localhost è l'origine

posso vedere nel riquadro Chrome Rete -> intestazioni di risposta:

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

che dovrebbe fare il trucco.

Ecco il codice che ora uso di prova:

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. 

Ho il sospetto che sia un problema nello script client e non la configurazione del server ...

+17

No, stackoverflow.com ha la necessità di impostare questa intestazione, non tu. :X. Quale sarebbe il punto della stessa politica di origine altrimenti. – Esailija

+2

Prova ad accedere al server che hai impostato senza sovrapporre lo stack. ;) – Nek

+0

DOH! C'è un modo per dire chrome (o altro browser), per ottenere la risorsa anche se manca l'intestazione quando la mia origine è localhost? – whadar

risposta

117

Chrome does not support localhost for CORS requests (un bug aperto dal 2010).

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

+0

Questo non è corretto. Sono in grado di postare su localhost con chrome – greensuisse

+10

@greensuisse - non sta postando su localhost. Sta postando * da * localhost che è il problema. – Cheeso

+1

Questo bug non è valido (ed è stato contrassegnato come tale - http://crbug.com/67743#c17). [Il commento di Esailija] (http://stackoverflow.com/questions/10883211/deadly-cors-when-http-localhost-is-the-origin#comment14184025_10883211) è corretto, l'aggiunta di queste intestazioni a localhost non ti darà magicamente l'accesso a tutti gli altri siti. È il sito remoto che deve essere servito con queste intestazioni. –

15

Il vero problema è che se si imposta -Permette- per tutte le richieste (OPZIONI & POST), Chrome lo annulla. Il seguente codice funziona per me con il 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); 
} 
?> 
+2

OP sta usando nginx/node.js. Non PHP –

4

Per @ risposta di Beau, Chrome non supporta CORS localhost richieste, e non v'è improbabile alcun cambiamento in questa direzione.

Io uso il 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: <you can add values here> 

Il source code is published on Github.

Si noti che l'estensione filtra tutti gli URL per impostazione predefinita. Questo potrebbe interrompere alcuni siti Web (ad esempio: Dropbox). Ho cambiato per filtrare solo localhost URL con il seguente filtro URL

*://localhost:*/*