今朝の新発見あるいは少しだけ発明

今朝、昨日のTAVI患者さんを診察している間に思いついたのです HomePageには様々な Javascript frameworkを呼び込みますが、これらの有名な Frameworkには CDN (Content Delivery Network)というのが設けられており、そこにアクセスすることにより、高速に安定して Framework codeを読み込むことができます

ですからこれを使用すべきなのですが、ローカルでの開発段階ではしばしばインターネットにアクセスできないので、ローカル側に Framework code fileを置いておく必要があります しかし、この場合、インターネット上で走っているのか、ローカルで走っているのかで場合分けする必要があります

これに対して僕は今まで、php programを書いて以下のようにしていました 例は jQueryを読み込む場合です

<?php
	if ($_SERVER['HTTP_HOST'] == 'localhost') {
		echo '<script src="../bootstrap/js/jquery-2.1.4.min.js"></script>';
	} else {
		echo '<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>';
	}
?>

もちろんこれで作動しますが、問題点の一つとしては、ファイルの拡張子をたとえば index.htmlでなく、index.phpにせねばならないのです(もちろんサーバー側の設定で .phpでなくとも良くなりますが・・・) 何れにしてもこれはサーバー側で動いているので、何だか避けたい気分です

そこで、クライアント側で動く Javascriptを同等のことを実現するにはどうするか? 色々調べた結果このようにしました

<script src = "https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
	if (!window.jQuery) {
		document.write('<script src="./bootstrap/jquery-2.1.4.min.js"><\/script>');
	}
</script>

ここでキーとなるのが、window.jQueryというものです その前の第一行で

https://code.jquery.com/jquery-2.1.4.min.js

より jQuery codeを CDNより読みこんでいますが、ローカルのままでありインターネットに接続していなければ、これは失敗に終わり、windowオブジェクトに jQueryという名前のオブジェクトは登録されていません

従ってこの場合、3行目の条件文は失敗しますので、その場合のみローカルから jQuery codeを読み込むのです

ちなみに、

./bootstrap/jquery-2.1.4.min.js

のようにディレクトリのトップを”./”で参照に持ってきています

これはとても便利です 一種の発明ですよね

あと一つ 大事なことですが、<script> </script>の閉じタグですが、/というのはhtmlの特殊文字の一つなので、エスケープする必要があります

投稿者: (KAMAKURA & SAPPORO)Dr_Radialist

Expert Interventional Cardiologist and Amateur Computer Programmer

「今朝の新発見あるいは少しだけ発明」への1件のフィードバック

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です