2

<script src="ファイル名"></script>でPHPファイルを指定した時の挙動は何に基づくのでしょうか?
・何の仕様を確認すれば良いでしょうか?
・PHP?
・ECMASCRIPT?
・HTML5?


疑問点

・拡張子がPHPファイルなので、PHPファイルが動作するのは分かるのですが、<script src>で指定したphpファイルに header("Content-type: application/javascript");を付与しなくてもjavaScriptが動作するのは何故でしょうか?
<script src>で指定したから?
・そもそも、どうしてPHPファイルを指定できるのか、よく分かりません

2 件の回答 2

9

packet0さんの指摘の通り、<script src=…>で指定したコンテンツのContent-Typeがtext/javascriptでなくてもJavaSriptとして実行されますが、それでも text/javascrpt を指定することを強く推奨します。それはセキュリティ上の理由からです。

<script src...>に動的コンテンツを指定する典型例として JSONP があります。JSONPのContent-Typeはtext/javascriptが正ですが、text/htmlを指定していると、クロスサイトスクリプティング(XSS)となる場合があります。例えば、JSONPとして返送されるコールバック関数が下記だったとします。

callback(['<img src=# onerror=alert(1)>'])

これを返すPHPのURLをアドレスバーに指定して直接実行した場合を考えます。

Content-Type: text/html の場合 alert(1) が実行される
Content-Type: text/javascript の場合 そのまま表示される

このように、JavaScriptの中に、HTMLタグがあり、JavaScriptを実行する形になっていると、XSS脆弱性になる場合があります。

加えて、目的外の呼び出し方を防ぐことをさらに確実にするためのレスポンスヘッダとして下記があります。元々はMicrosoftが提唱したものですが、現在は主要ブラウザで有効です。

X-Content-Type-Options: nosniff

これを指定しておくと、text/htmlやapplication/jsonのコンテンツを <sciprt src=...に読ませると、エラーになります。

まとめると以下です。

  • Content-Typeは正確に指定することが望ましい
  • それにより、想定外の呼び出し方によりXSS脆弱性となることを防止する効果がある
  • Content-Typeを厳密に解釈させるためのレスポンスヘッダとして、X-Content-Type-Options: nosniff がある
  • X-Content-Type-Options: nosniff を指定した場合、<script src=... にtext/javascript以外のコンテンツを指定するとエラーになる。これはセキュリティ上の理由による
8

HTML5からtypeのデフォルトはtext/javascriptなので、何も指定しない場合JSとして処理されます。また現状JS以外にブラウザが処理できるスクリプトはないので、typeを何かJS以外に指定した場合、タグの中身は無視されます(DOMにテキストとしては存在する)。

タイプの判断はtype属性だけ考慮されるので、HTTPのヘッダーをPHPで指定する必要もありませんし、しても無視されます。

<script>srcを指定した場合起こるのは、そのファイルを取得して、charsetでファイルのバイトを文字化して、<script></script>の中に展開、です。そのあとはインラインだった場合と同じようにスクリプトが実行されるので、何かしらファイルを取得できるアドレスであればsrcは何でも良いのです。動画でも、exeでも、何でも指定はできます。ただその場合ダウンロードはされますが、テキストデータではないので、charsetに含まれないバイト列にぶつかった段階でエラーを吐いて、そのタグに関する処理終わります。

1
  • >HTML5からtypeのデフォルトはtext/javascript。HTML5仕様なのですね。初めて知りました。リンク提示ありがとうございます
    – re9
    Commented 2017年2月28日 11:28

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。