关于nginx:前端需要掌握的Nginx知识点

63次阅读

共计 5365 个字符，预计需要花费 14 分钟才能阅读完成。

什么是 Nginx?

Nginx 是一款收费开源的 高性能 HTTP 服务器 以及 反向代理服务器（Reverse Proxy）, 同时能够提供 IMAP/POP3/SMATP 代理服务等性能。可能疾速的响应动态页面申请和反对第三方功能模块扩大。

Nginx 的长处

  • 高并发、高性能（官网给出的并发数据 5 万，理论中能够达到 2 - 4 万）
  • 轻量级、内存耗费少
  • 稳定性高，宕机概率低
  • 反对热部署
  • 模块化设计，扩展性较好
  • cpu 亲和

Nginx 罕用的场景

  • 动态资源服务器
  • 动静匹配
  • 反向代理
  • Gzip 压缩
  • 负载平衡

Nginx 的装置配置

mac 下镜像飞速装置 Homebrew 教程: https://zhuanlan.zhihu.com/p/…

$ brew install nginx

Nginx 罕用的命令

  • 启动: nginx
  • 查看版本号: nginx -v
  • 查看 nginx 编译的参数: nginx -V
  • 重新启动 nginx: nginx -s reload
  • 优雅重启，并从新载入配置文件 nginx.conf: /usr/local/nginx/sbin/nginx -s reload

  • 优雅进行 nginx，有连贯时会等连贯申请实现再杀死 worker 过程 /usr/local/nginx/sbin/nginx -s quit
    具体罕用的命令参考如下：

    nginx -s stop       疾速敞开 Nginx，可能不保留相干信息，并迅速终止 web 服务。nginx -s quit       安稳敞开 Nginx，保留相干信息，有安顿的完结 web 服务。nginx -s reload     因扭转了 Nginx 相干配置，须要从新加载配置而重载。nginx -s reopen     从新关上日志文件。nginx -c filename   为 Nginx 指定一个配置文件，来代替缺省的。nginx -t            不运行，仅测试配置文件。nginx 将查看配置文件的语法的正确性，并尝试关上配置文件中所援用到的文件。nginx -v            显示 nginx 的版本。nginx -V            显示 nginx 的版本，编译器版本和配置参数。

    胜利看到欢送页面～！（对应的 html 是 /usr/local/var/www/index.html）

Nginx 的默认配置

Nginx 装置目录下的 nginx.conf 就是 Nginx 全局的配置文件，咱们次要批改这里的内容。nginx.conf.default 作为配置文件的备份。

nginx 默认应用 8080 端口 如果发现端口被占用了，能够杀掉应用应用改端口的过程，也能够批改 /usr/local/etc/nginx/nginx.conf 下的

http {
    server {
        listen       8181;
        server_name  localhost;  

        #charset koi8-r;
        .....
        }
    }

其中 nginx.conf 中的配置信息如下：


#user  nobody;
#设置工作过程的数量
worker_processes  1;

#谬误日志寄存目录
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#过程 pid 寄存地位
#pid        logs/nginx.pid;

# 解决连贯
events {
    # 设置连接数, 单个后盾过程的最大并发数
    worker_connections  1024;
}


