Site cover image

Site icon image 制作メモ

Description is here. The icon, the title, the description can be modified in Notion.

常時SSL化に伴う Mixed Content(混在コンテンツ)を一発解消する正規表現

Mixed Content (混在コンテンツ)とはSSLのサイト内に読み込まれている非SSLのコンテンツのことです。

ブラウザは Mixed Content (混在コンテンツ)が存在する限り安全な通信状態とは認めてくれず、悲しいことにアドレスバーの左端に表示されるSSLの証である????マークさえも奪い取ります。

Mixed Content (混在コンテンツ)として扱われるのは主に、

  • javascript
  • CSS
  • iframe
  • Webフォント
  • 画像

などで、タグでいうところの

  • <script>
  • <link>
  • <iframe>
  • <img>

などです。

それらの src または href 属性内の http: を https: に置き換えてあげればいいわけですが、ひとつひとつ探して置き換えていこうものならこっちの精神状態の安全性まで奪い取られます。

そんなときおすすめなのが Dreamweaver の一括置換機能です。

ディレクトリ内をまるごと検索して一括置換することができます。

Dreamweaver で一括置換

Dreamweaver を起動し、ctrl(command) + F を押下します。

検索および置換ウィンドウが開いたら検索対象をフォルダーにし、対象フォルダーを選択します。

検索と置換のフィールドに下記のコードを入力します。

順番は関係ないのでどれからはじめても大丈夫です。

すべて置換をクリックすると一括置換が実行さるのですが、稀に予想だにしないコードがヒットしてしまうことがありますので、まずはすべて検索で何がヒットするか確認してみた方が良いです。

すべて置換は一度実行すると元に戻すことができない一撃必殺なので、必ずバックアップをとってから行うことを強くお奨めします。

<script>

検索:<script(.+?)src="http:
置換:<script$1src="https:

<link>

検索:<link(.+?)href="http:
置換:<link$1href="https:

<iframe>

検索:<iframe(.+?)src="http:
置換:<iframe$1src="https:

<img>

検索:<img(.+?)src="http:
置換:<img$1src="https:

おまけ

Mixed Content とは直接関係ないですが、最後に内部リンクです。

301リダイレクトしておけば問題ないのですが、絶対パスで指定している場合は https: に変更までやってあげると今日もいい仕事したなと思えます。

www の有無がすでに統一されているなら、wwwありもしくはwwwなしをやればいいです。

どちらも混在している場合はどちらかに統一した方が良いです。

wwwあり

検索:<a(.+?)href="http://www\.example\.com
置換:<a$1href="https://www.example.com

wwwなし

検索:<a(.+?)href="http://example\.com
置換:<a$1href="https://example.com

wwwありに統一

検索:<a(.+?)href="http://(www\.)?example\.com
置換:<a$1href="https://www.example.com

wwwなしに統一

検索:<a(.+?)href="http://(www\.)?example\.com
置換:<a$1href="https://example.com

これでおしまいです。

正規表現は .htacces や php、javascript などあらゆる場面で使えるので、是非習得しておきたいスキルのひとつですね。

おいおい全然一発解消じゃないじゃないか!

と思った方。

それは違います。

<script>の置き換えだけで済めばそれはやっぱり一発解消なのです。