XMLHttpRequest non può caricare Origine non consentita da Access-Control-Allow-Origin

Question

Sto cercando di ottenere un http: // file javascript via xhr ma sto correndo nell'errore menzionato sopra.

Ecco il mio codice:

function getXHR() { 
    var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; 

    if (is_chrome) { 
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", "http://api.widgets.org/widget/1.1.2/widget_api.js?autoCreate=false&log=true", true); 
    xhr.onreadystatechange = function() { 
    if (xhr.readyState == 4) { 
     var s = document.createElement('script'); 
     s.textContent = xhr.responseText; 
     (document.head||document.documentElement).appendChild(s); 
     s.parentNode.removeChild(s); 
     } 
    } 
    xhr.send(); 
    } 
} 

questo è solo per Chrome, perché vorrei utilizzare lo script in https: // ma Chrome blocca automaticamente qualsiasi cosa, da http: //. Il server da cui ottengo lo script non esegue https: // e ho bisogno dello script/ho più script che preferisco non copiare tutti in un file di dati.

L'errore che sto funzionando in:

XMLHttpRequest cannot load http://api.widgets.org/widget/1.1.2/widget_api.js?autoCreate=false&log=true. Origin https://mysite.com is not allowed by Access-Control-Allow-Origin. 

Answer 1

Basta inserire il tag <script> direttamente invece di questo XHR involucro e poi inserire il contenuto di un tag <script>.

function getScript() { 
    var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; 

    if (is_chrome) { 
     // generate script element and set its source 
     var s = document.createElement('script'); 
     s.src = "http://api.widgets.org/widget/1.1.2/widget_api.js?autoCreate=false&log=true"; 
     // remove the script element after loading 
     s.addEventListener('load', function(){ s.parentNode.removeChild(s); }); 
     (document.head||document.documentElement).appendChild(s); 
    } 
} 

Inoltre, non so, perché si tenta di rimuovere l'elemento di script dopo il caricamento. Questo non influenzerà nessuno degli oggetti/metodi/variabili creati all'interno di quel codice.

Answer 2

Blocco del browser Richieste XHR effettuate su un server diverso dal server della pagina che effettua la richiesta, per motivi di sicurezza relativi allo scripting cross-site.

Se è solo uno script che si desidera caricare, utilizzare

<script src="..."></script> 

Per XHR generale, è possibile utilizzare la soluzione jsonp, se l'API fornisce, o chiedere agli operatori del API per consentire CORS (la condivisione delle risorse cross-origine)

http://developer.chrome.com/extensions/xhr.html https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS http://www.w3.org/TR/cors/ http://en.wikipedia.org/wiki/JSONP

Answer 3

ho cambiato fu ll percorso del file server sul breve percorso come segue.

$.post('http://example.com/pages/loadRandomImages.php',{'type':'loadRandomImages','loadingReq':'True'},function(data){ 

------------ 
---------- 
}); 

cambiato in,

$.post('/pages/loadRandomImages.php',{'type':'loadRandomImages','loadingReq':'True'},function(data){ 

------------ 
---------- 
}); 

poi ha lavorato bene in cromo.