XMLHttpRequest Origin nullは許可されませんfile：///からfile：///へのAccess-Control-Allow-Origin（サーバーレス）

インデックスファイルを起動して、ローカルでダウンロードして実行できるWebサイトを作成しようとしています。

すべてのファイルはローカルであり、リソースはオンラインで使用されません。

jQueryのAJAXSLTプラグインを使用して、XSLテンプレート（サブディレクトリ内）でXMLファイルを処理しようとすると、次のエラーが表示されます。

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/data/home.xml. Origin null is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. Origin null is not allowed by Access-Control-Allow-Origin.

リクエストを行うインデックスファイルはfile:///C:/path/to/XSL%20Website/index.html、使用されるJavaScriptファイルがに保存されている間file:///C:/path/to/XSL%20Website/assets/js/です。

この問題を解決するにはどうすればよいですか？

ローカルウェブサーバーを実行できない場合はfile://、ブラウザスイッチを介してChromeにファイルへのアクセスを許可できます。少し調べたところ、このディスカッションが見つかりました。これは、投稿を開く際のブラウザの切り替えについて言及しています。以下を使用してChromeインスタンスを実行します。

chrome.exe --allow-file-access-from-files

これは開発環境では許容できるかもしれませんが、それ以外はほとんどありません。あなたは確かにいつもこれを望んでいるわけではありません。これはまだ未解決の問題のようです（2011年1月現在）。

参照：Chromeでローカルファイルを使用するjQuery getJSONの問題

基本的にこれに対処する唯一の方法は、ローカルホストでWebサーバーを実行し、そこからサービスを提供することです。

ブラウザがajaxリクエストにコンピュータ上の任意のファイルへのアクセスを許可するのは安全ではないため、ほとんどのブラウザは「file：//」リクエストを「同じオリジンポリシー」の目的でオリジンがないものとして扱うようです」の

Webサーバーの起動はcd、ファイルが存在し実行されているディレクトリに移動するのと同じくらい簡単です。

python -m SimpleHTTPServer

OSX / Chrome開発者向けの--allow-file-access-from-filesスイッチをオンにしてChromeを起動するアップルスクリプトは次のとおりです。

set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"    
set switch to " --allow-file-access-from-files"
do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &"

このソリューションでは、jQuery.getScript（）を使用してローカルスクリプトをロードできます。これはグローバル設定ですが、リクエストごとにcrossDomainオプションを設定することもできます。

$.ajaxPrefilter( "json script", function( options ) {
  options.crossDomain = true;
});

javascript FileReader関数を使用してローカルファイルを開くのはどうですか。

<input type="file" name="filename" id="filename">
<script>
$("#filename").change(function (e) {
  if (e.target.files != undefined) {
    var reader = new FileReader();
    reader.onload = function (e) {
        // Get all the contents in the file
        var data = e.target.result; 
        // other stuffss................            
    };
    reader.readAsText(e.target.files.item(0));
  }
});
</script>

今すぐクリックしてChoose fileファイルへのボタンと、閲覧をfile:///C:/path/to/XSL%20Website/data/home.xml

この制限を回避するには、次のようにChromeを起動しopen -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-filesます：。

Josh Leeのコメントから派生しましたが、Google Chromeが私のWindowsパーティション（Parallels）から開かないようにするために、Google Chromeへのフルパスを指定する必要がありました。

私がこれを回避した方法は、XMLHTTPRequestをまったく使用せず、代わりに別のJavaScriptファイルに必要なデータを含めることです。（私の場合、https：//github.com/kripken/sql.js/で使用するバイナリSQLite blobが必要でした）

というファイルを作成しましたbase64_data.js（btoa()必要なデータを変換してに挿入する<div>ために使用して、コピーできるようにしました）。

var base64_data = "U1FMaXRlIGZvcm1hdCAzAAQA ...<snip lots of data> AhEHwA==";

次に、通常のjavascriptのようにデータをhtmlに含めます。

<div id="test"></div>

<script src="base64_data.js"></script>
<script>
    data = atob(base64_data);
    var sqldb = new SQL.Database(data);
    // Database test code from the sql.js project
    var test = sqldb.exec("SELECT * FROM Genre");
    document.getElementById("test").textContent = JSON.stringify(test);
</script>

これを変更して、JSONやXMLを読み取るのは簡単なことだと思います。読者の練習問題として残しておきます;）

入れ'Access-Control-Allow-Origin':'*'てみてくださいresponse.writeHead(, {[here]})。

「Chromeアプリ用のWebサーバー」を使用します。（あなたは実際にあなたのPCにそれを持っています、あなたが知っているかどうかにかかわらず、ただコルタナでそれを検索してください！）それを開き、「ファイルを選択」をクリックして、ファイルが含まれているフォルダを選択します。実際にはファイルを選択しないでください。ファイルフォルダを選択します、[を選択]ボタンの下のリンクをクリックします。

ファイルにアクセスできない場合は、ファイルの名前をursに追加してください。このような：

   https://127.0.0.1:8887/fileName.txt

ChromeのWebサーバーへのリンク： クリックしてください