http、httpsを省いたURLの指定

SSLで暗号化しているページにアクセスする場合は、https://~というURLを使いますが、このページにhttp://で始まるリンクが含まれていると、ブラウザによっては警告が表示されます。

例えば、JQueryをCDN(コンテンツを配置している外部のサービス)からリンクする場合、次のような書き方ができますが、


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

同じようにSSLのページでJQueryをリンクする場合は、


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

と、書かないと、IEでページを見た時に以下のような警告が出てしまいます。

scheme-alert.png

 

なので、テンプレートなどを使い、HTMLの一部を共通化しようとした場合、SSL用と非SSL用で分けてテンプレートを用意しないといけなくなりますが、実は、分けなくてもいい書き方があります。

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

とプロトコル部分を省いて書くと、ブラウザの方で自動的に、今表示しているページのURLのプロトコルに合わせてリンク先を見てくれます。警告も表示されません。

Googleのサイトでも、例としてこのような書き方を紹介していますね。( https://developers.google.com/speed/libraries/devguide )

 

しかし、この書き方の場合、作成時に別の問題が発生します。

作成したhtmlファイルは、そのままクリックするなり、ブラウザにドラッグすれば、表示されますが、この時のURLは、file://~ で始まるURLになります。

なので、上の書き方をした場合、プロトコルの部分が、file:と認識され、 file://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js へアクセスしようとして失敗してしまいます。

そのため、JavaScriptの動きの確認ができません。

 

このような場合は、実際にWebサーバを動かして、確認するしかありません。Macの場合は、Apacheがインストールされているのでそれを使うか、XAMPPMAMPといったパッケージを使って、Apacheを動かすこともできます。ただ、この場合、しかるべき場所にhtmlファイルを置かないといけないのでちょっと面倒です。

そこで、もっとお手軽な方法があります。

 

Macの場合、Pythonというプログラミング言語が最初からインストールされていますが、このPythonを使って簡単なWebサーバを起動することができます。

ターミナルアプリを起動して、コマンドラインから、


$ python -m SimpleHTTPServer

と入力します。これで、ブラウザから、localhost:8000/にアクセスすると、コンテンツの確認ができます。

終了する時は、control + c で強制終了させます。

 

起動したディレクトリがドキュメントルートになってくれるのが便利です。

例えば、起動したディレクトリにtest.htmlがあれば、


http://localhost:8000/test.html

で、表示させることができます。

アクセスログもターミナルに表示されます。

 

また、Windowsの場合は、Mongoose(https://code.google.com/p/mongoose/)を使うと良いかもしれません。ダウンロードしたexeを適当なフォルダに置いて起動すると、そのフォルダをドキュメントルートとしてWebサーバが起動します。ブラウザからは、


http://localhost:8080/

でアクセスできます。

終了するには、タスクバーのインディケータアイコンを右クリックして、Exitを選択します。

 

なお、Mongooseは、Linux版やMac版もあるようです。