XMLHttpRequest Origin null değerine izin verilmiyor: /// to file: /// (Serverless) dosyası için Access-Control-Allow-Origin

Indirin ve yerel olarak indeks dosyasını başlatarak çalıştırmak bir web sitesi oluşturmaya çalışıyorum.

Tüm dosyalar yereldir, çevrimiçi olarak hiçbir kaynak kullanılmaz.

Bir XSL şablonu (alt dizinlerde) ile bir XML dosyasını işlemek için jQuery için AJAXSLT eklentisini kullanmaya çalıştığınızda, aşağıdaki hataları alıyorum:

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.

İstekte bulunan dizin dosyası, file:///C:/path/to/XSL%20Website/index.htmlkullanılan JavaScript dosyaları saklanırken gerçekleşir file:///C:/path/to/XSL%20Website/assets/js/.

Bu sorunu gidermek için nasıl yapabilirim?

Yerel bir web sunucusu çalıştırmanın bir seçenek olmadığı durumlarda, Chrome'un file://dosyalara tarayıcı anahtarı aracılığıyla erişmesine izin verebilirsiniz . Bazı kazmalardan sonra , açılış konuşmasında bir tarayıcı geçişinden bahseten bu tartışmayı buldum . Chrome örneğinizi aşağıdakilerle çalıştırın:

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

Bu, geliştirme ortamları için kabul edilebilir, ancak çok az şey olabilir. Bunu her zaman kesinlikle istemezsiniz. Bu hala açık bir konu gibi görünmektedir (Ocak 2011 itibariyle).

Ayrıca bkz: Chrome'da yerel dosyaları kullanmada jQuery getJSON ile ilgili sorunlar

Aslında bununla başa çıkmanın tek yolu localhost üzerinde çalışan bir web sunucusuna sahip olmak ve onlara oradan hizmet etmektir.

Bir tarayıcının bir ajax isteğinin bilgisayarınızdaki herhangi bir dosyaya erişmesine izin vermesi güvenli değildir, bu nedenle çoğu tarayıcı "file: //" isteklerine " Aynı Köken Politikası " amacıyla hiçbir kaynağı bulunmadığını düşünmektedir.

Bir web sunucusu başlatmak cd, dosyaların içinde bulunduğu ve çalıştığı dizine girmek kadar önemsiz olabilir :

python -m SimpleHTTPServer

İşte OSX / Chrome geliştiricileri için Chrome'u --allow dosyalarından dosyalara erişim anahtarı açıkken başlatacak bir el yazısı:

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 &"

Bu çözüm, jQuery.getScript () kullanarak yerel bir komut dosyası yüklemenizi sağlar. Bu genel bir ayardır, ancak isteğe bağlı olarak crossDomain seçeneğini de ayarlayabilirsiniz.

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

Yerel dosyayı açmak için javascript FileReader işlevini kullanmaya ne dersiniz , yani:

<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>

Şimdi düğmesini Choose filetıklayın ve dosyaya göz atınfile:///C:/path/to/XSL%20Website/data/home.xml

Bu nedenle bu sınırlama bypass gibi başlatın krom: open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files.

Josh Lee'nin yorumundan türetilmişti, ancak Windows bölümümden (Parallels'de) Google Chrome'un açılmasını önlemek için Google Chrome'un tam yolunu belirtmem gerekiyordu.

Ben sadece bu şekilde çalıştı yolu hiç XMLHTTPRequest kullanmak değil, bunun yerine ayrı bir javascript dosyasında gerekli verileri dahil etmektir. (Benim durumumda https://github.com/kripken/sql.js/ ile kullanmak için ikili bir SQLite blobuna ihtiyacım vardı )

Adlı bir dosya oluşturdum base64_data.js(ve btoa()ihtiyacım olan veriyi dönüştürmek ve <div>kopyalamak için bir içine eklemek için kullanılır).

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

ve daha sonra verileri normal javascript gibi html'ye dahil etti:

<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, hatta XML okumak için bu değiştirmek önemsiz olacağını düşünüyorum; Bunu okuyucu için bir egzersiz olarak bırakacağım;)

Sen koyarak deneyebilirsiniz 'Access-Control-Allow-Origin':'*'içinde response.writeHead(, {[here]}).

'chrome uygulaması için web sunucusunu' kullanın. (aslında PC'nizde, bilip bilmediğinize bakabilirsiniz. sadece cortana'da arayın!). açın ve 'dosya seç'i tıklayın, dosyanızın bulunduğu klasörü seçin. aslında dosyanızı seçmeyin. dosya klasörünüzü seçin, ardından 'klasör seç' düğmesinin altındaki bağlantılara tıklayın.

sizi dosyaya götürmezse, dosyanın adını urs'a ekleyin. bunun gibi:

   https://127.0.0.1:8887/fileName.txt

için web sunucusuna bağlantı: beni tıkla