关于前端:关于前端配置Nginx的知识你可能需要略知一二

在前端开发中，Nginx 不仅仅是一款高效的 Web 服务器，更是一个弱小的工具，可能显著晋升 Web 利用的性能和用户体验

Nginx 简介

Nginx 是一款轻量级的 Web 服务器 / 反向代理服务器及电子邮件（IMAP/POP3）代理服务器，并在 BSD-like 协定下发行。因为其高性能、稳定性、丰盛的功能集、简略的配置以及低资源耗费而被宽泛应用

个别罕用的 Nginx 配置具体阐明

# 定义 Nginx 运行的用户和用户组
user www www;

#nginx 过程数，倡议设置为等于 CPU 总外围数。worker_processes 8;

#全局谬误日志定义类型，[debug | info | notice | warn | error | crit]
error_log /var/log/nginx/error.log info;

#过程文件
pid /var/run/nginx.pid;

#一个 nginx 过程关上的最多文件描述符数目，理论值应该是最多关上文件数（零碎的值 ulimit -n）与 nginx 过程数相除，然而 nginx 调配申请并不平均，所以倡议与 ulimit - n 的值保持一致。worker_rlimit_nofile 65535;

#工作模式与连接数下限
events
{#参考事件模型，use [ kqueue | rtsig | epoll | /dev/poll | select | poll]; epoll 模型是 Linux 2.6 以上版本内核中的高性能网络 I / O 模型，如果跑在 FreeBSD 下面，就用 kqueue 模型。use epoll;
#单个过程最大连接数（最大连接数 = 连接数 * 过程数）worker_connections 65535;
}