http {
    # 文件拓展名查找汇合
    include       mime.types;
    # 当查找不到对应类型的时候默认值
    default_type  application/octet-stream;

    # 日志格局，定义别名为 main
    #log_format  main  '$remote_addr - $remote_user [$time_local]"$request" '
    #                  '$status $body_bytes_sent"$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';
    
    #nginx 拜访日志寄存地位
    #access_log  logs/access.log  main;

    # 调用 sendfile 零碎传输文件
    sendfile        on;  #开启高效传输模式
    #tcp_nopush     on; #缩小网络报文段的数量

    # 客户端与服务器连贯超时工夫，超时主动断开
    #keepalive_timeout  0;
    keepalive_timeout  65;

    # 开启 gizip 压缩
    #gzip  on;

    # 虚拟主机
    server {
        listen       8181;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        # 路由
        location / {
            root   html;
            index  index.html index.htm;

            #第一种状况 回绝拜访 ip 地址段为 50-100 的 ip 拜访
            deny 192.168.10.50/100;
            
            # 第二种状况 只容许 ip 地址为 192.168.10.50 的 ip 拜访
            allow 192.168.10.50;
            deny all;
            
            # 第三种状况 这样配置都不能拜访，从上到下顺次匹配
            deny all;
            allow 192.168.10.50;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {root   html;}

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}
    include servers/*;
}

搭建动态站点

# 虚拟主机 server 块
server {
    # 端口
    listen   8080;
    # 匹配申请中的 host 值
    server_name  localhost;
    
    # 监听申请门路
    location / {
        # 查找目录
        root /source;
        # 默认查找
        index index.html index.htm;
    }
}

字段阐明：

  • server 配置虚拟主机的相干参数，能够有多个
  • server_name 通过申请中的 host 值 找到对应的虚拟主机的配置
  • location 配置申请路由，解决相干页面状况
  • root 查找资源的门路

配置实现后执行 nginx -t 看是否有谬误，如果看到的是上面这种就是胜利了

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

而后执行nginx -s reload 更新 Nginx 配置文件, 这时候关上浏览器 输出 localhost:8080 应该就能看到你的页面了。

动静匹配（申请过滤）

通常在开发环境或者测试环境的时候呢咱们批改了代码，因为浏览器缓存，可能不会失效，须要手动革除缓存，能力看到批改后的成果，这里咱们做一个配置让浏览器不缓存相干的资源。

location ~* \.(js|css|png|jpg|gif)$ {add_header Cache-Control no-store;}

~* .(js|css|png|jpg|gif)$ 是匹配以相干文件类型而后独自解决。add_header 是给申请的响应加上一个头信息Cache-Control no-store，告知浏览器禁用缓存，每次都从服务器获取 成果如下：

匹配规定

location = / {[ configuration A]
}

location / {[ configuration B]
}

location /documents/ {[ configuration C]
}

location ^~ /images/ {[ configuration D]
}

location ~* \.(gif|jpg|jpeg)$ {[ configuration E]
}

location =|～|～*|^~| /uri/

  • = 示意准确匹配。只有申请的 url 门路与前面的字符串齐全相等时，才会命中（优先级最高）。
  • ^~ 示意如果该符号前面的字符是最佳匹配，采纳该规定，不再进行后续的查找。
  • ~ 示意该规定是应用正则定义的，辨别大小写。
  • ~* 示意该规定是应用正则定义的，不辨别大小写。

  • / 通用匹配，任何申请都会匹配到

    通过状态码来过滤申请

    # 通过状态码，返回指定的谬误页面
error_page 500 502 503 504 /50x.html;
location = /50x.html {root /source/error_page;}

反向代理解决跨域

在前后端拆散的开发中，跨域问题是一个十分常见的问题，当初解决跨域问题比拟罕用的两种形式为：

  • 跨域资源申请（CORS）
  • Nginx 反应代理

先来看下面的图，当用户申请 xx.720ui.com/server1 的时候，Nginx 会将申请转发给 Server1 这个服务器上的具体利用，从而达到跨域的目标

同时 nginx 解决跨域时罕用的参数配置。

location /api {   
    # 申请 host 传给后端
    proxy_set_header Host $http_host;
    # 申请 ip 传给后端
    proxy_set_header X-Real-IP $remote_addr;
    # 申请协定传给后端
    proxy_set_header X-Scheme $scheme;
    # 门路重写
    rewrite  /api/(.*)  /$1  break;
    # 代理服务器
    proxy_pass http://localhost:9000;
}
  • 拦挡门路 /api, 能够通过正则匹配
  • proxy_set_header 容许从新定义或增加字段传递给代理服务器的申请头
  • $http_host $remote_addr、$scheme 为 Nginx 内置变量
  • rewrite 依据 rewrite 后的申请 URI，将门路重写，如：接口门路为 /user, 咱们能够申请 /api/user。（为什么须要重写 uri？因为在应用 Nginx 做反向代理的时候，须要匹配到跨域的接口再做转发，为了不便匹配，会人为的在原接口中增加一段门路（或标示，如例子中的 api），因而须要在匹配之后、转发之前把增加的那段去掉，因而须要 rewrite）
  • break 持续本次申请前面的解决 , 进行匹配上面的 location。须要留神的是与之类似的 last 执行过程则是进行以后这个申请，并依据 rewrite 匹配的规定从新发动一个申请，从上到下顺次匹配 location 前面的规定

  • proxy_pass 代理服务器

    原理：Nginx 拦挡到相干匹配规定, Nginx 再将申请转发到 http://localhost:9090，Nginx…
    nginx 跨域申请一个简略的 dome:

    server
{
  listen 80;
  server_name www.1212.com;

  location ^~ /blog/ {proxy_pass http://blog.12121.com/;}   
}

总结：功败垂成✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️✌️

参考链接：

  1. https://juejin.cn/post/684490…
  2. https://juejin.cn/post/684490…
  3. https://juejin.cn/post/684490…

正文完
nginx
发表至： nginx
2021-06-09
 0
关于nginx:Nginx配置密码访问访问网页需输入用户名密码
关于nginx:议题征集NGINX-Sprint-China-2022-线上大会
关于nginx:Nginx部署前端vue后端express项目步骤细节
关于nginx:centos-8-のnginx安装步骤