本地開發環境, apache/nginx繫結域名啟用HTTPS

摘要： 使用lvh.me域名, 建立本地ssl證書: lvh.me 是一個指向127.0.0.1 的泛域名服務, 優點: 不需要改DNS/hosts, 各專案使用不同的域名方便隔離. 類似的還有xip.io, nip.io, localtest.me, fuf.me, vcap.me等....

使用lvh.me域名, 建立本地ssl證書:

lvh.me 是一個指向127.0.0.1 的泛域名服務, 優點: 不需要改DNS/hosts, 各專案使用不同的域名方便隔離. 類似的還有xip.io, nip.io, localtest.me, fuf.me, vcap.me等.

mkdir ~/.ssl; cd ~/.ssl;
openssl req -new -keyout lvh.me.key -x509 -nodes -new -out lvh.me.crt -subj "/CN=*.lvh.me" -reqexts SAN -extensions SAN -config <(cat /System/Library/OpenSSL/openssl.cnf <(printf '[SAN]\nsubjectAltName=DNS:lvh.me,DNS:*.lvh.me')) -sha256 -days 3650;
open lvh.me.crt; # 鑰匙串 開啟
# 搜尋 *.lvh, 雙擊新增的證書, 設定始終信任 (Trust - When using this certificate: Always Trust).

使用Apache或Nginx配置域名和虛擬機器

本地域名繫結 apache

# 1. 編輯 `/etc/apache2/httpd.conf`, 新增行:
ServerName localhost
# 取消這些行的註釋:
Include /private/etc/apache2/extra/httpd-vhosts.conf
LoadModule proxy_module libexec/apache2/mod_proxy.so
LoadModule proxy_http_module libexec/apache2/mod_proxy_http.so
LoadModule macro_module libexec/apache2/mod_macro.so
LoadModule ssl_module libexec/apache2/mod_ssl.so
Include /private/etc/apache2/extra/httpd-ssl.conf
LoadModule socache_shmcb_module libexec/apache2/mod_socache_shmcb.so
LoadModule http2_module libexec/apache2/mod_http2.so

# 2. 編輯 `/private/etc/apache2/extra/httpd-vhosts.conf`, 增加:
<Macro SSLLvh>
SSLEngine on
SSLCertificateFile /Users/leon/.ssl/lvh.me.crt
SSLCertificateKeyFile /Users/leon/.ssl/lvh.me.key
Protocols h2 http/1.1
</Macro>
<Macro Site>
ServerName leon.lvh.me
ProxyRequests off
<Location />
ProxyPass http://localhost:3000/
ProxyPassReverse http://localhost:3000/
</Location>
</Macro>
<VirtualHost *:80>
Use Site
</VirtualHost>
<VirtualHost *:443>
Use SSLLvh
Use Site
</VirtualHost>
# 3. 啟動Apache
# sudo apachectl configtest # test
sudo apachectl -k restart # 啟動
# sudo apachectl -e debug # print errors

本地域名繫結 nginx

sudo apachectl -k stop # 停止 apache 服務
brew install nginx
# 編輯 `/usr/local/etc/nginx/nginx.conf`
# listen 80; 改為: listen 80;
# roothtml; 改為:
# root /Users/leon/Downloads;
# autoindex on;
# include servers/*; 改為: include conf.d/*.conf;

chmod 755 /Users/leon/Downloads
mkdir /usr/local/etc/nginx/conf.d;
# 編輯 `/usr/local/etc/nginx/conf.d/test.conf`;
server {
listen 80;
server_name leon.lvh.me;
# SSL # include lvh_ssl.conf;
listen 443 ssl http2;
ssl_certificate /Users/leon/.ssl/lvh.me.crt;
ssl_certificate_key /Users/leon/.ssl/lvh.me.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv3:+EXP;
ssl_prefer_server_ciphers on;
location / {
# root /Users/leon/Downloads;
# autoindex on;
proxy_pass http://localhost:3000;
proxy_set_header Host $host;
}
}
# brew services list
sudo brew services restart nginx # 啟動
# sudo brew services stop nginx
sudo nginx -s reload # 重啟

接下來就可以使用https://leon.lvh.me 訪問本地專案了.