Local（macOS）のSSLのFirefoxの警告を回避する方法

投稿日 2022年2月23日

WordPressのローカル環境構築ツール「Local 」のSSL設定がmacOSでうまくいかない場合の対処法を見つけたのでメモっておきます。

LocalのウェブサイトにSSL設定についての特設ページ（英語）があって、macOS Big Sur以降での設定方法が書かれているんですが、この設定をしてもFirefoxでは「潜在的なセキュリティリスクあり」という警告が出てしまいます。

以下は、この警告を回避するための設定方法です。

以前このブログで紹介したmkcertというコマンドラインツールを使って証明書と鍵を発行して、それらをLocalで使う方法です。

環境

以下の環境で設定と動作確認をしました。違うバージョンでは設定やフォルダの場所などが異なる場合があるのでご注意ください。

まずはmkcertというコマンドラインツールをインストールします。僕はHomebrewを使ってインストールしました。他にもMacPortsを使う方法がmkcertのGitHubページに書いてあります。

mkcertと一緒にFirefox用にnssというツールもインストールします。

brew install mkcert
brew install nss

以下のコマンドで証明書と鍵の発行元となるローカル認証局（CA）をインストールします。

重要： mkcertのGitHubページにも書いてありますが、このコマンドで作成された鍵ファイルは絶対にシェアしないようにしてください！

mkcert -install

Localでドメイン名を「blockme.local」に設定したサイト用の証明書と鍵を作成します。ドメイン名は自分が設定したものに変更してコマンドを実行してください。

Local 6.3.0で作成したサイトの証明書と鍵は~/Library/Application Support/Local/run/router/nginx/certsに保存されています。

まずは、そのディレクトリに移動します。

cd ~/Library/Application Support/Local/run/router/nginx/certs

以下のコマンドで、mkcertを使ってblockme.local用の証明書と鍵を作成します。「blockme.local」の部分は自分が設定したドメイン名に置き換えてコマンドを実行してください。

mkcert blockme.local

これで、blockme.local.pemとblockme.local-key.pemという2つのファイルが作成されます。

次に、これら2つのファイル名を変更します。

mv blockme.local-key.pem blockme.local.key
mv blockme.local.pem blockme.local.crt

Localを再起動してサイトを開始（START SITE）すれば完了です！

これで、Firefoxで「https」のURLにアクセスしても警告が出ないようになります。もちろん、ChromeとSafariでも問題なくSSLで接続できます。

以上、macOS Monterey（Big Sur以降）で、WordPressのローカル開発環境ツール「Local」のSSL設定をする方法でした！

2022年2月23日に公開された記事です。

「明日のウェブ制作に役立つアイディア」をテーマにこのブログを書いています。アメリカの大学を卒業後、ボストン近郊のウェブ制作会社に勤務。帰国後、東京のウェブ制作会社に勤務した後、ウェブ担当者として日英バイリンガルのサイト運営に携わる。詳しくはこちら。

ウェブ制作・ディレクション、ビデオを含むコンテンツ制作のお手伝い、執筆・翻訳のご依頼など、お気軽にご相談ください。いずれも日本語と英語で対応可能です。まずは、Mastodon @rriver@vivaldi.net 、Twitter @rriver 、またはFacebook までご連絡ください。