Chrome a refusé d'exécuter ce fichier JavaScript
En tête de ma page HTML, j'ai:
<script src="https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js"></script>
Lorsque je charge la page dans mon navigateur (Google Chrome 27.0.1453.116) et que j'active les outils de développement, le message suivant s'affiche:
Refusé d'exécuter le script à partir de ' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js ' car son type MIME ('text/plain ') n'est pas exécutable et la vérification de type MIME stricte est activée.
En effet, le script ne fonctionnera pas. Pourquoi Chrome pense-t-il qu'il s'agit d'un fichier texte? Il a clairement une extension de fichier .js.
Comme j'utilise HTML5, j'ai omis l'attribut type, alors j'ai pensé que cela pouvait être à l'origine du problème. J'ai donc ajouté type="text/javascript" à la balise <script> et j'ai obtenu le même résultat. J'ai même essayé type="application/javascript" et j'ai toujours la même erreur.
Puis j'ai essayé de le changer en type="text/plain" juste par curiosité. Le navigateur n'a pas renvoyé d'erreur, mais le JavaScript n'a bien sûr pas été exécuté non plus.
Enfin, j'ai pensé que les points du nom du fichier risquaient de jeter le navigateur. Donc, dans mon code HTML, j'ai remplacé toutes les périodes par le caractère d'échappement d'URL %2E:
<script src="https://raw.github.com/cloudhead/less%2Ejs/master/dist/less-1%2E3%2E3.js"></script>
Cela n'a toujours pas fonctionné. Si je télécharge le fichier, le télécharge dans un répertoire local, puis modifie la valeur src dans le fichier local. Je préfère ne pas le faire car j'essaie de gagner de la place sur mon propre site web.
Comment faire en sorte que Chrome reconnaisse que le fichier lié est en réalité un type JavaScript?
Le problème que vous rencontrez est hors de votre contrôle, car c’est ainsi que l’hébergement est configuré chez Github sur le chemin que vous avez mentionné. Le type d’extension n’est pas seulement le facteur à prendre en compte lorsqu’il s’agit d’exécuter des fichiers, car l’hébergement Web peut dominer la navigateur rend un fichier.
Vous pourriez avoir un rendu de fichier .Zip sous forme de fichier .html si l'hôte était configuré pour le faire, vous pouvez le vérifier vous-même en utilisant firebug et en visualisant la réponse de l'en-tête par rapport à celle demandée ... donc si vous demandez un fichier JS mais la réponse en-tête renvoie une valeur attendue différente, puis les navigateurs respectent la réponse en-tête et non ce qui est demandé ...
L'hébergement github sur le sous-domaine brut renvoie Content-Type text/plain; charset=utf-8 en tant que type MIME, ce qui signifie qu'il ne s'exercera pas en tant que JS mais en tant que texte brut. Vous trouverez ci-dessous un exemple de ce que vous auriez besoin du serveur pour restituer le fichier. , et plus bas, le code renvoyé par github.
Un serveur prenant en charge le type JS MIME ressemblera à ceci:
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
Et c'est ce que l'en-tête https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js répond en tant que (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
déc. 2018 modifier
RawGit est maintenant dépassé en raison d'une utilisation malveillante, il est donc recommandé d'utiliser l'un des services suivants:
Message original
Rawgithub.com permet aux utilisateurs de prendre les versions "brutes" d'un Git et de les transformer en une URL utilisable dans les balises <script>. C'est assez facile à utiliser, il suffit de supprimer le premier . de l'URL brute. Par exemple, this:
https://raw.github.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
se transformerait en ceci
https://rawgithub.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
et ensuite vous le mettez dans une balise <script> avec le type approprié. C'est simple!
Ils limitent le nombre de demandes car il est destiné uniquement à des fins de développement et non de production.
édition 2014
Comme Reinderien l’a mentionné, rawgithub n’est plus que rawgit, le nouveau lien de script serait donc
https://rawgit.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
L'extension de fichier est sans importance, c'est l'en-tête Content-Type qui compte et ce fichier est servi avec un type de contenu text/plain (qui est le but de la vue "brute" de Github).
Vous devriez vraiment télécharger une copie du fichier localement sur votre site et l'inclure à partir de là. Même si cela fonctionnait avec Github, puisque vous ne chargiez pas le fichier JS de manière asynchrone, placer cette balise <script> dans l'en-tête de votre page rend votre site dépendant de la disponibilité de Github.
Ceci est une fonctionnalité intentionnelle conçue pour empêcher certaines attaques XSS .
Comme Mike West explique , n'utilisez pas raw.github.com comme CDN; utilisez GitHub Pages à la place.
En outre, le codage explicite des caractères non réservés ne changera pas le traitement de l'URL.
Comme bybe souligne , le problème est que presque tout le contenu fourni par raw.github.com est envoyé sous forme de fichier texte. Ainsi, le contenu est restitué en texte brut dans votre navigateur sans autre application. ou des problèmes de l'obstruction. Sinon, vous risqueriez de voir le fichier tenter de l'exécuter plutôt que de vous le montrer.
En plus de cela, ni github ni pages.github n'essayent d'être un CDN. Vous devriez vraiment soit:
- Hébergez le fichier vous-même, ce n'est pas si gros.
- Utilisez un CDN dédié pour cela et d’autres fichiers statiques sur votre site.
- Utilisez quelque chose comme cdnjs.com qui a différentes versions de lessjs available .