参考にさせていただいたページ
- https://qiita.com/ty_1592/items/86e1966fe2888140f215
- macOS CatalinaでChromeからオレオレ証明書のHTTPSサイトにアクセスできない場合の対処法 - Qiita
- Macでキーチェーンアクセスを使用してキーチェーンに証明書を追加する - Apple サポート (日本)
今日の環境
- macOS Monterey(バージョン12.3)(Intel)
- Google Chrome バージョン: 99.0.4844.74
問題
最近はChromeだと「〜〜 にアクセスする(安全ではありません)」というリンクがデフォルトでは表示されなくなり、警告を無視してページを閲覧することができなくなりましたので、開発時には不便です。
やりたいこと
httpsプロトコルを使って、開発中のページをMacのChromeで閲覧したい。
基本的な手順
1. 開発中のページにSafariでアクセスする
まず開発中のページをSafariで閲覧しようとすると以下のような警告ページが表示されます。
「詳細を表示」ボタンをクリックすると以下のようになります。
「証明書を見る」をクリックすると以下のようになります。
「> 信頼」をクリックしてアコーディオンを開くと以下のようになっているので、「この証明書を使用するとき」という項目のプルダウンから「常に信頼」を選択しておきます。
後でキーチェーンアクセスを見たときにどの証明書が追加されたのかわかるように、「> 詳細な情報」をクリックして証明書の詳細を確認したり、キーチェーンアクセスアプリケーションを起動して既に追加済の証明書を確認しておくと良いと思います。
「OK」ボタンを押して警告ページに戻り、「このWebサイトを閲覧」のリンクをクリックして、開発中のページを閲覧します。
これでキーチェーンアクセスに証明書が追加されるらしい。されるはず。されてほしい。
2. キーチェーンアクセスを開いて、証明書が追加されたか確認する
- キーチェーンアクセスを開いて、目当ての証明書が追加されているか確認しますが、これがなぜか追加されるときもあるような、されないときもあるような。よくわからなくてしばらくハマっていました。以下に貼った画像には、example.comとか書いてありますが、ご自身の環境に合わせて読み替えてください。
しばらくハマっていましたが、以下のようなことを色々試しているうちに、いつの間にか証明書が追加されていました...。
- キーチェーンアクセスを一度終了して、開きなおす
- Macを再起動する
- 解放されている別ポートにSafariを使って再度アクセスし、警告を無視して進んでみる
- 開発中のページにFirefoxを使ってアクセスし「証明書を確認」をクリックしたり、pemファイルをダウンロードしてみる
3. Chromeの警告ページに「〜〜 にアクセスする(安全ではありません)」を表示させる
- 手順2で貼った画像のように、目当ての証明書が追加されればもうこっちのものです。
- 手順2で貼った画像でいうところの青くなっている「example.com | 証明書 | 2121/10/02 17:21:08 | ログイン」のところをダブルクリックします。
- 証明書の詳細が表示されるので、「> 信頼」をクリックして、アコーディオンを開き、「この証明書を使用するとき」という項目のプルダウンから「常に信頼」を選択します。
- 変更には管理者権限が必要なので、パスワードを入力します。
- 開発中のページをChromeで閲覧しようとすると警告ページが表示されますが、「詳細設定」をクリックすれば「〜〜 にアクセスする(安全ではありません)」が表示されるようになって、以下の画像のようになっています。あとは「〜〜 にアクセスする(安全ではありません)」をクリックするだけです。
なぜかキーチェーンアクセスに証明書が追加されないとき試すとよさそうなこと
Firefoxでアクセスして、pemファイルをダウンロードしてみると良いかもしれないです。
Firefoxでアクセスしたときに、以下のようなページが表示されます。この画像の「証明書を確認」をクリックします。
証明書の詳細な内容が表示され、以下のように「PEM(証明書)」「PEM(チェーン)」というリンクがあるのでクリックすると、pemファイルがダウンロードできます。
その後「Macでキーチェーンアクセスを使用してキーチェーンに証明書を追加する - Apple サポート (日本)」にあるように、ドラッグすると追加できるかもしれません。
試したわけではないので上手くいくかはわかりませんが、今日の私と同じくお困りのどなたかのお役に立てば幸いです。