自分のホームページでjQueryを読み込もうとしたらエラーがでた。
普通にjQueryを読み込もうとしました。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
これだと、ローカルでは普通に動くんですが、サーバーに上げてみるとjQueryが読み込まれていない!コンソールを開いてみたら
Mixed Content: The page at 'https://XXX/index.html' was loaded over HTTPS,
but requested an insecure script 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js'.
This request has been blocked; the content must be served over HTTPS.
と怒られてしまいました。
要は何を言っているかというと、**「このページは暗号化された安全なhttpsなのにさ、jQueryを外部のhttpのサイトから読み込むの?それはダメ!httpsにしてくれ!」**ってことらしいです。
ちょっと調べてみたところ、「http」「https」は省略できるらしい。
「https」を省略したみたけど…
こんなことを防ぐために、こうやって書けるらしいことがわかりました。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
こうすると、そのページを
httpで開いている→jQueryのサイトにhttpでアクセス
httpsで開いている→jQueryのサイトにhttpsでアクセス
という風に自動で割り振ってくれるんです!
これで一件落着と思ったんですが…
省略するとローカルで動かん!!
そうなんです。当たり前ですけどローカルで動かしてる分には「ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js」って何?って話な訳ですから、jQueryが動きません。
しかもhttpsなどの省略はgoogle的には非推奨とのこと。詳しいことはわかりませんが、とにかくローカルで動かないのは不便ですよね。
結論:httpsを使おう
そうです。最初からhttpsを使用すれば全てが丸く収まります。表にしてみるとこんな感じ
ローカル | サーバー | |
---|---|---|
http | ○ | × |
省略 | × | ○ |
https | ○ | ○ |
なのでgoogleさんも奨励しているhttpsを使っていくことにしました。