HTTPS (Let's Encrypt) + HTTP/2 + Nginx 在本機開發配置

我們在 local 開發時會碰到像是 Facebook Login / Google Login 的等第三方登入,像 Facebook 就要求 callback 網址必須要是 HTTPS 加密的網址。
我們透過 Let’s Encrypt 簽 SSL Certificate,將我們自己的 Domain 設定一個 subdomain 指向到本機 127.0.0.1,這樣就可以順利的在本機使用 HTTPS 開發。

Let’s Encrypt 申請

安裝 Certbot

我們透過 certbot 很容易的就可以申請 let’s encrypt 的 SSL Certificate
先安裝 certbot,在這裡我使用的是 Ubuntu 16.04

1
2
3
4
5
$ sudo apt-get update
$ sudo apt-get install software-properties-common
$ sudo add-apt-repository ppa:certbot/certbot
$ sudo apt-get update
$ sudo apt-get install python-certbot-nginx

透過 DNS 驗證方式申請

因為我們並沒有 public ip,所以在這裡使用 DNS 的方式做 Domain name 所有權的驗證

1
$ certbot -d test.liyang.info --manual --preferred-challenges dns certonly

接著輸入 Email 跟同意使用的條款,直到看到下面的內容

1
2
3
4
5
6
Please deploy a DNS TXT record under the name
_acme-challenge.test.liyang.info with the following value:

qHs9uXOPSJOZQsKxTIjcvyY1cZw02eFdqKsmrFwQrdc

Before continuing, verify the record is deployed.

直接在 DNS Record 設定 txt 之後按下 Enter 就看到,就代表成功了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
-------------------------------------------------------------------------------
Press Enter to Continue
Waiting for verification...
Cleaning up challenges

IMPORTANT NOTES:
- Congratulations! Your certificate and chain have been saved at:
/etc/letsencrypt/live/test.liyang.info/fullchain.pem
Your key file has been saved at:
/etc/letsencrypt/live/test.liyang.info/privkey.pem
Your cert will expire on 2018-07-16. To obtain a new or tweaked
version of this certificate in the future, simply run certbot
again. To non-interactively renew *all* of your certificates, run
"certbot renew"
- Your account credentials have been saved in your Certbot
configuration directory at /etc/letsencrypt. You should make a
secure backup of this folder now. This configuration directory will
also contain certificates and private keys obtained by Certbot so
making regular backups of this folder is ideal.
- If you like Certbot, please consider supporting our work by:

Donating to ISRG / Let's Encrypt: https://letsencrypt.org/donate
Donating to EFF: https://eff.org/donate-le

如果認證失敗的話可以透過 $ nslookup -type=TXT _acme-challenge.test.liyang.info 查詢 DNS Record

Nginx 設定

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
server { 
listen 80;
listen [::]:80;
server_name test.liyang.info;
return 301 https://$server_name$request_uri;
}

server {
server_name dev.1416.tw;
listen 443 ssl http2;
listen [::]:443 ssl http2 default_server;

ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
ssl_ciphers "EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH";

index index.php index.html;
root /var/www/public;

ssl_certificate /var/www/letsencrypt/live/test.liyang.info/fullchain.pem;
ssl_certificate_key /var/www/letsencrypt/live/test.liyang.info/privkey.pem;

}

接著我們就可以透過瀏覽器查看到漂亮的綠色鎖頭了

Comments

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×