09.27 高級前端必須要懂得nginx知識

作為一個前端,你可能不需要懂太多後端的知識,也不需要懂太多運維方面的技術,但nginx的兩個常用的知識點你一定要懂,它們就是

反向代理與負載均衡。

高級前端必須要懂得nginx知識

什麼是反向代理與負載均衡

什麼是反向代理

當我們有一個服務器集群,並且服務器集群中的每臺服務器的內容一樣的時候,同樣我們要直接從個人電腦訪問到服務器集群服務器的時候無法訪問,必須通過第三方服務器才能訪問集群

這個時候,我們通過第三方服務器訪問服務器集群的內容,但是我們並不知道是哪一臺服務器提供的內容,此種代理方式稱為反向代理

什麼是負載均衡

公司會建立很多的服務器,這些服務器組成了服務器集群,然後,當用戶訪問網站的時候,先訪問一箇中間服務器,再讓這個中間服務器在服務器集群中選擇一個壓力較小的服務器,然後將該訪問請求引入選擇的服務器

所以,用戶每次訪問,都會保證服務器集群中的每個服務器壓力趨於平衡,分擔了服務器壓力,避免了服務器崩潰的情況

一句話:nginx會給你分配服務器壓力小的去訪問

Nginx反向代理與負載均衡的實現

用戶訪問網站的時候首先會訪問nginx服務器,然後nginx服務器再從服務器集群中選擇壓力較小的服務器,將該訪問請求引向該服務器

nginx配置

下面修改配置方面我就從mac系統下來進行簡單的演示,如何安裝的話也暫以mac為主了,windows系統直接去Nginx官網下載安裝即可

安裝nginx
1-進到homebrew官網,然後複製命令,預安裝需要的東西
2-brew install nginx 安裝nginx
3-nginx -v 顯示版本號
進入nginx
cd /usr/local/etc/nginx

下圖為進入nginx文件夾下的文件內容

高級前端必須要懂得nginx知識

當進到這個目錄下,我們就可以操作nginx了,接下來就列舉一些非常非常有用的命令,多敲幾遍,一定要記住nginx常用命令

啟動nginx

nginx

當你敲完nginx這5個鍵的時候,並沒有任何反應,此時你只需訪問localhost:8080(默認)即可

高級前端必須要懂得nginx知識

關閉nginx

如果出現下圖情況,不要驚慌,是因為之前nginx被啟動過了,或者端口被其他應用佔用了。

解決方法:只需nginx -s stop,停止nginx服務或者修改端口號

然後再次啟動nginx即可

高級前端必須要懂得nginx知識

重啟nginx

nginx -s reload

每次修改完.conf文件就需要重啟nginx

檢查配置

檢查修改的nginx.conf配置是否正確

nginx -t

如果出現下面ok和successfull就代表正確了,其他的都不對

 nginx: the configuration file /usr/local/etc/nginx/nginx.conf syntax is ok
nginx: configuration file /usr/local/etc/nginx/nginx.conf test is successful

對於我們前端來說正常工作當中,倒是不需要過多的修改nginx的。我們之所以修改nginx配置,是為了做一些反向代理罷了

proxy_pass

nginx反向代理主要通過proxy_pass來配置,將你項目的開發機地址填寫到proxy_pass後面,正常的格式為proxy_pass URL即可

server {
listen 80;
location / {
proxy_pass http://10.10.10.10:20186;
}
}

Upstream模塊實現負載均衡

  • ip_hash指令
  • server指令
  • upstream指令及相關變量

上面寫的三個指令,我們直接通過代碼來一一分析

// 修改nginx.conf
worker_processes 1;
events {
worker_connections 1024;
}
http {
upstream firstdemo {
server 39.106.145.33;
server 47.93.6.93;
}
server {
listen 8080;
location / {
proxy_pass http://firstdemo;
}
}
}

上面修改的nginx.conf就是上圖中花圈的那個文件,nginx配置的主要修改就在這裡。化繁為簡,把原本nginx.conf裡的內容直接替換為上面的不到20行的代碼了

既然不到20行,那就把裡面對應的內容統統解釋一下吧,有個瞭解就好

  • worker_processes

工作進程數,和CPU核數相同

  • worker_connections
  • 每個進程允許的最大連接數
  • upstream模塊
  • 負載均衡就靠它
  • 語法格式:upstream name {}
  • 裡面寫的兩個server分別對應著不同的服務器
  • server模塊
  • 實現反向代理
  • listen監督端口號
  • location / {}訪問根路徑
  • proxy_pass http://firstdemo,代理到firstdemo裡兩個服務器上

上面修改了nginx.conf之後,別忘了最重要的一步重啟nginx

那麼再次訪問localhost:8080,會看到如下圖頁面

高級前端必須要懂得nginx知識

還有另一個頁面

高級前端必須要懂得nginx知識

每次刷新都會訪問不同的服務器,這樣就做到了負載均衡處理不過,更應該做到的是當用戶第一次訪問到其中一臺服務器後,下次再訪問的時候就直接訪問該臺服務器就好了,不用總變化了。那麼就發揮了ip_hash的威力了

// 省略...
upstream firstdemo {

ip_hash;
server 39.106.145.33;
server 47.93.6.93;
}

ip_hash它的作用是如果第一次訪問該服務器後就記錄,之後再訪問都是該服務器了,這樣比如第一次訪問是33服務器,那之後再訪問也會分配為33服務器訪問了

工作中的簡單使用

在公司開發項目的時候,遇到設計,產品走查環節的時候,不能每次都讓他們去配一個host,畢竟這樣不友好,走查起來有麻煩。所以更應該給他們直觀的感受,既給一個訪問地址就可以看到樣子

下面給大家看一下,我正常在公司時nginx做的反向代理配置,和咱們上面的如出一轍,只是加了一個server_name,用指定的域名去訪問即可

server {
listen 80;
server_name chd.news.so.m.qss.test.so.com ;
auth_basic off;
location / {
proxy_pass http://10.10.10.10:20186;
proxy_set_header Host $host;
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_connect_timeout 60;
proxy_read_timeout 600;
proxy_send_timeout 600;
}
}

每次修改完nginx配置後不要忘記重啟nginx才能生效,這樣只需要訪問chd.news.so.m.qss.test.so.com這個地址就可以查看我的開發環境,進行走查了。

這就是nginx最大的功能,反向代理我也接觸的不是很多,畢竟不是專業運維出身,可比性差了很多。略知一二,也只是方便大家工作中使用吧,再次感謝大家的收看了,哈哈


分享到:


相關文章: