nginx實現常見場景

Nginx · 發表 2018-12-09 01:30:30

摘要： Nginx是一款輕量級的HTTP伺服器，採用事件驅動的非同步非阻塞處理方式框架，這讓其具有極好的IO效能。我們在日常開發中使用到Nginx的主要有以下幾個場景： Nginx作為http伺服器跨域請求負載均衡網路資源的動靜分離 nginx...

Nginx是一款輕量級的HTTP 伺服器，採用事件驅動的非同步非阻塞處理方式框架，這讓其具有極好的IO效能。我們在日常開發中使用到Nginx的主要有以下幾個場景：

Nginx作為http伺服器
跨域請求
負載均衡
網路資源的動靜分離

nginx作為http伺服器

Nginx本身是一個靜態資源的伺服器，當只有靜態資源的時候，就可以使用Nginx來做伺服器，如下，我們使用Nginx來部署一個打包好的vue專案

#vue專案
server
{
listen 8081; #監聽埠
server_name 209.250.235.145; 
root /app/vue/dist/; # 我們的資源在伺服器中的路徑
index index.html; #指定資源的入口檔案
}複製程式碼

完成後我們nginx -s reload一下，然後訪問209.250.235.145:8081，只要路徑沒錯靜態資源就訪問的到了

跨域請求

前後端分離的專案中由於前後端專案分別部署到不同的伺服器上，我們首先遇到的問題就是跨域，在這個場景我們下nginx可以幫助我們很好地解決這個問題

#跨域請求server
server{
listen 9000;
server_name 209.250.235.145;
root /app/crossDomain/;
index index.html;

location /douban/ { #新增訪問目錄為/apis的代理配置
rewrite^/douban/(.*)$ /$1 break;
proxy_passhttps://m.douban.com;
}
}
複製程式碼

在我的伺服器下我寫了一個

index.html請求豆瓣介面，模擬跨域

function nginxClick(){
$.ajax({
url: '/douban/rexxar/api/v2/muzzy/columns/10018/items?start=0&count=3',
dataType: 'json',
type: 'get',
data: "",
success:(res)=>{
console.log(res)
}
})
}
複製程式碼

當我們訪問點選請求時，匹配到 location下的 /douban/

rewrite^/douban/(.*)$ /$1 break;複製程式碼

這段配置將請求路徑重寫為/ rexxar/api/v2/muzzy/columns/10018/items?start=0&count=3，其中$1代表正則模糊匹配到的第一個引數，

proxy_passhttps://m.douban.com;複製程式碼

這段配置是將請求域名代理到豆瓣的域名下面，所以從本地伺服器發出去的請求將被重新重寫為：

https://m.douban.com/rexxar/api/v2/muzzy/columns/10018/items?start=0&count=3，我們就能拿到豆瓣api提供的資料。詳情可以看看這篇文章

演示地址： ofollow,noindex">http://209.250.235.145:9000/

負載均衡

負載均衡也是Nginx常用的一個功能，主要的是利用 upstream 來定義叢集伺服器。負載均衡配置一般都需要同時配置反向代理，通過反向代理跳轉到負載均衡。而Nginx目前支援自帶3種負載均衡策略

RR（預設） ：每個請求按時間順序逐一分配到不同的後端伺服器，如果後端伺服器down掉，能自動剔除
權重：指定輪詢機率，weight和訪問比率成正比，用於後端伺服器效能不均的情況
ip_hash ：上面的2種方式都有一個問題，那就是下一個請求來的時候請求可能分發到另外一個伺服器，當我們的程式不是無狀態的時候（採用了session儲存資料），這時候就有一個很大的很問題了，比如把登入資訊儲存到了session中，那麼跳轉到另外一臺伺服器的時候就需要重新登入了，所以很多時候我們需要一個客戶只訪問一個伺服器，那麼就需要用iphash了，iphash的每個請求按訪問ip的hash結果分配，這樣每個訪客固定訪問一個後端伺服器，可以解決session的問題。

這裡用第二900種策略來模擬實現了下負載均衡（同一臺伺服器上的兩個埠起了兩個node服務。）

使用 upstream定義伺服器

upstream smile.com{
server 209.250.235.145:9001 weight=1;
server 209.250.235.145:9002 weight=2;
}複製程式碼

server{
listen9003;
server_name 209.250.235.145;

location / {
proxy_passhttp://smile.com;
proxy_redirect default;
}
}複製程式碼

當我們訪問9003這個埠時，會根據我們設定的權重不同分別落在不同的伺服器（埠）。

演示地址： http://209.250.235.145:9003/

網路資源的動靜分離

當我們的請求涉及靜態資源時，我們可以將請求分發到不同的伺服器。

#動靜分離server
upstream static {
server 209.250.235.145:9006;
}
server{
listen 9005;
server_name 209.250.235.145;
root /app/dynSta;

location ~ .*.(gif|jpg|jpeg|png|bmp|swf|css|js)$ {
proxy_pass http://static;
}
}
server{
listen 9006;
server_name 209.250.235.145;
root /app/dynSta;
}
複製程式碼

我們定義了一個

為靜態資源新增了一個埠，並新增到

upstream模組，當我們的location匹配到以

(gif|jpg|jpeg|png|bmp|swf|css|js)結尾的檔案時，我們都會把請求轉發到9006這個埠下（好想成為土豪，好想擁有兩臺伺服器啊啊啊啊。。）

nginx除了以上的使用場景外，還可以用來適配pc和移動環境

適配pc和移動環境

#適配pc環境和移動環境
server{
listen 9007;
server_name 209.250.235.145;
root /app/pcAndh5/;
index pc.html;

location / {
if ($http_user_agent ~* '(Android|webOS|iPhone|iPod|BlackBerry)') {
set $mobile_request '1';
}
if ($mobile_request = '1') {
rewrite ^.+ https://www.baidu.com/;

}
}
}
複製程式碼

這裡我們使用nginx內建變數 $http_user_agent來匹配請求的來源，當來源是 (Android|webOS|iPhone|iPod|BlackBerry)時，我們將請求整個重寫，讓他去訪問百度，否則訪問我伺服器的地址。

演示地址： http://209.250.235.145:9007/

以上就是nginx伺服器在我們日常開發中使用到的場景