XMLHttpRequest Origin null no está permitido Access-Control-Allow-Origin para el archivo: /// al archivo: /// (sin servidor)

Estoy tratando de crear un sitio web que se pueda descargar y ejecutar localmente al iniciar su archivo de índice.

Todos los archivos son locales, no se utilizan recursos en línea.

Cuando intento usar el complemento AJAXSLT para jQuery para procesar un archivo XML con una plantilla XSL (en subdirectorios), recibo los siguientes errores:

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.

El archivo de índice que realiza la solicitud es file:///C:/path/to/XSL%20Website/index.htmlmientras los archivos JavaScript utilizados se almacenan enfile:///C:/path/to/XSL%20Website/assets/js/ .

¿Cómo puedo hacer para solucionar este problema?

Para los casos en los que ejecutar un servidor web local no es una opción, puede permitir el acceso de Chrome a los file://archivos a través de un interruptor de navegador. Después de investigar un poco, encontré esta discusión , que menciona un cambio de navegador en la publicación de apertura. Ejecute su instancia de Chrome con:

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

Esto puede ser aceptable para entornos de desarrollo, pero poco más. Ciertamente no quieres esto todo el tiempo. Esto todavía parece ser un problema abierto (a partir de enero de 2011).

Consulte también: Problemas con jQuery getJSON al usar archivos locales en Chrome

Esencialmente, la única forma de lidiar con esto es tener un servidor web ejecutándose en localhost y servirlos desde allí.

Es inseguro que un navegador permita que una solicitud ajax acceda a cualquier archivo en su computadora, por lo tanto, la mayoría de los navegadores consideran que las solicitudes "file: //" no tienen origen con el propósito de " Política del mismo origen "

Iniciar un servidor web puede ser tan trivial como cdingresar al directorio en el que se encuentran y ejecutan los archivos:

python -m SimpleHTTPServer

Aquí hay un AppleScript que lanzará Chrome con el interruptor --allow-file-access-from-files activado, para desarrolladores de OSX / 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 &"

Esta solución le permitirá cargar un script local usando jQuery.getScript (). Esta es una configuración global, pero también puede configurar la opción crossDomain por solicitud.

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

¿Qué pasa con el uso de la función JavaScript FileReader para abrir el archivo local, es decir:

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

Ahora haga clic en el Choose filebotón y busque el archivofile:///C:/path/to/XSL%20Website/data/home.xml

Lanzamiento de cromo al igual que a esta restricción de bypass: open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files.

Derivado del comentario de Josh Lee, pero necesitaba especificar la ruta completa a Google Chrome para evitar que Google Chrome se abra desde mi partición de Windows (en Parallels).

La forma en que acabo de solucionar esto es no usar XMLHTTPRequest en absoluto, sino incluir los datos necesarios en un archivo javascript separado. (En mi caso, necesitaba un blob SQLite binario para usar con https://github.com/kripken/sql.js/ )

Creé un archivo llamado base64_data.js(y solía btoa()convertir los datos que necesitaba e insertarlos en un archivo <div>para poder copiarlos).

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

y luego incluyó los datos en el html como javascript normal:

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

Me imagino que sería trivial modificar esto para leer JSON, tal vez incluso XML; Lo dejaré como un ejercicio para el lector;)

Usted puede intentar poner 'Access-Control-Allow-Origin':'*'en response.writeHead(, {[here]}).

use el 'servidor web para la aplicación de Chrome'. (en realidad lo tienes en tu PC, ya sea que lo sepas o no. ¡Solo búscalo en Cortana!). ábralo y haga clic en 'elegir archivo', elija la carpeta con su archivo. en realidad no seleccione su archivo. seleccione su carpeta de archivos y luego haga clic en los enlaces debajo del botón 'elegir carpeta'.

si no lo lleva al archivo, agregue el nombre del archivo a las urs. Me gusta esto:

   https://127.0.0.1:8887/fileName.txt

enlace al servidor web para Chrome: haga clic en mí