XMLHttpRequestが読み込めません。アクセス制御許可元からOriginが許可されていません。

Question

xhrでhttp：// javascriptファイルを取得しようとしていますが、上記のエラーが発生しています。ここで

は私のコードです：HTTPからブロック何でも自動的に//しかしクローム：//

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(); 
    } 
} 

これは私がhttpsでスクリプトを使用したいので、クロームのためだけです。私がスクリプトを取得しているサーバーはhttps：//を実行せず、スクリプトが必要です/複数のスクリプトを持っていますが、すべてデータファイルにコピーされていません。

私はに実行しているエラー：

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

だけではなく、このXHRラッパーの直接<script>タグを挿入し、その後<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); 
    } 
} 

さらに、ロード後にスクリプト要素を削除しようとする理由はわかりません。これは、そのコード内で作成されたオブジェクト/メソッド/変数のどれにも影響しません。

Answer 2

ブラウザのブロッククロスサイトスクリプティングに関連するセキュリティ上の理由から、要求を行ったページのサーバーとは異なるサーバーに対するXHR要求。それはあなたがロードするだけのスクリプトはなら

、一般XHRについて

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

を使用するAPIがそれを提供する場合、あなたは、JSONPの回避策を使用することができ、または（CORSを有効にするには、APIの演算子を頼みます私は府に変更

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

クロスオリジンリソースの共有）次のようにサーバーファイルの短いパスへのパス。

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

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

はクロームでうまく働いた後

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

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

、それを変更しました。