HTTPS化 作業MEMO

[mapconcierge]

自己署名証明書を作成（ローカル環境向け）

ローカルで HTTPS を動作させる場合、自己署名証明書を作成して nginx に設定するのが簡単。

Step 1: SSL証明書を作成

まず、自己署名証明書を作成します。

sudo mkdir -p /etc/nginx/ssl

cd /etc/nginx/ssl

自己署名証明書期限 365日の場合

sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout nginx-selfsigned.key -out nginx-selfsigned.crt

自己署名証明書期限 3年(1095日)の場合

sudo openssl req -x509 -nodes -days 1095 -newkey rsa:2048 -keyout nginx-selfsigned.key -out nginx-selfsigned.crt

入力時のポイント

• Common Name (CN) には unvtportable0x.local を入力
• 他の項目（国、組織名など）は適宜入力

Step 2: nginx の設定を変更

sudo nano /etc/nginx/sites-available/default

unvtportable0x.local の 0x には適宜ホスト名に修正（3行目と19行目の２箇所にある）

server {
    listen 443 ssl;
    server_name unvtportable0x.local;

    ssl_certificate /etc/nginx/ssl/nginx-selfsigned.crt;
    ssl_certificate_key /etc/nginx/ssl/nginx-selfsigned.key;

    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers HIGH:!aNULL:!MD5;

    location / {
        root /var/www/html;
        index index.html index.htm;
    }
}

server {
    listen 80;
    server_name unvtportable0x.local;
    return 301 https://$host$request_uri;
}

Step 3: NGINX の再起動

sudo systemctl restart nginx

Step 4: ブラウザで HTTPS にアクセス

https://unvtportable0x.local

⚠ 自己署名証明書なので、ブラウザで「この接続は安全ではありません」と表示される
→ 詳細設定 → 例外を追加して続行 でアクセス可能。

[mapconcierge]

作業ログ

unvt@unvtportable01:~ $ ls
unvt@unvtportable01:~ $ sudo mkdir -p /etc/nginx/ssl
unvt@unvtportable01:~ $ cd /etc/nginx/ssl
unvt@unvtportable01:/etc/nginx/ssl $ ls
unvt@unvtportable01:/etc/nginx/ssl $ pwd
/etc/nginx/ssl
unvt@unvtportable01:/etc/nginx/ssl $ sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout nginx-selfsigned.key -out nginx-selfsigned.crt
.+...........+.+..+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*....+.......+...+.....+.+...+...+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*.........+...+......+.+.....+.............+...........+.........+..........+...........+....+.....+.+...........+.........+................+.....+...+....+.....+.+.........+.....+......+.......+...+.....+....+.....+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
..+......+.+.....+....+...+........+...+......+....+......+........+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*...+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*........+...+.....+................+.....+....+..+......+..........+...............+..+...............+......+.+......+........+.+......+...+...........+.+..+.+..+....+.....+...+............+.+...+.....+....+..+.+..+..................+...+.+........+...+.......+...+...+...........+......+...+....+.....+......+.......+...+...........+......+.......+............+........+.+............+...+......+.....+.+..+.......+........+...+...+....+......+.....+..........+......+...+......+..+...+....+...+.........+...+..+................+.....+....+...+..+...+......+....+........+.......+..+.+.....+............+...+............+..........+..+.+..+.......+......+...+..+....+......+..+..........+...........+....+......+..+....+...............+...+...+..+.+....................+..........+...........................+.....+.............+..+.............+.........+........+.......+..+.+..+.+......+........+.+..+...+............+.............+...........+...+...............+.+.........+...+.....+....+......+........+.........+..........+...+........+.+...........+.........+.+...+...........+...+...+....+......+..+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
-----
You are about to be asked to enter information that will be incorporated
into your certificate request.
What you are about to enter is what is called a Distinguished Name or a DN.
There are quite a few fields but you can leave some blank
For some fields there will be a default value,
If you enter '.', the field will be left blank.
-----
Country Name (2 letter code) [AU]:IT
State or Province Name (full name) [Some-State]:xx
Locality Name (eg, city) []:xxxxx
Organization Name (eg, company) [Internet Widgits Pty Ltd]:xxxxx
Organizational Unit Name (eg, section) []:xxxxx
Common Name (e.g. server FQDN or YOUR name) []:xxxxx xxxxx
Email Address []:[email protected]
unvt@unvtportable01:/etc/nginx/ssl $ sudo nano /etc/nginx/sites-available/default
unvt@unvtportable01:/etc/nginx/ssl $ sudo systemctl restart nginx

[mapconcierge]

HTTPS化すると、当然ブラウザのセキュリティチェックかかる

詳細を表示 ＞ このWebサイトを閲覧 で表示できる。

[mapconcierge]

Geolocation API 動作確認