前言

最近學習了一下Nginx，整理了一個博客，主要參考的是狂神說的b站視頻教程，文章鏈接如下：狂神說Nginx快速入門

一、下載、啟動Nginx

1.下載Nginx

到Nginx官方選擇自己電腦適用的穩(wěn)定版本下載，我下載的的windows版本。

下載完，就會有一個壓縮包。需要創(chuàng)建一個文件夾用于存放解壓后的nginx內(nèi)容（注意：存放Nginx的文件夾最好不要有中文，否則會報錯），解壓后的內(nèi)容如下所示：

后續(xù)我們經(jīng)常使用到的就是conf配置文件。

2.啟動Nginx

Win+R，運行cmd，切換到nginx解壓之后的目錄：

可以查看下conf目錄中的nginx.conf文件。

用記事本打開，可以看到它的默認端口是80端口，默認訪問域名是以localhost訪問。也就是以后只要訪問80端口，就會被Nginx攔截。

接著，打開瀏覽器，輸入 http://localhost:80并 回車，出現(xiàn)以下內(nèi)容說明Nginx啟動成功了！

也可以在任務管理器中看到nginx是在運行狀態(tài)的。

3.常用命令

強制停止nginx：nginx -s stop
安全退出nginx：nginx -s quit
重新加載配置文件：nginx -s reload （如果修改了配置文件就執(zhí)行這行命令，否則修改就是無效的。前提：nginx服務是啟動的狀態(tài)，否則reload是不成功的。）

二、nginx.conf配置文件分析

最上面的是全局配置；events是最大連接的數(shù)量；http中有一些小模塊，比如靜態(tài)資源文件配置，里面可以配置多個server，server可以配置不同的服務，比如location，比如負載均衡配置upstream。

1.配置反向代理

例如：修改nginx.conf配置文件，配置location中proxy_pass指向YSL官網(wǎng)。

// 這行代碼就說明請求會代理到 https://www.yslbeautycn.com
proxy_pass  https://www.yslbeautycn.com 

注意：
proxy_pass后面跟的是空格
寫完一個配置項后面需要以分號；結尾

修改了nginx.conf配置文件后，運行nginx -s reload
在瀏覽器輸入http://localhost:80并回車，就可以發(fā)現(xiàn)出現(xiàn)的是YSL官網(wǎng)了。

2.負載均衡upstream

在一堆服務器中，Nginx能夠將從客戶端請求“均勻地”分配到這些服務器中，這就是負載均衡。

場景：如果請求很多，一臺服務器忙不過來，就需要多個服務器一起合作。假如我們有100G的服務器、64G的服務器、16G的服務器，我們希望實現(xiàn)更多的請求能夠到100G的服務器中，更少的請求到16G的服務器中。這就是負載均衡的功能了。

常用方式：

• 輪詢
  "輪詢"會將客戶端的請求循環(huán)分配給不同的后端服務器。輪詢?nèi)菀桩a(chǎn)生資源分配不合理的問題。
  
  假設有三個服務器，那么就可以在nginx.conf文件中使用upstream塊定義這三個服務器；然后再配置location中的proxy_pass指令指向upstream名稱。寫法如下所示：
  

• 加權輪詢
  用于服務器性能不同的集群中，可以讓資源分配更合理。
  
  服務器性能越好的，權重就更高；性能越差的，權重就越低。（權重weight）
  如上圖所示：如果請求很多的情況下，那么大量的請求都會到權重為4的第三個服務器中，只有一部分請求才會到權重為1的服務器中，這樣可以確保服務器沒有超負荷。權重weight越高的，請求就越多；這樣，可以保證服務器性能的最大化，哪怕有一臺很小的服務器，也可以上線去使用，這樣會節(jié)約成本。
  可以通過weight來設置服務器的不同權重，寫法如下所示：
  
  優(yōu)點：分布式處理，提升網(wǎng)絡的靈活性、穩(wěn)定性，使得服務器性能最大化。

三、Nginx上部署前端項目

Vue項目需要打包好，打包項目運行npm run build即可，打包完成項目中會多出一個dist目錄，我這里的項目叫demo。
我們將demo項目下dist目錄中的內(nèi)容都復制粘貼到nginx目錄下的html目錄中，將原本的nginx下的html中的內(nèi)容刪除掉。

效果就是這樣：

配置文件依然是默認的80端口，localhost打開。運行一下：start nginx，可以看到vue項目運行成功了。

總結

以上就是我要分享的Nginx相關的內(nèi)容了。文章來源地址http://www.zghlxwxcb.cn/news/detail-447469.html

到了這里，關于Nginx基本使用以及部署前端項目的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！