Hotlink resources like JavaScript files directly from GitHub

Question

I asked a question about including resources from GitHub and the answer was to use the raw link:

https://raw.github.com/username/repository/branch/file.js

I am trying to include a script using:

<script
   type="text/javascript"
   src="https://raw.github.com/username/repo/master/src/file.js"
></script>

but I get the following error:

Refused to execute script from 'https://raw.github.com/username/repo/master/src/file.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

Are there any alternatives to fix this error?

Usage example

I don't use this in the production but for a demo page:

project-repository-from-github
  ├─ master
  │   ├─ src
  │   │   └─ my-jQuery-plugin.js
  │   └─ README.md
  └─ gh-pages
      ├─ css
      │   └─ style.css
      └─ index.html

In the index.html page I want to have the latest build of my-jQuery-plugin.js. So, I would include the raw URL to the script.

How do I fix the error?

Answer 1

Yes, Github changed this in April, 2013:

We added the X-Content-Type-Options: nosniff header to our raw URL responses way back in 2011 as a first step in combating hotlinking. This has the effect of forcing the browser to treat content in accordance with the Content-Type header. That means that when we set Content-Type: text/plain for raw views of files, the browser will refuse to treat that file as JavaScript or CSS.

But thanks to http://combinatronics.com/ we can include GH scripts. The only change is from raw.github.com that becomes combinatronics.com:

<script
   type="text/javascript"
   src="https://combinatronics.com/username/repo/master/src/file.js"
></script>

The project is hosted on Github being open-source.

And yes, @Lix is correct. The files are not being served from Github but from combinatronics.

---

Another workaround I found is that instead of:

<script
   type="text/javascript"
   src="https://combinatronics.com/username/repo/master/src/file.js"
></script>

you can use $.getScript jQuery function:

<script>
  $.getScript("https://combinatronics.com/username/repo/master/src/file.js", function () {
    /* do something when loaded */
  });
</script>

Answer 2

The best solution for me that I found is to use GitHub pages: https://pages.github.com/

The restriction is that you can use only one branch from the repo for keeping your scripts (namely: gh-pages branch)

sample usage
push test.js script to gh-pages branch of the REPO.

the script is out there at yourusername.github.io/REPO/test.js (it may take about 10 minutes to update)

Other solutions
http://rawgithub.com good for development as well as for production (with CDN) if you don't change your scripts (the CDN caches a particular url forever).