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_pass https://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_pass https://m.douban.com;
这段配置是将请求域名代理到豆瓣的域名下面, 所以从本地服务器发出去的请求将被重新重写为:
https://m.douban.com/rexxar/api/v2/muzzy/columns/10018/items?start=0&count=3, 我们就能拿到豆瓣 API 提供的数据. 详情可以看看这篇文章 https://www.jianshu.com/p/10ecc107b5ee
演示地址: 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{
- listen 9003;
- server_name 209.250.235.145;
- location / {
- proxy_pass http://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/ 209.250.235.145:9007
以上就是 nginx 服务器在我们日常开发中使用到的场景
来源: https://juejin.im/post/5c0b77d1e51d4530e4144b30