AuthorProxy AuthorProxy - 7 months ago 26
Javascript Question

Link and execute external JavaScript file hosted on GitHub

When I try to change the linked reference of a local JavaScript file to a GitHub raw version my test file stops working. The error is:


Refused to execute script from ... because its MIME type (
text/plain
) is not executable, and strict MIME type checking is enabled.


Is there a way to disable this behavior or is there a service that allows linking to GitHub raw files?

Working code:

<script src="bootstrap-wysiwyg.js"></script>


Non-working code:

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>

Answer

There is a good workaround for this, now, by using rawgit.com.

Steps:

  1. Find your link on GitHub, and click to the "Raw" version of the file.
  2. Copy the URL, and link to it.
  3. Change raw.githubusercontent.com to rawgit.com (non-production) or cdn.rawgit.com (production)

Example: http://raw.githubusercontent.com/user/repo/branch/file.js

For non-production environments, such as jsFiddle, replace raw.github.com with rawgit.com:

http://rawgit.com/user/repo/branch/file.js

For production environments, replace raw.githubusercontent.com with cdn.rawgit.com:

http://cdn.rawgit.com/user/repo/tag/file.js

Also note that for production environments, consider targeting a specific tag - not the branch, to ensure you're getting the specific version of the file that you expect, rather than the head version, which will change over time.


Why is this needed?

GitHub started using X-Content-Type-Options: nosniff, which instructs more modern browsers to enforce strict MIME type checking. It then returns the raw files in a MIME type returned by the server - preventing the browser from using the file as-intended (if the browser honors the setting).

For background on this topic, please refer to this discussion thread.