Chrome ha rifiutato di eseguire questo file JavaScript

Nella testa della mia pagina HTML, ho:

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

Quando carico la pagina nel mio browser (Google Chrome v 27.0.1453.116) e abilito gli strumenti per sviluppatori, si dice:

Si è rifiutato di eseguire lo script da " https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js " perché il suo tipo MIME ("text / plain") non è eseguibile e il controllo rigoroso del tipo MIME è abilitato.

In effetti, lo script non verrà eseguito. Perché Chrome pensa che questo sia un file di testo semplice? Ha chiaramente .jsun'estensione di file.

Dal momento che sto usando HTML5, ho omesso l' typeattributo, quindi ho pensato che potesse causare il problema. Quindi ho aggiunto type="text/javascript"al <script>tag e ho ottenuto lo stesso risultato. Ho anche provato type="application/javascript"e ho ancora avuto lo stesso errore.

Poi ho provato a cambiarlo in type="text/plain"solo per curiosità. Il browser non ha restituito un errore, ma ovviamente neanche JavaScript è stato eseguito.

Alla fine ho pensato che i punti nel nome del file potessero mandare via il browser. Quindi nel mio codice HTML, ho cambiato tutti i punti nel carattere di escape URL %2E:

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

Questo ancora non ha funzionato. L'unica cosa che funziona veramente (cioè il browser non dà un errore e JS funziona correttamente) è se scarico il file, lo carico in una directory locale e quindi cambio il srcvalore nel file locale. Preferirei non farlo poiché sto cercando di risparmiare spazio sul mio sito Web.

Come faccio a far riconoscere a Chrome che il file collegato è in realtà un tipo JavaScript?

Il problema che hai è fuori dal tuo controllo poiché questo è il modo in cui l'hosting è configurato su Github sul percorso che hai menzionato, Il tipo di estensione non è solo il fattore quando si tratta di eseguire file poiché l'hosting web può sovrastare come un il browser esegue il rendering di un file.

Potresti avere un rendering del file .zip come file .html se l'host è stato configurato per farlo, puoi controllarlo tu stesso usando firebug e visualizzando la risposta dell'intestazione rispetto a ciò che è richiesto .... quindi se richiedi un file JS ma la risposta dell'intestazione restituisce un valore atteso diverso, quindi i browser rispetteranno la risposta dell'intestazione e non ciò che viene richiesto ...

L'hosting github sul sottodominio Content-Type text/plain; charset=utf-8non elaborato sta tornando come tipo MIME, il che significa che non si eserciterà come JS ma piuttosto come testo non elaborato, di seguito è riportato un esempio di ciò che sarebbe necessario che il server restituisse per eseguire il rendering del file, e più in basso è il codice che viene restituito da Github.

Un server che supporta il tipo JS MIME sarà simile a:

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

E questo è ciò che l' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.jsintestazione risponde come (VISTA RAW).

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

Modifica dicembre 2018

RawGit ora sta tramontando a causa di un utilizzo dannoso, quindi consigliano invece di utilizzare uno dei seguenti servizi:

• jsDelivr
• Pagine GitHub
• CodeSandbox
• unpkg

Posta originale

Rawgithub.com consente agli utenti di prendere le versioni "Raw" di un Git e trasformarlo in un URL utilizzabile nei <script>tag. È abbastanza facile da usare, basta rimuovere il primo .dall'URL non elaborato. Ad esempio, questo:

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

si trasformerebbe in questo

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

e poi lo metti in un <script>tag con il tipo appropriato. Così semplice!

Limitano il numero di richieste perché è destinato esclusivamente a scopi di sviluppo, non alla produzione.

Modifica 2014

Come menzionato da Reinderien, rawgithub ora è solo rawgit, quindi il nuovo link dello script sarebbe

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

L'estensione del file è irrilevante, è l'intestazione Content-Type che conta e quel file viene servito con un text/plaintipo di contenuto (che è lo scopo della vista "raw" di Github).

Dovresti davvero scaricare una copia del file localmente sul tuo sito e includerlo da lì. Anche se ha funzionato da Github, poiché non stai caricando il file JS in modo asincrono, inserire quel <script>tag nell'intestazione della pagina rende il tuo sito dipendente dalla disponibilità di Github.

Questa è una funzione intenzionale progettata per prevenire determinati attacchi XSS .

Come spiega Mike West , non usare raw.github.comcome CDN; usa invece GitHub Pages .

Inoltre, la codifica esplicita dei caratteri senza prenotazione non cambierà il modo in cui viene trattato l'URL.

Come sottolineato da bebe, il problema è che quasi tutto il contenuto offerto da raw.github.com viene inviato come file di testo, in questo modo il contenuto viene visualizzato in testo normale nel browser senza altre applicazioni o problemi che si frappongono. Altrimenti potresti entrare nella situazione in cui il tentativo di visualizzare un file .js potrebbe causare al browser il tentativo di eseguirlo anziché mostrartelo.

Inoltre, né github né pages.github stanno cercando di essere un CDN. Dovresti davvero o:

1. Ospita il file da solo, non è così grande.
2. Usa un CDN dedicato per questo e altri file statici sul tuo sito.
3. Usa qualcosa come cdnjs.com che ha varie versioni di lessjs disponibili .