Chrome se negó a ejecutar este archivo JavaScript

32

En la cabecera de mi página HTML, tengo:

<script src="https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js"></script>

Cuando cargo la página en mi navegador (Google Chrome v 27.0.1453.116) y habilito las herramientas de desarrollador, dice:

Se negó a ejecutar el script desde ' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js ' porque su tipo MIME ('text / plain') no es ejecutable, y La verificación estricta del tipo MIME está habilitada.

De hecho, el script no se ejecutará. ¿Por qué Chrome cree que este es un archivo de texto sin formato? Claramente tiene una .jsextensión de archivo.

Como estoy usando HTML5, omití el typeatributo, así que pensé que podría estar causando el problema. Así que agregué type="text/javascript"a la <script>etiqueta y obtuve el mismo resultado. Incluso lo intenté type="application/javascript"y todavía recibí el mismo error.

Luego intenté cambiarlo type="text/plain"por curiosidad. El navegador no devolvió un error, pero, por supuesto, JavaScript tampoco se ejecutó.

Finalmente, pensé que los puntos en el nombre del archivo podrían estar apagando el navegador. Entonces, en mi código HTML, cambié todos los puntos al carácter de escape de URL %2E:

<script src="https://raw.github.com/cloudhead/less%2Ejs/master/dist/less-1%2E3%2E3.js"></script>

Esto todavía no funcionó. Lo único que realmente funciona (es decir, el navegador no da un error y el JS se ejecuta con éxito) es si descargo el archivo, lo subo a un directorio local y luego cambio el srcvalor al archivo local. Prefiero no hacer esto ya que estoy tratando de ahorrar espacio en mi propio sitio web.

¿Cómo hago para que Chrome reconozca que el archivo vinculado es en realidad un tipo de JavaScript?

chharvey
fuente

Respuestas:

16

El problema que tiene está fuera de su control, ya que así es como se configura el alojamiento en Github en la ruta que ha mencionado, el tipo de extensión no es solo el factor a la hora de ejecutar archivos, ya que el alojamiento web puede anular la forma en que un El navegador representa un archivo.

Podría tener un archivo .zip renderizado como un archivo .html si el host estaba configurado para hacerlo, puede verificarlo usted mismo usando firebug y viendo la respuesta del encabezado en contra de eso es lo que se solicita ... así que si solicita un archivo JS pero la respuesta del encabezado devuelve un valor esperado diferente, entonces los navegadores respetarán la respuesta del encabezado y no lo que se solicita ...

El alojamiento de github en el subdominio sin procesar está regresando Content-Type text/plain; charset=utf-8como el tipo MIME, lo que significa que no funcionará como JS sino como texto sin procesar, a continuación se muestra un ejemplo de lo que necesitaría que el servidor devuelva para procesar el archivo, y más abajo está El código que está siendo devuelto por github.

Un servidor que admita el tipo JS MIME se verá así:

Accept-Ranges   bytes
Connection  Keep-Alive
Content-Encoding    gzip
Content-Length  31097
Content-Type    application/javascript
Vary    Accept-Encoding
Request Headersview source
Accept  text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

Y esto es lo que el https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.jsencabezado responde como (RAW VIEW).

Accept-Ranges   bytes
Connection  Keep-Alive
Content-Disposition inline
Content-Encoding    gzip
Content-Length  41354
Content-Transfer-Encoding   binary
Content-Type    text/plain; charset=utf-8
Simon Hayter
fuente
Er, que? Entonces, ¿cuál es la solución?
pabrams
2
@pabrams usando un host adecuado dentro de su control es la solución o use rawgit
Simon Hayter
25

Diciembre 2018 editar

RawGit ahora se está cayendo debido al uso malicioso, por lo que recomiendan usar uno de los siguientes servicios:


Publicación original

Rawgithub.com permite a los usuarios tomar las versiones "Raw" de un Git y convertirlo en una URL que se pueda usar en las <script>etiquetas. Es bastante fácil de usar, simplemente elimine el primero .de la URL sin procesar. Por ejemplo, esto:

https://raw.github.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

se convertiría en esto

https://rawgithub.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

y luego lo pones en una <script>etiqueta con el tipo apropiado. Así de simple!

Limitan el número de solicitudes porque está destinado únicamente a fines de desarrollo, no a producción.

2014 editar

Como mencionó Reinderien, rawgithub ahora es solo rawgit, por lo que el nuevo enlace del script sería

https://rawgit.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
Zach Saucier
fuente
66
Dice directamente en la página de inicio de rawgithub, no lo use para sitios de producción . Además, no parece ser un sitio oficial de Github.
DisgruntledGoat
1
Nunca dije que no ...
Zach Saucier
1
Nota: esto ahora redirige a rawgit.com. ¡Y funciona!
Reinderien
1
Este sitio ahora ofrece 403s para solicitudes y los encabezados le dicen que está cayendo.
Michael
@Michael Sad :( Afortunadamente, rawgit proporcionó algunas alternativas en su sitio web, así que actualicé mi respuesta con las proporcionadas.
Zach Saucier
6

La extensión del archivo es irrelevante, lo que importa es el encabezado Content-Type, y ese archivo se sirve con un text/plaintipo de contenido (que es el propósito de la vista "en bruto" de Github).

Realmente debería descargar una copia del archivo localmente en su sitio e incluirlo desde allí. Incluso si funcionó desde Github, ya que no está cargando el archivo JS de forma asincrónica, poner esa <script>etiqueta en el encabezado de su página hace que su sitio dependa de la disponibilidad de Github.

Fuente de tim
fuente
8
"Realmente deberías descargar una copia del archivo localmente en tu sitio e incluirlo desde allí", esa es la clave. No está destinado a ser alojado desde GitHub.
Octopus
@Octopus podemos configurar para descargar y almacenar una copia local de que a continuación, seleccione el script para que mediante programación ..
Sudip Bhandari
1

Como señala Bybe, el problema es que casi todo el contenido servido por raw.github.com se envía como un archivo de texto, de esa manera el contenido se representa en texto sin formato en su navegador sin que se interpongan otras aplicaciones o problemas. De lo contrario, entraría en la situación en la que intentar ver un archivo .js podría hacer que el navegador intente ejecutarlo en lugar de mostrárselo.

Además de eso, ni github ni pages.github están tratando de ser un CDN. Realmente deberías:

  1. Aloje el archivo usted mismo, no es tan grande.
  2. Use un CDN dedicado para este y otros archivos estáticos en su sitio.
  3. Use algo como cdnjs.com que tiene varias versiones de lessjs disponibles .
Zhaph - Ben Duguid
fuente