nginx学习记录

动力二踢脚
132 阅读7分钟

前端也需要了解一些nginx的内容，这里为了方便学习，买的是阿里云的服务器 版本CentOS 7.9

远程登录服务器 我这里是mac 用的是termius

image.png

用yum进行安装必要程序

登录完成先安装一些必要的程序

yum -y install gcc gcc-c++ autoconf pcre-devel make automake
yum -y install wget httpd-tools vim

安装nginx

yum install nginx

安装完成后可以使用命令，来检测Nginx的版本。

nginx -v

image.png

配置文件

安装完nginx之后可以看到文件夹里有很多东西

image.png

接下来主要用到 nginx.conf conf.d

nginx.conf是主要配置文件 看一下文件内容

vim nginx.conf

#运行用户，默认即是nginx，可以不进行设置
user  nginx;
#Nginx进程，一般设置为和CPU核数一样
worker_processes auto;
#错误日志存放目录
error_log  /var/log/nginx/error.log warn;
#进程pid存放位置
pid        /var/run/nginx.pid;


events {
    worker_connections  1024; # 单个后台进程的最大并发数
}


http {
    
    #设置日志模式
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;   #nginx访问日志存放位置

    sendfile        on;   #开启高效传输模式
    tcp_nopush     on;    #减少网络报文段的数量
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 4096;#保持连接的时间，也叫超时时间
    
    include       /etc/nginx/mime.types;   #文件扩展名与类型映射表
    default_type  application/octet-stream;  #默认文件类型


    include /etc/nginx/conf.d/*.conf; #包含的子配置项位置和文件
    
    server {
        listen       80; #配置监听端口
        listen       [::]:80; #ipv6的监听端口
        server_name  _; #配置域名
        root         /usr/share/nginx/html; #直接输入域名进入的目录和默认解析的文件
        
        #charset koi8-r;
        
        #access_log  /var/log/nginx/host.access.log  main;

        location / {
            root   /usr/share/nginx/html;     #服务默认启动目录
            index  index.html index.htm;    #默认访问文件
        }

        #error_page  404              /404.html;   # 配置404页面

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;   #错误状态码的显示页面，配置后需要重启
        location = /50x.html {
            root   /usr/share/nginx/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;
        #}
    }
}

conf.d 是一个空文件夹 里面可以放置一些子配置文件

# nginx.conf这行代码表示包含了子配置项位置和文件
include /etc/nginx/conf.d/*.conf;

阿里云的安全组配置

如果你使用的是阿里云，记得到ECS实例配置安全组

步骤如下：

  1. 进入阿里云控制台，并找到ECS实例。
  2. 点击“网络与安全”下的安全组，并进入。
  3. 右上角添加“安全组配置”。
  4. 进行80端口的设置，具体设置如图就好。

image.png image.png

然后在浏览器输入ip就可以看到程序的页面了

image.png

Nginx服务启动、停止、重启

nginx # 启动nginx
systemctl start nginx.service # systemctl启动nginx
nginx -s stop # 停止nginx 无论进程是否在工作，都直接停止进程
nginx -s quit # 停止nginx 进程完成当前工作后再停止
killall nginx # 停止nginx 杀死进程
systemctl stop nginx.service # systemctlnginx
nginx -s reload # 重新加载nginx配置文件
systemctl restart nginx.service # 重启nginx

查看端口号

在默认情况下，Nginx启动后会监听80端口，从而提供HTTP访问，如果80端口已经被占用则会启动失败。那么可以使用netstat -tlnp命令查看端口号的占用情况。

自定义错误页和访问设置

error_page指令用于自定义错误页面，404，500，502，503，504 这些就是HTTP中最常见的错误代码，


# 单独设置404错误访问页面
error_page 404 /404.html;
location = /404.html {
}

# /50.html 用于表示当发生上述指定的任意一个错误的时候，都是用网站根目录下的/50.html文件进行处理。
error_page 500 502 503 504 /50x.html;
location = /50x.html {
}

location / {
    root  /usr/share/nginx/html/dist; # 默认启动页 这里我放的是vue打包后的dist文件
    index index.html;
    try_files $uri $uri/ /index.html; # 找不到页面重定向到index 这也是vue history模式需要配置的nginx 
}

Nginx设置虚拟主机

虚拟主机是一种特殊的软硬件技术，它可以将网络上的每一台计算机分成多个虚拟主机，每个虚拟主机可以独立对外提供www服务，这样就可以实现一台主机对外提供多个web服务，每个虚拟主机之间是独立的，互不影响 nginx可以实现虚拟主机的配置，nginx支持三种类型的虚拟主机配置

基于端口号配置虚拟主机

在conf.d文件夹下增加8001.conf 监听8001端口代理到/usr/share/nginx/html/html8001，这样访问8001端口就会到html8001下的index了

最后记得在阿里云的安全组新增一个8001的权限，要不然不能访问

server{
        listen 8001;
        server_name localhost; # 或者_
        location / {
            root /usr/share/nginx/html/html8001;
            index index.html;
        }
}

基于IP和域名的虚拟主机

server{
        listen 80;
        server_name localhost; # 需要将这里替换成对应的ip和域名
        location / {
            root /usr/share/nginx/html/html8001;
            index index.html;
        }
}

Nginx反向代理的设置

正向代理

正向代理简单来说就是你想访问目标服务器的权限，但是没有权限。这时候代理服务器有权限访问服务器，并且你有访问代理服务器的权限，这时候你就可以通过访问代理服务器，代理服务器访问真实服务器，把内容给你呈现出来。比如vue服务的proxy

正向代理客户端访问的是真正的服务端地址

反向代理

反向代理跟代理正好相反（需要说明的是，现在基本所有的大型网站的页面都是用了反向代理），客户端发送的请求，想要访问server服务器上的内容。发送的内容被发送到代理服务器上，这个代理服务器再把请求发送到自己设置好的内部服务器上，而用户真实想获得的内容就在这些设置好的服务器上。

反向代理客户端访问的本来就是代理服务器的地址，通过反向代理可以做一些缓存，负载均衡等等

# 比如这里代理到阿里云oss
location /oss {
    # 在将客户端请求发送给后端服务器之前，更改来自客户端的请求头信息。
    proxy_set_header  Host  xxxx.oss-cn-beijing-internal.aliyuncs.com;
    proxy_set_header  X-real-ip $remote_addr;
    proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
    # 配置Nginx与后端代理服务器尝试建立连接的超时时间。
    proxy_connect_timeout 300;
    # 配置Nginx向后端服务器组发出write请求后，等待相应的超时时间。
    proxy_send_timeout 300;
    # 配置Nginx向后端服务器组发出read请求后，等待相应的超时时间。
    proxy_read_timeout 300;
    # 代理地址
    proxy_pass   http://xxxx.oss-cn-beijing-internal.aliyuncs.com/;
}

反向代理的用途和好处

  • 安全性：正向代理的客户端能够在隐藏自身信息的同时访问任意网站，这个给网络安全带来了极大的威胁。因此，我们必须把服务器保护起来，使用反向代理客户端用户只能通过外来网来访问代理服务器，并且用户并不知道自己访问的真实服务器是哪一台，可以很好的提供安全保护。

  • 功能性：反向代理的主要用途是为多个服务器提供负债均衡、缓存等功能。负载均衡就是一个网站的内容被部署在若干服务器上，可以把这些机子看成一个集群，那Nginx可以将接收到的客户端请求“均匀地”分配到这个集群中所有的服务器上，从而实现服务器压力的平均分配，也叫负载均衡。

Nginx适配PC或移动设备

$http_user_agent的使用：

Nginx通过内置变量$http_user_agent，可以获取到请求客户端的userAgent，就可以用户目前处于移动端还是PC端，进而展示不同的页面给用户。

location / {
    root  /usr/share/nginx/html/dist;
    if ($http_user_agent ~* '(Android|webOS|iPhone|iPod|BlackBerry)') {
        root /usr/share/nginx/mobile; # 放置移动端页面的文件夹
    }
    index index.html;
    try_files $uri $uri/ /index.html;
}

Nginx的Gzip压缩配置

Gzip是网页的一种网页压缩技术，经过gzip压缩后，页面大小可以变为原来的30%甚至更小。更小的网页会让用户浏览的体验更好，速度更快。gzip网页压缩的实现需要浏览器和服务器的支持。

alt

从上图可以清楚的明白，gzip是需要服务器和浏览器同事支持的。当浏览器支持gzip压缩时，会在请求消息中包含Accept-Encoding:gzip,这样Nginx就会向浏览器发送听过gzip后的内容，同时在相应信息头中加入Content-Encoding:gzip，声明这是gzip后的内容，告知浏览器要先解压后才能解析输出。

配置项

Nginx提供了专门的gzip模块，并且模块中的指令非常丰富。

  • gzip : 该指令用于开启或 关闭gzip模块。
  • gzip_buffers : 设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流。
  • gzip_comp_level : gzip压缩比，压缩级别是1-9，1的压缩级别最低，9的压缩级别最高。压缩级别越高压缩率越大，压缩时间越长。
  • gzip_disable : 可以通过该指令对一些特定的User-Agent不使用压缩功能。
  • gzip_min_length:设置允许压缩的页面最小字节数，页面字节数从相应消息头的Content-length中进行获取。
  • gzip_http_version：识别HTTP协议版本，其值可以是1.1.或1.0.
  • gzip_proxied : 用于设置启用或禁用从代理服务器上收到相应内容gzip压缩。
  • gzip_vary : 用于在响应消息头中添加Vary：Accept-Encoding,使代理服务器根据请求头中的Accept-Encoding识别是否启用gzip压缩。

在conf.d文件夹下增加gzip.conf

vim gzip.conf

填入以下内容

client_max_body_size 100m;
#keepalive_timeout 300;

gzip  on;
#use front-end Gzip file
#gzip_static on;
gzip_vary on;
#<500bytes
gzip_min_length 500;
gzip_http_version 1.0;
gzip_types text/plain application/javascript application/css text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;

image.png 看到response headers 返回如下就是配置成功

image.png

ps: 每次修改配置项都需要重新启动nginx配置

nginx -s reload

原文连接 juejin.cn/post/684490…

avatar
文章
阅读
粉丝