Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hotlink resources like JavaScript files directly from GitHub [duplicate]

Tags:

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?

like image 765
Ionică Bizău Avatar asked Dec 01 '13 10:12

Ionică Bizău


People also ask

Does JavaScript work on Github pages?

GitHub Pages is a static site hosting service that takes HTML, CSS, and JavaScript files straight from a repository on GitHub, optionally runs the files through a build process, and publishes a website.


1 Answers

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> 
like image 167
Ionică Bizău Avatar answered Oct 17 '22 05:10

Ionică Bizău