概要と経緯

自己署名した証明書を信頼することになる点をご理解してご利用ください
Chrome などで開発環境のHTTPSサーバーに対して REST API でアクセスするときに、 NET::ERR_CERT_AUTHORITY_INVALID や NET::ERR_CERT_COMMON_NAME_INVALID が発生するのを防ぎたい
(自己署名証明書の利用時の警告マークを消したい)

環境

Server

AWS
Ubuntu 20.04.2 LTS
nginx version: nginx/1.18.0 (Ubuntu)
OpenSSL 1.1.1f 31 Mar 2020

Client

Windows 10
Chrome Version 94.0.4606.81 (Official Build) (64-bit)

Ubuntuでの作業

準備

対話形式で設定するのが手間がかかるので、ファイルから読み込む形式を採用
crt.cnf と csr.cnf を任意のディレクトリに保存する
- ２つのファイルの内容を適宜書き換える
- commonName と DNSは統一する（nginxの設定、hostsの設定も含めて）

cd /home/ubuntu/
mkdir self_signed_cert
cd self_signed_cert
cp /path/to/crt.cnf .
cp /path/to/csr.cnf .

csr.cnf

[ req ]
default_bits       = 2048
distinguished_name = distinguished_name
req_extensions = req_extensions
prompt = no

[ distinguished_name ]
countryName                = JP
stateOrProvinceName        = MyState
localityName               = localityName
organizationName           = MyOrganization
commonName                 = hogehoge.com

[ req_extensions ]
subjectAltName = @alt_names

[ alt_names ]
DNS.1   = hogehoge.com

crt.cnf

subjectAltName = DNS:hogehoge.com

鍵の作成

openssl genrsa 2048 > server.key

証明書署名要求の作成と確認

openssl req -new -key server.key -config csr.cnf -out server.csr
openssl req -text < server.csr

証明書の作成と確認

openssl x509 -days 365 -req -sha256 -signkey server.key -extfile crt.cnf < server.csr > server.crt
openssl x509 -text -in server.crt -noout

PKCS #12 の作成

openssl pkcs12 -export -in server.crt -inkey server.key -out server.p12

nginx の設定（一部抜粋）

ssl_certificate /home/ubuntu/self_signed_cert/server.crt;
ssl_certificate_key /home/ubuntu/self_signed_cert/server.key;

server_name hogehoge.com;

Windows での作業

hostsの設定

IPはAWSのグローバルIPを設定

100.100.100.100 hogehoge.com

Windowsに証明書をインポート

先ほど作成した PKCS #12 server.p12 を用意
Chromeから [プライバシーとセキュリティー] - [セキュリティ] - [証明書の管理] を選択
[信頼されたルート証明機関] - [インポート]
server.p12 を選択してインポート

ブラウザで確認

参考にしたサイト