#设定 http 服务器
http
{
  include mime.types; #文件扩展名与文件类型映射表
  default_type application/octet-stream; #默认文件类型
  
  #charset utf-8; #默认编码
  server_names_hash_bucket_size 128; #服务器名字的 hash 表大小
  client_header_buffer_size 32k; #上传文件大小限度
  large_client_header_buffers 4 64k; #设定申请缓
  client_max_body_size 8m; #设定申请缓
  sendfile on; #开启高效文件传输模式，sendfile 指令指定 nginx 是否调用 sendfile 函数来输入文件，对于一般利用设为 on，如果用来进行下载等利用磁盘 IO 重负载利用，可设置为 off，以均衡磁盘与网络 I / O 处理速度，升高零碎的负载。留神：如果图片显示不失常把这个改成 off。autoindex on; #开启目录列表拜访，适合下载服务器，默认敞开。tcp_nopush on; #防止网络阻塞
  tcp_nodelay on; #防止网络阻塞
  keepalive_timeout 120; #长连贯超时工夫，单位是秒
  
  #FastCGI 相干参数是为了改善网站的性能：缩小资源占用，进步访问速度。上面参数看字面意思都能了解。fastcgi_connect_timeout 300;
  fastcgi_send_timeout 300;
  fastcgi_read_timeout 300;
  fastcgi_buffer_size 64k;
  fastcgi_buffers 4 64k;
  fastcgi_busy_buffers_size 128k;
  fastcgi_temp_file_write_size 128k;
  
  #gzip 模块设置
  gzip on; #开启 gzip 压缩输入
  gzip_min_length 1k; #最小压缩文件大小
  gzip_buffers 4 16k; #压缩缓冲区
  gzip_http_version 1.0; #压缩版本（默认 1.1，前端如果是 squid2.5 请应用 1.0）gzip_comp_level 2; #压缩等级
  gzip_types text/plain application/x-javascript text/css application/xml;
  #压缩类型，默认就曾经蕴含 text/html，所以上面就不必再写了，写上去也不会有问题，然而会有一个 warn。gzip_vary on;
  #limit_zone crawler $binary_remote_addr 10m; #开启限度 IP 连接数的时候须要应用
  
  upstream blog.ha97.com {
    #upstream 的负载平衡，weight 是权重，能够依据机器配置定义权重。weigth 参数示意权值，权值越高被调配到的几率越大。server 192.168.80.121:80 weight=3;
    server 192.168.80.122:80 weight=2;
    server 192.168.80.123:80 weight=3;
  }

  #虚拟主机的配置
  server
  {
    #监听端口
    listen 80;
    #域名能够有多个，用空格隔开
    server_name www.ha97.com ha97.com;
    index index.html index.htm index.php;
    root /data/www/ha97;
    location ~ .*.(php|php5)?$
    {
      fastcgi_pass 127.0.0.1:9000;
      fastcgi_index index.php;
      include fastcgi.conf;
    }
    #图片缓存工夫设置
    location ~ .*.(gif|jpg|jpeg|png|bmp|swf)$
    {expires 10d;}
    #JS 和 CSS 缓存工夫设置
    location ~ .*.(js|css)?$
    {expires 1h;}
    #日志格局设定
    log_format access '$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/ha97access.log access;
    
    #对 "/" 启用反向代理
    location / {
      proxy_pass http://127.0.0.1:88;
      proxy_redirect off;
      proxy_set_header X-Real-IP $remote_addr;
      #后端的 Web 服务器能够通过 X -Forwarded-For 获取用户实在 IP
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      #以下是一些反向代理的配置，可选。proxy_set_header Host $host;
      client_max_body_size 10m; #容许客户端申请的最大单文件字节数
      client_body_buffer_size 128k; #缓冲区代理缓冲用户端申请的最大字节数，proxy_connect_timeout 90; #nginx 跟后端服务器连贯超时工夫 (代理连贯超时)
      proxy_send_timeout 90; #后端服务器数据回传工夫 (代理发送超时)
      proxy_read_timeout 90; #连贯胜利后，后端服务器响应工夫 (代理接管超时)
      proxy_buffer_size 4k; #设置代理服务器（nginx）保留用户头信息的缓冲区大小
      proxy_buffers 4 32k; #proxy_buffers 缓冲区，网页均匀在 32k 以下的设置
      proxy_busy_buffers_size 64k; #高负荷下缓冲大小（proxy_buffers*2）proxy_temp_file_write_size 64k;
      #设定缓存文件夹大小，大于这个值，将从 upstream 服务器传
    }
    
    # 部署 Vue 单页利用的资源，须要配置 Nginx 以将所有非动态文件申请重定向到 `index.html`
    location / { 
      root /path/to/vue-app/dist; 
      try_files $uri $uri/ /index.html; 
    }
    
    #设定查看 Nginx 状态的地址
    location /NginxStatus {
      stub_status on;
      access_log on;
      auth_basic "NginxStatus";
      auth_basic_user_file conf/htpasswd;
      #htpasswd 文件的内容能够用 apache 提供的 htpasswd 工具来产生。}
    
    #本地动静拆散反向代理配置
    #所有 jsp 的页面均交由 tomcat 或 resin 解决
    location ~ .(jsp|jspx|do)?$ {
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_pass http://127.0.0.1:8080;
    }
    #所有动态文件由 nginx 间接读取不通过 tomcat 或 resin
    location ~ .*.(htm|html|gif|jpg|jpeg|png|bmp|swf|ioc|rar|zip|txt|flv|mid|doc|ppt|pdf|xls|mp3|wma)$
    {expires 15d;}
      location ~ .*.(js|css)?$
    {expires 1h;}
  }
}

咱们先理解一下它的个性

事件驱动架构

Nginx 采纳了异步非阻塞的事件驱动模型，使其在并发高、内存应用少的场景下体现优异。这一个性对前端尤为重要，因为动态资源（如 HTML、CSS、JavaScript 文件）的高效传输间接影响到页面加载速度和用户体验

反向代理与负载平衡

Nginx 能够作为反向代理服务器应用，帮忙前端资源与后端应用服务器之间进行高效、平安的通信。通过配置负载平衡，Nginx 还可能在多个后端服务器间智能调配申请，加强 Web 利用的可用性和扩展性

高效的动态资源服务

Nginx 对动态资源的解决极为高效，反对压缩、缓存等优化伎俩，能够显著缩小网络传输工夫和带宽耗费，放慢网页渲染速度

介绍几个实用的网站

一 DevOps

这个网站讲的很具体，DevOps 实际波及到开发部门以及软件研发的整个生命周期，这意味着在整个开发生命周期中，波及到一大批新旧工具，包含从布局、编码、测试、公布、监控等自动化的流程工，DevOps

二 可视化 Nginx 配置

用户通过网页简略的 Nginx 配置属性，即可取得配置文件，用户还能够指定动态资源的根目录、默认文件等，使得动态网站的部署变得既疾速又容易，能够预览一下图片，UI 做的还是十分精美的

Nginx 下载大全

这个网站提供了 Nginx 版本相干的下载地址，找到本人想要的版本点击下载即可，还是十分不便的