Me sale este error:

Error al cargar el módulo de secuencia de comandos: El servidor responde con un no-JavaScript tipo de MIME «». Estrictas tipo MIME comprobación se aplica para el módulo de secuencias de comandos por HTML spec.

El proyecto se ejecuta desde archivos locales, por ejemplo.: file:///D:/path/project.html.

Funciona sin problemas en Firefox, pero no funciona en Google Chrome. Quiero probar de esta manera para los propósitos de desarrollo – es más cómodo que el de crear un server y recordar lo que el puerto está en.

  • Usted necesita configurar un servidor HTTP local. El uso de archivo: Url no es nunca una buena idea, ya que no se comportan como una verdadera página.
  • Los usuarios finales reciban la página repleto de webpack. Pero para mí, es más cómodo para probar con los archivos. Puedo iniciar python o node.js servidor, yo no quiero.
  • En realidad, acabo de intentar y.. no se enfrentan a este mismo origen de la restricción. Es como el mensaje de error indica: que hacer una estricta verificación contra js tipo MIME, el sistema de ficheros no lo proporcionan.
  • Bueno, entonces la pregunta es cómo deshabilitar la verificación de los archivos locales, a la derecha?
  • No creo que nunca tuve una respuesta viable para esto? Me encantaría tener una solución.
  • bugs.chromium.org/p/chromium/issues/detail?id=824651 – una correspondiente incidencia en el issue tracker

InformationsquelleAutor Tomáš Zato | 2017-11-21

