Mac环境：Nginx入门

Nginx是一款高性能的Web和反向代理服务器，今天我们就在MacOS（Mojave，版本10.14.6）环境下学习下Nginx。

一、安装、启动、重启、停止Nginx

Mac环境的安装比较简单，使用Homebrew安装即可:

 brew install nginx 

安装后的路径如下：

/usr/local/Cellar/nginx
/usr/local/etc/nginx

启动Nginx服务：

sudo nginx

验证下是否启动成功，在浏览器打开http://localhost:8080/，
Nginx默认端口为8080，出现以下界面说明启动成功了：

图1

我们新增个html页面：hello.html，页面内容为Hello World，将html文件拷贝到/usr/local/var/www目录下：

图2

修改配置：

vim /usr/local/etc/nginx/nginx.conf

图3

重启服务：

sudo nginx -s reload

好了，我们成功地更改了欢迎页面~

当然，如果要停止服务执行以下命令先找到Nginx进程号，然后kill命令：

ps -ef|grep nginx 
sudo kill -QUIT 进程号

二、Nginx的location映射规则

语法：
location [=|~|~*|^~] /uri/ { … }
说明：
= 精确匹配；
^~ ：以某个常规字符串开头；
~ ：区分大小写的正则匹配；
~* ：不区分大小写的正则匹配；
! ：逻辑取反；
/：通用匹配；
优先级（从高到低）：
location = /a {…} #精准匹配
location ^~ /a {…} #前缀匹配，按最长前缀匹配
location ~ /a.* {…} #正则匹配（区分大小写）
location ~* /a.* {…} #正则匹配（不区分大小写）
location /a {…} #最长前缀匹配，按最长前缀匹配
location / {…} #任何没有匹配成功的，都会匹配这里处理

示例（host：localhost，port：8080为例）：

1. 精准匹配 = "/login"，只有访问http://localhost:8080/login才能被匹配；
   location = /login {
   }

2. 以/static/为前缀的路径会被匹配，如：http://localhost:8080/static/a.html
   location ^~ /static/ {
   }
   如果有另一个规则：
   location ^~ /static/css/ {
   }
   且访问路径为：http://localhost:8080/static/css/b.css
   则优先匹配规则^~ /static/css/，这就是按最长前缀匹配；

3. 以gif|jpg|png|js|css结尾的路径，区分大小写
   location ~ .(gif|jpg|png|js|css)$ {
   }
   如果访问http://localhost:8080/static/images/c.PNG，不会匹配上，需要改成不区分大小写的规则：~* \.(gif|jpg|png|js|css)

4. 访问http://localhost:8080/api/a 会被匹配上，同样是按最长前缀匹配；
   location /api {
   }

5. 当其他规则都不满足时...
   location /{
   }

二、Nginx的反向代理

什么是反向代理？
反向代理（Reverse Proxy）实际运行方式是指以代理服务器来接受internet上的连接请求，然后将请求转发给内部网络上的服务器，并将从服务器上得到的结果返回给internet上请求连接的客户端，此时代理服务器对外就表现为一个服务器，反向代理实际是服务器的代理。

图4.反向代理

Nginx实现反向代理

首先，我们使用node创建一个server，访问地址为： http://localhost:7001/，返回内容为：我被代理了。

var http = require('http');

http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/plain; charset=utf-8'});
    response.end('我被代理了');
}).listen(7001);

然后，修改下ginx.conf的配置，增加一个location：

图5.nginx反向代理配置

我们通过proxy_pass将请求路径为/node 的请求转发到了http://localhost:7001/上。现在我们访问http://localhost:8080/node后成功返回我被代理了。

三、Nginx实践案例

• 动态资源与静态资源分离（前后端分离）
  现在有很多前后端分离的项目，比如在我们访问http://localhost:8080/时访问网站主页，而访问http://localhost:8080/api时又能请求接口，即前端静态资源和后端分离。通过以上的反向代理实现起来很简单：
  

  图6.前后端分离
  
  root 指向前端静态资源路径。

• 文件服务器

 server {
        listen 8081;
        server_name localhost;
        charset utf-8;
        location /videos {
            root /Users/my_name/Desktop; #文件路径
            autoindex on; #文件列表功能打开
        }
    }

图7.文件服务器