Chrome refused to execute this JavaScript file
Dec. 2018 edit
RawGit is now sunsetting due to malicious usage, so they recommend to use one of the following services instead:
- jsDelivr
- GitHub Pages
- CodeSandbox
- unpkg
Original post
Rawgithub.com allows users to take the "Raw" versions of a Git and turn it into a URL usable in <script>
tags. It's quite easy to use, simply remove the first .
from the raw URL. For example, this:
https://raw.github.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
would turn into this
https://rawgithub.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
and then you put it into a <script>
tag with the appropriate type. That simple!
They do limit the number of requests because it is meant for development purposes only, not production.
2014 edit
As Reinderien mentioned, rawgithub is now just rawgit, so the new script link would be
https://rawgit.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
The problem you have is out of your control since this is how the hosting is setup at Github on the path that you have mentioned, Extension type is not only the factor when it comes to executing files since the web hosting can over-rule how a browser renders a file.
You could have a .zip file rendering as a .html file if the host was setup to do so, you can check this yourself by using firebug and viewing the header response against that is what is being requested.... so if you request a JS file but the header response returns a different expected value then the browsers will respect the header response and not whats being requested...
The github hosting on the raw subdomain is returning Content-Type text/plain; charset=utf-8
as the MIME type that means it will not exercute as JS but rather as raw text, below is an example what you would need the server to return in order to render the file, and further down is the code that is being returned by github.
A server that supports the JS MIME type will look something like:
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
And this is what https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js
header is responding as as (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
The file extension is irrelevant, it's the Content-Type header that matters, and that file is served with a text/plain
content type (which is the purpose of Github's "raw" view).
You should really download a copy of the file locally to your site and include it from there. Even if it did work from Github, since you're not loading the JS file asynchronously, putting that <script>
tag in your page header makes your site dependent on Github's availability.