web-dev-qa-db-ja.com

ChromeはこのJavaScriptファイルの実行を拒否しました

私のHTMLページの先頭には、次のものがあります。

<script src="https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js"></script>

ブラウザ(Google Chrome v 27.0.1453.116)でページをロードし、開発者ツールを有効にすると、次のように表示されます。

' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js 'からのスクリプトの実行を拒否しました。MIMEタイプ( 'text/plain ')は実行可能ではなく、厳密なMIMEタイプのチェックが有効になっています。

実際、スクリプトは実行されません。なぜChromeはこれがプレーンテキストファイルであると考えるのですか?明らかに.jsファイル拡張子が付いています。

HTML5を使用しているため、type属性を省略したため、問題の原因であると考えました。そこで、type="text/javascript"<script>タグに追加し、同じ結果を得ました。 type="application/javascript"を試しても、同じエラーが発生しました。

次に、好奇心からtype="text/plain"に変更してみました。ブラウザはエラーを返しませんでしたが、もちろんJavaScriptも実行されませんでした。

最後に、ファイル名のピリオドがブラウザを無効にしている可能性があると考えました。したがって、私のHTMLコードでは、すべてのピリオドをURLエスケープ文字%2Eに変更しました。

<script src="https://raw.github.com/cloudhead/less%2Ejs/master/dist/less-1%2E3%2E3.js"></script>

これはまだ機能しませんでした。本当に機能するのは(つまり、ブラウザがエラーを出さず、JSが正常に実行される)唯一のことは、ファイルをダウンロードし、ローカルディレクトリにアップロードし、src値をローカルファイルに変更することです。私は自分のウェブサイトのスペースを節約しようとしているので、これをやめたいです。

リンクされたファイルが実際にJavaScriptタイプであることを認識するためにChromeを取得するにはどうすればよいですか?

31
chharvey

これはあなたが言及したパスでGithubでホスティングを設定する方法であるため、あなたの問題は制御できません.Webホスティングはファイルを実行する際の要因であるだけでなく、Webホスティングはブラウザはファイルをレンダリングします。

ホストがそうするようにセットアップされている場合、.Zipファイルを.htmlファイルとしてレンダリングすることができます。firebugを使用し、それに対するヘッダー応答を表示することで、これを自分で確認できます。 JSファイルですが、ヘッダー応答は異なる期待値を返します。ブラウザは要求されたものではなくヘッダー応答を尊重します...

生のサブドメインでホスティングしているgithubは、MISタイプとしてContent-Type text/plain; charset=utf-8を返します。つまり、JSとしてではなく生のテキストとして実行されます。以下は、ファイルをレンダリングするためにサーバーが返す必要がある例です、さらに下にあるのは、githubによって返されるコードです。

JS MIMEタイプをサポートするサーバーは次のようになります。

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

そして、これはhttps://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.jsヘッダーが(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
16
Simon Hayter

12月2018編集

RawGitは現在、悪意のある使用により廃止されているため、代わりに次のサービスのいずれかを使用することをお勧めします。


元の投稿

Rawgithub.com を使用すると、ユーザーはGitの「未加工」バージョンを取得して、<script>タグで使用可能なURLに変換できます。使い方は非常に簡単で、生のURLから最初の.を削除するだけです。たとえば、this:

https://raw.github.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

になりますthis

https://rawgithub.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

そして、適切なタイプの<script>タグに入れます。簡単!

本番環境ではなく開発目的のみを対象としているため、リクエストの数を制限します。

2014 edit

Reinderienが述べたように、rawgithubは現在rawgitに過ぎないため、新しいスクリプトリンクは

https://rawgit.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js
25
Zach Saucier

ファイル拡張子は関係ありません。重要なのはContent-Typeヘッダーであり、そのファイルはtext/plainコンテンツタイプ(Githubの「生」ビューの目的)で提供されます。

実際にファイルのコピーをサイトにローカルにダウンロードし、そこから含める必要があります。 Githubから機能していても、JSファイルを非同期にロードしていないため、ページヘッダーに<script>タグを挿入すると、サイトがGithubの可用性に依存するようになります。

6
Tim Fountain

これは、 特定のXSS攻撃 を防ぐように設計された意図的な機能です。

マイクウエストの説明 のように、raw.github.comをCDNとして使用しないでください。代わりに GitHub Pages を使用してください。

また、予約されていない文字を明示的にエンコードしても、URLの処理方法は変わりません。

2
Lèse majesté

bybe指摘 問題は、raw.github.comによって提供されるほとんどすべてのコンテンツがテキストファイルとして送信されることです。この方法では、コンテンツは他のアプリケーションなしでブラウザにプレーンテキストでレンダリングされます。または邪魔になる問題。そうしないと、.jsファイルを表示しようとすると、ブラウザーが表示せずに実行しようとする場合があります。

その上、githubもpages.githubもCDNになろうとはしていません。あなたは本当にどちらかをする必要があります:

  1. 自分でファイルをホストします。それほど大きくはありません。
  2. サイト上のこの静的ファイルやその他の静的ファイルには専用のCDNを使用します。
  3. lessjsが利用可能 のさまざまなバージョンを持つcdnjs.comのようなものを使用します。
1