【Laravel 5.x】httpで動いていたのに、https環境でBootstrapが効かない。

はじめに

3年前ぐらいにLaravel5で作られたアプリをローカルに落としてきてhttpsで接続しようとし、DockerでPHPのバージョンを変えて色々検証していたのですが、Bootstrapをうまく読み込んでくれなかったので、そのメモ

assetのパスも確認したのですが、そこはおかしくなかったので、

解決法

簡単でした。

共通する部分はlayoutの下のapp.blade.phpに書き込んでいるCDNのURLがhttp://になっていたのをhttps://に変更したらうまくいくようになりました。

// 元の書き方
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>

// 変更した書き方
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" />
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>

参考記事によると//でもうまくいくようですが、あまり推奨はされていないようです。httpsで通信するのがもう基本にはなりつつあるみたいですね。

Auth0で認証を使うときもリダイレクト先のURLをhttpsで指定されているので、localhostでもhttpsで出来る環境にしておくのはもはや義務ですね。

参考記事

株式会社ジェイクール【ホームページ更新代行・制作】