2016-05-23 21 views
8

Ho cercato ore su questo problema, ma non riesco ancora a trovare alcuna soluzione a questo.CORS + Cordova: problemi con: Access-Control-Allow-Origin

sto sviluppando un Cordova App (basicely HTML/JS) Quindi: l'applicazione gira su mobile dal navigatore, e non ho problemi a fare una richiesta Ajax per un API: https://developer.riotgames.com/ ma diciamo che voglio solo ottenere la pagina di google.

Come diavolo faccio, è possibile? Ecco un semplice exemple:

$.ajax({ 
    type: "GET", 
    url: "https://google.com", 
    dataType: "text", 
    success: function(response){ 
     alert("!!!"); 
    }, 
    error: function(error){ 
     alert("..."); 
    } 
}); 

io sono sempre più e più volte lo stesso errore:

XMLHttpRequest cannot load https://google.com/ . No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

L'origine 'null' è perché ho eseguito il codice: file:///D:/Projets/LoL/www/index.html e ho letto che il navigator sta bloccando, ma non funziona altrettanto se disattivo la sicurezza con --disable-web-security E ovviamente, non ho accesso al server a cui voglio partecipare.

Grazie mille per il vostro aiuto!

+1

Eventuali duplicati di [XmlHttpRequest errore: null Origin non è consentita da Access-Control-Allow-Origin] (http://stackoverflow.com/questions/3595515/xmlhttprequest-error-origin-null- is-not-allowed-by-access-control-allow-origin). Suggerirei di fare qualche lettura su JSONP ma in generale se non puoi modificare il server, non c'è un buon modo per fare ciò che vuoi fare. – CollinD

risposta

9

È necessario il plug-in della whitelist Cordova: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-whitelist/.

hanno questo in config.xml:

<access origin="*" /> 
<allow-navigation href="*"/> 

E avere la meta Content-Security-politica in index.html. Qualcosa di simile:

<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data:"> 
+2

Non funziona per me quando corro come browser. : "Richiesta di origine incrociata bloccata: la stessa politica di origine non consente di leggere la risorsa remota all'indirizzo http: // localhost: 7788/testAction. Ciò può essere risolto spostando la risorsa nello stesso dominio o abilitando CORS. – Emiter

+0

Se si esegue la distribuzione su un portatile, è possibile che si ottengano risultati migliori. Ho letto (purtroppo non riesco a ricordare dove) che le risposte CORS sono leggermente diverse quando si esegue da app o browser. Ho creato un'app di test con CORS abilitato nei meta tag e ha funzionato solo quando l'ho distribuito sul mio telefono, non dal mio desktop. – nmcilree

0

Ho aggiunto seguente nel server nodjs che risolve il mio problema;

app.use(function(req, res, next) { 
res.header("Access-Control-Allow-Origin", "*"); 
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); 
next(); 

});

Questo potrebbe essere utile se si utilizza il nodojs.

Grazie