5 Comentarios

  1. 7

    Si usted tiene en este mensaje de error, significa que no es un Mismo origen del problema.

    Como se dijo en el mensaje de error, el problema real es que los módulos de secuencias de comandos requieren el mimo de su archivo de secuencia de comandos a ser uno de los javascript de los tipos MIME.

    Su sistema de archivos no proporciona ningún MIME, por lo tanto la carga de falla.

    Así que la mejor solución es, obviamente, para ejecutar su código en un servidor local, y no en el sistema de archivos.

    Pero ya que usted insiste 😉 Una solución es primero obtener su archivo de secuencia de comandos como Blob con XHR (fetch no puede ser utilizado en file:// protocolo), entonces la fuerza de su type de la propiedad a ser uno de js Mimos, y establecer su <script>‘s src para un blobURI poiting a esta Nota.

    //requires to start chrome with the --allow-file-access-from-file flag
    var xhr = new XMLHttpRequest();
    xhr.onload = e => {
        let blob = xhr.response;
        blob.type = 'application/javascript'; //force the MIME
        moduleScript.src = URL.createObjectURL(blob);
    };
    xhr.open('get', "yourmodule.js");
    xhr.responseType = 'blob';
    xhr.send();

    PERO, usted no será capaz de import las dependencias dentro de su módulo.

    • Esto realmente no ayuda, pero felicitaciones por la solución. Puede ser muy útil en otras situaciones…
    • tenga en cuenta que podría ser posible a través de chrome secuencias de comandos (extensión) a fuerza de mimos en tales casos, el uso de la webRequest API, pero no sé lo suficiente como para mostrar exactamente cómo proceder…
    • Lo que si está ejecutando esta en un servidor local, y sigue recibiendo este problema?
  2. 17

    Una solución sencilla para mí que no fue incluido aquí fue este:

    Tuve una declaración import llevar un objeto de un archivo diferente, lo cual hice a través de esta línea:

    import { Cell } from './modules/Cell';

    Lo que rompió el código y causó el tipo MIME de error fue no haber .js anexa al final de ./modules/Cell.

    La actualización de la línea solucionado mi problema:

    import { Cell } from './modules/Cell.js';

    • Wow. Yup. Justo aquí. Tiene sentido, también, porque esto indica explícitamente que lo que escriba el módulo de importación es
    • sí tiene sentido, en retrospectiva, pero yo estaba fuera de mi mente tratando de averiguar.
    • Jaja me alegro de que te haya encontrado antes me encontré con el mismo problema :p
    • JayGould ¡genial!, Me estaba volviendo loco acerca de nada, diciendo de esta manera es comprensible. @Jona que tiene sentido para mí, Genio!,
    • Afortunadamente el navegador de la consola me dio un amable mensaje de error así que no tenía necesidad de pasar una hora en encontrar esta solución. No! Por CIERTO, estoy usando un servidor HTTP (Python2).
    • sí, hizo exactamente lo mismo cuando me envió esta respuesta. Peor es que fue por un tiempo de la casa de prueba para una entrevista!
    • Soy realmente nuevo en esto, sin embargo, creo que debe ser el uso de esta solución con cuidado en caso de mecanismo nacional de prevención módulos, ya que básicamente se crea un acoplamiento de la importación de módulo no para el módulo, pero también el nombre y la ruta del archivo js en lugar de sólo el nombre del módulo. Supongo que webpack etc como preparadores cuidar de resolver esto entre otras cosas, pero como dije soy nuevo y puede estar equivocado.
    • Lo que funcionó para mí fue similar, pero en lugar de cambiar la .mjs extensión tuve que .js. Yo estaba siguiendo tutoriales o artículos acerca de los módulos y el uso de .mjs no tan seguro de lo que se trata de allí.
    • esto ocurre con desagregado código, si está ejecutando babel/webpack la omisión de la .js dará la misma funcionalidad que incluye.

  3. 3

    Puede establecer el ModuleSpecifier a un data URI

    <script type="module">
      import {Test} from "data:application/javascript,const%20Mod={this.abc=123};export%20{Mod};";
      console.log(Test);
    </script>

    para establecer el ModuleSpecifier mediante programación puede iniciar Cromo/Cromo con --allow-file-access-from-files bandera y utilizar XMLHttpRequest() para solicitar un archivo JavaScript de file: protocolo

    <script>
    (async() => {
    
      const requestModule = ({url, dataURL = true}) => 
        new Promise((resolve, reject) => {
          const request = new XMLHttpRequest();
          const reader = new FileReader();
          reader.onload = () => { resolve(reader.result) };
          request.open("GET", url);
          request.responseType = "blob";
          request.onload = () => { reader[dataURL ? "readAsDataURL" : "readAsText"](request.response) };
          request.send();
       })
    
      let moduleName = `Mod`;
      //get `Mod` module
      let moduleRequest = await requestModule({url:"exports.js"});
      //do stuff with `Mod`; e.g., `console.log(Mod)`
      let moduleBody = await requestModule({url:"ModBody.js", dataURL: false}); 
      let scriptModule = `import {${moduleName}} from "${moduleRequest}"; ${moduleBody}`;
      let script = document.createElement("script");
      script.type = "module";
      script.textContent = scriptModule;
      document.body.appendChild(script);
    
    })();
    </script>
  4. 2

    ES6 módulo de archivos se cargan mediante la estándar de la política de Mismo Origen restricciones que los navegadores de aplicar y que tienen muchas otras restricciones de seguridad en el lugar, mientras que JavaScript «script» archivos tienen mucho más laxa de seguridad para evitar la ruptura de los sitios web como el mejor de los estándares de seguridad se han añadido a los navegadores a lo largo del tiempo. Usted está golpeando a uno de ellos, que es que los archivos deben ser enviados con el tipo MIME correcto.

    file:// Las url no son normales las solicitudes HTTP, y como tales tienen diferentes reglas en torno a las solicitudes. También hay prácticamente no hay reglas para qué tipo MIME se envió. Si desea utilizar ES6 módulos, entonces usted necesita para estar ejecutando un verdadero servidor HTTP localmente para servir a sus archivos.

    • Me estaba preguntando acerca del posible desarrollo de banderas/opciones para poder probar los archivos sin necesidad de un servidor.
    • No creo que usted tiene cualquier otra opción que no sea para ejecutar un servidor.
    • Estoy ejecutando python SimpleHTTPServer. Por qué no es esto suficiente?
  5. 0

    En Windows, no puedo obtener ES de 2016 módulos se carguen correctamente. Incluso si usted deshabilitar la seguridad, luego de ser atropellado por el siguiente prolem que es el .js archivos no tienen un tipo MIME conjunto, de modo que usted obtiene un mensaje de Error al cargar el módulo de secuencia de comandos: El servidor responde con un no-JavaScript tipo de MIME «». Estrictas tipo MIME comprobación se aplica para el módulo de secuencias de comandos por HTML spec.

    La respuesta es el uso de Safari en el macintosh, que permite a los archivos locales no hay problema con ES 2016 módulos. Curiosamente ambos Chrome y Firefox también dejar de funcionar correctamente. Francamente, esto es un error, porque cuando se carga un archivo local, no hay absolutamente nada inseguro acerca de cómo acceder a los archivos de la misma carpeta. Pero la buena suerte de llegar a Google o Firefox para solucionar este problema. Apple aún tiene un indicador acerca de la cruz-permisos de secuencias de comandos en su menú desplegable, para que sepan lo importante que es para deshabilitar la tontería de seguridad de las cosas.

Dejar respuesta

Please enter your comment!
Please enter your name here