前後端分離專案配置Nginx、配https及http強制跳轉https
阿新 • • 發佈:2018-11-05
本篇文章主要解決以下幾個問題:
- 前後端分離專案如何配置Nginx
- 配置https協議訪問
- 開啟http訪問但強制跳轉https訪問
基本的安裝就不多說了,直奔主題。
本文基於ubuntu系統,另外假定有幾個前提條件:
- 主機地址為
192.168.10.10
- 後端專案啟動埠為
192.168.10.10:8000
- 前端程式碼會呼叫後端的info和test兩個url地址
- 前端靜態檔案目錄 /var/www/html/project
1 基本配置
http下server基本配置如下
server { listen 80; server_name 192.168.10.10 # 配置根地址訪問的靜態資源 location /{ root /var/www/html/project; } # 配置可被nginx轉發的介面地址 location /info{ proxy_pass http://127.0.0.1:8000; } location /test{ proxy_pass http://127.0.0.1:8000; } }
現在訪問http://192.168.10.10
就可以進去首頁了
如果訪問不了首頁,可以嘗試修改location /
為以下內容:
location /{
root /var/www/html/project;
index index.html index.htm;
try_files $uri /index.html;
}
2 配置HTTPS
配置https,可以使用自簽名證書和購買機構頒發的證書。
這裡我們使用自簽名證書。
執行以下語句生成簽名和祕鑰
sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout /etc/ssl/private/nginx-selfsigned.key -out /etc/ssl/certs/nginx-selfsigned.crt
將會有如下所示:
OutputCountry Name (2 letter code) [AU]:US
State or Province Name (full name) [Some-State]:New York
Locality Name (eg, city) []:New York City
Organization Name (eg, company) [Internet Widgits Pty Ltd]:Bouncy Castles, Inc.
Organizational Unit Name (eg, section) []:Ministry of Water Slides
Common Name (e.g. server FQDN or YOUR name) []:server_IP_address
Email Address []: [email protected]_domain.com
適當填寫提示。
最重要的一行是Common Name (e.g. server FQDN or YOUR name)那一行,您需要輸入與伺服器關聯的域名,或者是您伺服器的公共IP地址。
現在主機裡面已經有以下兩個檔案了
/etc/ssl/private/nginx-selfsigned.key
/etc/ssl/certs/nginx-selfsigned.crt
繼續填寫nginx配置,我們新增一欄server,填寫以下配置
server {
listen 443;
server_name 192.168.10.10
ssl on;
ssl_certificate /etc/ssl/certs/nginx-selfsigned.crt;
ssl_certificate_key /etc/ssl/private/nginx-selfsigned.key;
# 配置根地址訪問的靜態資源
location /{
root /var/www/html/project;
}
# 配置可被nginx轉發的介面地址
location /info{
proxy_pass http://127.0.0.1:8000;
}
location /test{
proxy_pass http://127.0.0.1:8000;
}
}
現在就可以訪問https://192.168.10.10
了
3 http跳轉https
在http的nginx的配置中加一句重定向 rewrite ^(.*)$ https://$host permanent;
即可
整個配置如下
server {
listen 80;
server_name 192.168.10.10
# http強制跳轉https地址
rewrite ^(.*)$ https://$host permanent;
# 配置根地址訪問的靜態資源
location /{
root /var/www/html/project;
}
# 配置可被nginx轉發的介面地址
location /info{
proxy_pass http://127.0.0.1:8000;
}
location /test{
proxy_pass http://127.0.0.1:8000;
}
}
4 注意
location /{
root /var/www/html/project;
index index.html index.htm;
try_files $uri /index.html;
}
以上配置可能導致的問題,在地址後面加上任意的字尾後能訪問首頁,例如http://192.168.10.10/qwewqr/
這樣的配置實際上是不正確的,去掉以下內容後,就能提示404 No Found
了
index index.html index.htm;
try_files $uri /index.html;