Nessuna intestazione ‘Access-Control-Allow-Origin’ è presente sulla risorsa richiesta. L’origine ‘…’ non è quindi consentita l’accesso

Sto usando .htaccess per riscrivere gli URL e ho usato il tag base html per farlo funzionare.

Ora, quando provo a fare una richiesta Ajax ottengo il seguente errore:

XMLHttpRequest non può caricare http://www.wordicious.com/login.php . Nessuna intestazione ‘Access-Control-Allow-Origin’ è presente sulla risorsa richiesta. L’origine ” http://wordicious.com ” non è quindi consentita l’accesso.

Usa addHeader Invece di usare il metodo setHeader ,

 response.addHeader("Access-Control-Allow-Origin", "*"); 

* nella riga sopra consentirà l’ access to all domains .


Per consentire l’ access to specific domain only :

 response.addHeader("Access-Control-Allow-Origin", "http://www.example.com"); 

Controlla questo blog post .

Perché l’errore è stato sollevato:

Il codice JavaScript è limitato dalla politica della stessa origine , ovvero da una pagina su www.example.com , puoi solo effettuare richieste (AJAX) a servizi situati esattamente nello stesso dominio, in questo caso, esattamente www.example.com ( non example.com – senza www – o whatever.example.com ).

Nel tuo caso, il tuo codice Ajax sta tentando di raggiungere un servizio in http://wordicious.com da una pagina all’indirizzo http://www.wordicious.com .

Anche se molto simili, non sono lo stesso dominio. E quando non sono nello stesso dominio, la richiesta avrà successo solo se il respose del target contiene un’intestazione Access-Control-Allow-Origin in esso.

Poiché la tua pagina / servizio all’indirizzo http://wordicious.com non è mai stato configurato per la presentazione di tale intestazione, viene visualizzato questo messaggio di errore.

Soluzione:

Come detto, l’origine (dove la pagina con JavaScript è a) e il target (dove JavaScript sta cercando di raggiungere) i domini devono essere esattamente gli stessi.

Il tuo caso sembra un errore di battitura. Sembra che http://wordicious.com e http://www.wordicious.com siano in realtà lo stesso server / dominio. Quindi, per risolvere il problema, digita allo stesso modo il target e l’origine: rendi le pagine / i servizi di richiesta del codice Ajax a http://www.wordicious.com non http://wordicious.com . (Forse posizionare l’URL di destinazione relativamente, come '/login.php' , senza il dominio).

In una nota più generale:

Se il problema non è un errore di battitura come quello di questa domanda, la soluzione sarebbe aggiungere Access-Control-Allow-Origin al dominio di destinazione . Per aggiungerlo, dipende, ovviamente, dal server / lingua dietro quell’indirizzo. A volte una variabile di configurazione nello strumento farà il trucco. Altre volte dovrai aggiungere tu stesso le intestazioni attraverso il codice.

Per il server .NET è ansible configurarlo in web.config come mostrato di seguito

         

Ad esempio, diciamo, se il dominio del server è http://live.makemypublication.com e il client è http://www.makemypublication.com quindi configurare nel web.config del server come di seguito

         

Se ricevi questo messaggio di errore dal browser:

Nessuna intestazione ‘Access-Control-Allow-Origin’ è presente sulla risorsa richiesta. L’origine ‘…’ non è quindi consentita l’accesso

quando stai tentando di eseguire una richiesta POST / GET Ajax su un server remoto che è fuori dal tuo controllo, ti preghiamo di dimenticare questa semplice soluzione:

 < ?php header('Access-Control-Allow-Origin: *'); ?> 

Quello che devi veramente fare, specialmente se usi solo JavaScript per fare la richiesta Ajax, è un proxy interno che accetta la tua query e la invia al server remoto.

Prima nel tuo JavaScript, fai una chiamata Ajax al tuo server, qualcosa come:

 $.ajax({ url: yourserver.com/controller/proxy.php, async:false, type: "POST", dataType: "json", data: data, success: function (result) { JSON.parse(result); }, error: function (xhr, ajaxOptions, thrownError) { console.log(xhr); } }); 

Quindi, crea un semplice file PHP chiamato proxy.php per avvolgere i tuoi dati POST e aggiungerli al server URL remoto come parametri. Ti faccio un esempio di come bypassare questo problema con l’API di ricerca hotel Expedia:

 if (isset($_POST)) { $apiKey = $_POST['apiKey']; $cid = $_POST['cid']; $minorRev = 99; $url = 'http://api.ean.com/ean-services/rs/hotel/v3/list?' . 'cid='. $cid . '&' . 'minorRev=' . $minorRev . '&' . 'apiKey=' . $apiKey; echo json_encode(file_get_contents($url)); } 

Facendo:

  echo json_encode(file_get_contents($url)); 

Stai facendo la stessa query ma sul lato server e dopo, dovrebbe funzionare correttamente.

Devi aggiungere questo all’inizio della tua pagina php “login.php”

 < ?php header('Access-Control-Allow-Origin: *'); ?> 

devi inserire le chiavi / i valori delle intestazioni nella risposta al metodo delle opzioni. per esempio se hai risorse su http://mydomain.com/myresource allora, nel tuo codice server scrivi

 //response handler void handleRequest(Request request, Response response) { if(request.method == "OPTIONS") { response.setHeader("Access-Control-Allow-Origin","http://clientDomain.com") response.setHeader("Access-Control-Allow-Methods", "GET,POST,PUT,DELETE,OPTIONS"); response.setHeader("Access-Control-Allow-Headers", "Content-Type"); } } 

In pratica, modifica la risposta dell’intestazione API aggiungendo i seguenti parametri aggiuntivi.

Access-Control-Allow-Credentials: true

Access-Control-Allow-Origin: *

Ma questa non è una buona soluzione quando si tratta della sicurezza

La soluzione alternativa consiste nell’utilizzare un proxy inverso in esecuzione sul tuo host “di origine” e l’inoltro al server di destinazione, come ad esempio Fiddler:

Link qui: http://docs.telerik.com/fiddler/configure-fiddler/tasks/usefiddlerasreverseproxy

O un proxy Apache Reverse …

Aggiungi questo al tuo file PHP o controller principale

 header("Access-Control-Allow-Origin: http://localhost:9000"); 

Risolto con la voce in basso in httpd.conf

 #CORS Issue Header set X-Content-Type-Options "nosniff" Header always set Access-Control-Max-Age 1728000 Header always set Access-Control-Allow-Origin: "*" Header always set Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT,PATCH" Header always set Access-Control-Allow-Headers: "DNT,X-CustomHeader,Keep-Alive,Content-Type,Origin,Authentication,Authorization,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control" Header always set Access-Control-Allow-Credentials true #CORS REWRITE RewriteEngine On RewriteCond %{REQUEST_METHOD} OPTIONS #RewriteRule ^(.*)$ $1 [R=200,L] RewriteRule ^(.*)$ $1 [R=200,L,E=HTTP_ORIGIN:%{HTTP:ORIGIN}]] 

Ho riscontrato questo problema quando utilizzo Angular per pubblicare un record sul backend Django REST . A volte, non c’è una ragione particolare per questo problema. Controlla attentamente il messaggio di errore di Django, troverai una soluzione.