Nginx 配置大全，全面解析
前言
對于自己上線項目的前端來說，nginx也是必須要了解和熟悉的，查了很多的nginx文章，看著寫的都很詳細，但是卻沒有了整體的概念。這里就重新梳理一遍，也理清思路。
我們在安裝nginx之后，會自動生成很多的文件，但是nginx.conf這個文件是我們的核心，如何去正確的修改和優化它是nginx的核心。
首先我們可以先看下原本的配置，你會覺得無所適從，因為感覺這個鬼東西也太多了吧。而且感覺根本就不理解，也不知道該怎么寫。下面，就一步一步的教你如何入門到熟悉
一.nginx.conf原本配置到解釋
看到這個118行是不是覺得有點害怕。
#user nobody;
worker_processes 1;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';
#access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
#gzip on;
server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index index.html index.htm;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}
# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}
# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;
# location / {
# root html;
# index index.html index.htm;
# }
#}
# HTTPS server
#
#server {
# listen 443 ssl;
# server_name localhost;
# ssl_certificate cert.pem;
# ssl_certificate_key cert.key;
# ssl_session_cache shared:SSL:1m;
# ssl_session_timeout 5m;
# ssl_ciphers HIGH:!aNULL:!MD5;
# ssl_prefer_server_ciphers on;
# location / {
# root html;
# index index.html index.htm;
# }
#}
}沒關系，我們把其中的注釋都刪掉，除掉了注釋之后的nginx代碼，現在只有22行了。感覺好多了
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location / {
root html;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}注解版本：
#nginx進程數，建議設置為等于CPU總核心數。
worker_processes 1;
# 事件區塊開始
events {
#單個進程最大連接數（最大連接數=連接數*進程數）
#根據硬件調整，和前面工作進程配合起來用，盡量大，但是別把cpu跑到100%就行。每個進程允許的最多連接數，理論上每臺nginx服務器的最大連接數為。
worker_connections 1024;
}
#設定http服務器，利用它的反向代理功能提供負載均衡支持
http {
#include：導入外部文件mime.types，將所有types提取為文件，然后導入到nginx配置文件中
include mime.types;
#默認文件類型
default_type application/octet-stream;
#開啟高效文件傳輸模式，sendfile指令指定nginx是否調用sendfile函數來輸出文件，對于普通應用設為 on，如果用來進行下載等應用磁盤IO重負載應用，可設置為off，以平衡磁盤與網絡I/O處理速度，降低系統的負載。注意：如果圖片顯示不正常把這個改成off。
#sendfile指令指定 nginx 是否調用sendfile 函數（zero copy 方式）來輸出文件，對于普通應用，必須設為on。如果用來進行下載等應用磁盤IO重負載應用，可設置為off，以平衡磁盤與網絡IO處理速度，降低系統uptime。
sendfile on;
#長連接超時時間，單位是秒
keepalive_timeout 65;
# 第一個Server區塊開始，表示一個獨立的虛擬主機站點
server {
# 提供服務的端口，默認80
listen 80;
# 提供服務的域名主機名
server_name localhost;
#對 "/" 啟用反向代理,第一個location區塊開始
location / {
root html; #服務默認啟動目錄
index index.html index.htm; # 默認的首頁文件，多個用空格分開
}
# 錯誤頁面路由
error_page 500 502 503 504 /50x.html; # 出現對應的http狀態碼時，使用50x.html回應客戶
location = /50x.html { # location區塊開始，訪問50x.html
root html; # 指定對應的站點目錄為html
}
}
}二.整體基本理解
雖然上面有了注解，但是看起來還是很迷糊。接著解釋：我們可以把nginx.conf分為三個部分進行理解：
- 第一部分：全局塊
- 第二部分：events塊
- 第三部分：http塊
對應圖解：
圖片
全局塊：
作用：從配置文件開始到 events 塊之間的內容，主要會設置一些影響nginx 服務器整體運行的配置指令，主要包括配 置運行 Nginx 服務器的用戶（組）、允許生成的 worker process 數，進程 PID 存放路徑、日志存放路徑和類型以 及配置文件的引入等。
比如上面第一行配置的：
worker_processes 1;這是 Nginx 服務器并發處理服務的關鍵配置，worker_processes 值越大，可以支持的并發處理量也越多，但是 會受到硬件、軟件等設備的制約。
events塊：
作用：events 塊涉及的指令主要影響 Nginx 服務器與用戶的網絡連接，常用的設置包括是否開啟對多 work process 下的網絡連接進行序列化，是否 允許同時接收多個網絡連接，選取哪種事件驅動模型來處理連接請求，每個 word process 可以同時支持的最大連接數等。
worker_connections 1024;上述例子就表示每個 work process 支持的最大連接數為 1024。
這部分的配置對 Nginx 的性能影響較大，在實際中應該靈活配置。
http塊：
作用：這算是 Nginx 服務器配置中最頻繁的部分，代理、緩存和日志定義等絕大多數功能和第三方模塊的配置都在這里。
需要注意的是：http 塊也可以包括 http全局塊、server 塊。
- http全局塊
http全局塊配置的指令包括文件引入、MIME-TYPE 定義、日志自定義、連接超時時間、單鏈接請求數上限等。
- server 塊
這塊和虛擬主機有密切關系，虛擬主機從用戶角度看，和一臺獨立的硬件主機是完全一樣的，該技術的產生是為了 節省互聯網服務器硬件成本。
- 每個 http 塊可以包括多個 server 塊，而每個 server 塊就相當于一個虛擬主機。
- 而每個 server 塊也分為全局 server 塊，以及可以同時包含多個 locaton 塊。
- 全局 server 塊
最常見的配置是本虛擬機主機的監聽配置和本虛擬主機的名稱或IP配置。
- location 塊
一個 server 塊可以配置多個 location 塊。
這塊的主要作用是基于 Nginx 服務器接收到的請求字符串（例如 server_name/uri-string），對虛擬主機名稱 （也可以是IP 別名）之外的字符串（例如 前面的 /uri-string）進行匹配，對特定的請求進行處理。地址定向、數據緩 存和應答控制等功能，還有許多第三方模塊的配置也在這里進行。
圖片
三.最簡單的上線
以上，我們就知道了nginx整體大致的結構，以及每部分的結構是用于做什么的。接下來我們就修改nginx關鍵位置來實現我們網站的代理功能。看著nginx配置很繁瑣，但是如果你只是需要上線一個網站，那么你只需要去修改兩個地方即可：
圖片
我們可以使用默認簡單的配置，然后指定server_name和root，主要是告訴nginx代理的ip是xxx，然后我放在服務器的文件在bbb文件夾即可。nginx便會在用戶訪問這個ip時，自動的將bbb文件夾中的index.html返回到瀏覽器來展示頁面。
四.nginx優化：
1.前端history模式404問題：
location / {
try_files $uri $uri/ /index.html;
}這段代碼的作用是，當用戶刷新頁面時，Nginx會先檢查當前URL是否存在，如果不存在，就會嘗試訪問index.html，從而可以正常顯示頁面。
圖片
2.反向代理：
相信大家作為前端都了解跨域問題，目前前端的主流解決跨域的方式就是
- 開發生產cors解決
- 開發proxy，生產nginx解決。
如何配置：
#接口端
location /police/ {
proxy_pass http://192.168.1.182:8852/police/;
proxy_redirect default;
proxy_http_version 1.1;
proxy_connect_timeout 60;
proxy_send_timeout 60;
proxy_read_timeout 90;
}具體位置：
圖片
理解：
這段代碼的意思：大致就是如果遇到以/police請求開頭的接口，那么就去訪問這個ip地址(http://192.168.1.182:8852/police/)的后臺端口。
例如我們通過axios去訪問/police/getList這個后臺接口時，nginx會將這個請求轉發到ip端口為http://192.168.1.182:8852的后臺中，后臺將結果返回給nginx，nginx再把結果給到瀏覽器，實現反向代理。
定義多個端口的反向代理：
copy上面的，直接修改代理頭和proxy_pass即可。
圖片
3.開啟gzip：
作用：
開啟gzip對于前端來說還是比較重要的，瀏覽器加載的包大概能節約一半的空間。例如首頁需要加載a.js文件，該文件為900kb，在開啟gzip之后，瀏覽器會去加載a.js經過gzip之后的文件a.js.gz，大概只有450kb，能夠很好的提升瀏覽速度。
如何配置：
gzip on; # 默認off，是否開啟gzip
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
# 上面兩個開啟基本就能跑起了，下面的愿意折騰就了解一下
gzip_static on;
gzip_proxied any;
gzip_vary on;
gzip_comp_level 6;
gzip_buffers 16 8k;
# gzip_min_length 1k;
gzip_http_version 1.1;具體位置：
圖片
4.維護頁面：
作用：
在系統進行維護升級時，用戶打開我們的網站看到的維護頁面。
如何配置：
# 系統臨時維護請打開下面這行注釋，并重啟nginx,維護完畢后請注釋下年這行,并重啟nginx
# rewrite ^(.*)$ /maintainace.html break;具體位置：
圖片
5.一個ip上線多個網站：
作用：
只有一個ip。利用nginx上線多個網站。例如訪問192.168.1.154:8080訪問我們的個人博客網站，訪問192.168.1.154:8081訪問我們的直播網站。
如何配置：
直接復制server塊即可，一個server塊就代表了一個網站，需要改端口和文件的路徑等內容。
# 第一個網站：個人博客項目配置
server {
listen 8080;
root /data/www/hexo;
index index.html;
location / {
try_files $uri $uri/ /index.html; # 路由模式history的修改
}
}
# 第二個網站：直播網站項目配置
server {
listen 8081;
root /data/www/geov;
index index.html;
location / {}
}具體位置：
圖片
注意點：
- 這里的8081一定要你的服務器開放了這個端口才可以使用，否則你按照這個配置了也會訪問不到（讓后端去配）。
- 如果是云服務器（比如阿里云，騰訊云），則需要開放相應的入口為8081,否則用戶訪問不到。
6.動靜分離
作用：
在Web開發中，通常來說，動態資源其實就是指那些后臺資源，而靜態資源就是指HTML，JavaScript，CSS，img等文件。
一般來說，都需要將動態資源和靜態資源分開，將靜態資源部署在Nginx上，當一個請求來的時候，如果是靜態資源的請求，就直接到nginx配置的靜態資源目錄下面獲取資源，如果是動態資源的請求，nginx利用反向代理的原理，把請求轉發給后臺應用去處理，從而實現動靜分離。
在使用前后端分離之后，可以很大程度的提升靜態資源的訪問速度，同時在開過程中也可以讓前后端開發并行可以有效的提高開發時間，也可以有些的減少聯調時間 。
解析：
實際上我們在代理前端的html和接口時就已經做到了動靜分離。我們打包后的dist包實際上就是純靜態的資源，所以直接訪問nginx靜態資源服務器，就不需要經過后臺的tomcat。訪問接口時，就需要nginx先去訪問后臺服務器，拿到結果再給到瀏覽器
圖片
圖解：
圖片
如何配置（其實是優化，因為一般配置會有動靜分離）：
假設有比較大的圖片等需要放置到服務器上，然后通過nginx來轉發。或者是有一個純前端的開源項目（如pdf.js），也需要放在服務器上。如果放在本地代碼包，打包出來體積會很大。
location /image/ {
root /var/filecenter/;
}
location /static/ {
root /var/filecenter/;
}
location /car/ {
root /var/filecenter/;
}
location ~ .*\.(html|htm|gif|jpg|jpeg|bmp|png|ico|js|css)$ {
root /Users/dalaoyang/Downloads/static;
}具體位置：
圖片
7.其他優化
這里只講了一些nginx基礎的知識和一些基礎的優化，基本上夠用了。但是如果你需要追求更高的性能，那么可以添加其他的優化，只需要根據一些搜索到的文章內容copy過來就行了，nginx主要還是配置多一些，但是理解了整體結構和脈絡的話，其實就還是蠻簡單的。這里就不做過多的講解了。
五.nginx基礎命令：安裝，啟動，重啟，關閉
安裝nginx：
yum install nginx看是否有nginx進程：
netstat -anput | grep nginx查看服務器端口占用情況：
netstat -ntlpnginx啟動:
nginxnginx重啟:
nginx -s reload關閉nginx：
- nginx -s stop : 快速停止nginx
- nginx -s quit ：完整有序的停止nginx
查看默認的nginx配置文件路徑：
nginx -t注：如果有nginx.conf配置的更改，需要重啟nginx配置才會生效。如果只是更改dist包/html，則可以不重啟nginx。
