節約テクノロジ >

GitHubにJavaScriptファイルを置いて直接Scriptで読み込む方法(GitHub直リンク抽出ブックマークレット)

GitHubにJSファイルを置いてScriptタグで直リンクすると以下の様なエラーになります。

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

ここではブックマークレットを使ったScriptタグ用直リンクを抽出する方法を紹介します。

目次

  1. 使い方
  2. 解説
  3. 参考リンク

使い方

1.以下のリンクをブックマークバーにドラッグします。

GitHub直JSリンク

2.GitHubで目的のJSファイルを開きます(RAWではありません)。URLがhttps://github.com/ユーザー名/プロジェクト名/blob/master/スクリプト.jsになっていることを確認します。

3.上記で作成したブックマークレットをクリックします。表示されるURLをScriptタグにて参照してください。

(Chromeの最新版ではダイアログのコピーができなくなりました。別のブラウザで行うか、Twitterで要望を送っていただければすぐに対応します。)

解説

githubではraw.github.comで生データを出力する時にMIMEがtext/plainになってしまい、ブラウザがエラーを出してしまいます。

そこで対策用のドメインが用意されており上記の生リンクURLのドメインをrawgithub.comとすることでブラウザで利用できるURLが作成できます。

あくまで上記の方法は開発時用です。絶対に本番での運用では使わない様にしてください。rawgithub.comに負荷がかかりサービス停止などに繋がる恐れがあります。

参考リンク

この記事を見た人がよく読んでいる記事

節約テクノロジ >

トップページ

節約テクノロジ > GitHubにJavaScriptファイルを置いて直接Scriptで読み込む方法(GitHub直リンク抽出ブックマークレット)