Chrome でオレオレ証明書の localhost にアクセスできない。

去年のアドベントカレンダーで作った Node-RED&音声認識APIでDJに声でリクエストできるサイトですが、年末にいじってみようとChromeからアクセスしたところ、"ERR_CERT_REVOKED"で完全にアクセスできなくなっておりました。。。

localhostなのに"プライバーが保護されません"ってなんだよ！
普通の警告(?)であれば"詳細情報を表示"から"localhostにアクセスする"のリンクが出て警告を突破できるのですが、このエラーはどうもダメです。

いろいろ試してみたんですがどうにもこうにも、このエラーが止まりません。

• How To Fix NET::ERR_CERT_REVOKED Error in Google Chrome
• Chrome58で、HTTPSの自己証明書が NET::ERR_CERT_COMMON_NAME_INVALID になる場合の対応
• オレだよオレオレ認証局で証明書つくる
• subjectAltNameに対応した自己署名証明書の作り方
• Chromeに怒られないオレオレ証明書の作り方

そもそも Let's Encrypt使う手順が本流なので(そりゃそうだろう)、なかなかちゃんとしたオレオレ証明書の作り方には出会いにくいのです。(そりゃそうだろう)

そして出会った以下の記事、これが最後の望み、一縷の光明。。。

• ローカル環境でSSLをオレオレ証明書で行っていて警告が出てる人に朗報

結果、この手順で動いたのです。本当に簡単だったので、ラズパイ4のNode-REDで mkcert使って HTTPS 対応する手順をメモしておきます。

対象環境

OS: Raspbian Buster 4.19
mkcert: v1.4.1

私は Raspbian Buster Lite を VSCode のリモートSSHでやってますがデスクトップ版でも問題ないかと思います。

1. mkcert のインストール

基本は本家サイト Readme.md の手順でOKです。

• mkcert | README.md

またこちらの手順も参考にしました。

• How to create locally trusted SSL Certificates on Linux and macOS with mkcert

まず libnss3-tools のインストールから

$ sudo apt update
...
$ sudo apt install -y libnss3-tools
...

続いてARM版のバイナリをダウンロードをします。(ここがラズパイ！)

$ wget -O mkcert https://github.com/FiloSottile/mkcert/releases/download/v1.4.1/mkcert-v1.4.1-linux-arm
...

パーミッションを追加してパスの通っているディレクトリに放り込めばインストール完了です。

$ sudo chmod +x mkcert 
$ sudo mv mkcert /usr/bin/

2. mkcertの実行

それでは早速、mkcertで証明書の発行を行います。

$ mkcert 
Created a new local CA at "/home/pi/.local/share/mkcert" 💥
Warning: the local CA is not installed in the system trust store! ⚠️
Run "mkcert -install" to avoid verification errors ‼️

Created a new certificate valid for the following names 📜
 - "version"

The certificate is at "./version.pem" and the key at "./version-key.pem" ✅

多分、これだけでも大丈夫なのかも知れませんが、to avoid verification errorsってことで念ためmkcert -installやっておきます。

$ mkcert -install
Using the local CA at "/home/pi/.local/share/mkcert" ✨
The local CA is now installed in the system trust store! ⚡️

はい、OKです！

3. Node-RED の設定変更

mkcertで吐き出した version.pem と version-key.pem を Node-RED から参照します。

...
    https: {
       key: fs.readFileSync('version-key.pem'),
       cert: fs.readFileSync('version.pem')
    },
...

Node-RED の設定は以上です。

4. 起動＆アクセス

それでは Node-RED 起動してみましょう。

$ node-red-start
...

で、Chromeからhttps://localhost:1880(VSCodeでポートフォワードしてます)、もしくは https://raspberrypi.local:1880 にアクセスしてみましょう。

これを待ってましたーー！！

で・・・

無事にSSL対応した Node-RED サイトにアクセスできました。