如何使用nginx部署项目 | 豆包MarsCode AI刷题

用户429324721550
243 阅读7分钟

对于自己上线项目的前端来说，nginx也是必须要了解和熟悉的，查了很多的nginx文章，看着写的都很详细，但是却没有了整体的概念。这里就重新梳理一遍，也理清思路。

我们在安装nginx之后，会自动生成很多的文件，但是nginx.conf这个文件是我们的核心，如何去正确的修改和优化它是nginx的核心。

首先我们可以先看下原本的配置，你会觉得无所适从，因为感觉这个鬼东西也太多了吧。而且感觉根本就不理解，也不知道该怎么写。下面，就一步一步教地你如何入门到熟悉

nginx基础命令：安装，启动，重启，关闭

安装nginx：

yum install nginx

看是否有nginx进程：

netstat -anput | grep nginx

查看服务器端口占用情况：

netstat -ntlp

nginx启动:

nginx

nginx重启:

nginx -s reload

关闭nginx：

  • nginx -s stop : 快速停止nginx
  • nginx -s quit ：完整有序的停止nginx

查看默认的nginx配置文件路径：

nginx -t

注：如果有nginx.conf配置的更改，需要重启nginx配置才会生效。如果只是更改dist包/html，则可以不重启nginx。 如果是宝塔面板可以在软件商店里面安装

我们主要关注nginx.conf文件

文件主要包含三部分内容

  • 第一部分：全局块
  • 第二部分：events块
  • 第三部分：http块

{90530D43-CC71-40B6-A0E6-7DF86A65F4DC}.png

全局块：

作用：从配置文件开始到 events 块之间的内容，主要会设置一些影响nginx 服务器整体运行的配置指令，主要包括配 置运行 Nginx 服务器的用户（组）、允许生成的 worker process 数，进程 PID 存放路径、日志存放路径和类型以 及配置文件的引入等。

比如上面第一行配置的

worker_processes  1;

这是 Nginx 服务器并发处理服务的关键配置，worker_processes 值越大，可以支持的并发处理量也越多，但是 会受到硬件、软件等设备的制约。

events块：

作用：events 块涉及的指令主要影响 Nginx 服务器与用户的网络连接，常用的设置包括是否开启对多 work process 下的网络连接进行序列化，是否 允许同时接收多个网络连接，选取哪种事件驱动模型来处理连接请求，每个 word process 可以同时支持的最大连接数等。

worker_connections  1024;

上述例子就表示每个 work process 支持的最大连接数为 1024。

这部分的配置对 Nginx 的性能影响较大，在实际中应该灵活配置。

http块：

作用：这算是 Nginx 服务器配置中最频繁的部分，代理、缓存和日志定义等绝大多数功能和第三方模块的配置都在这里。

需要注意的是：http 块也可以包括 http全局块、server 块。

http全局块

http全局块配置的指令包括文件引入、MIME-TYPE 定义、日志自定义、连接超时时间、单链接请求数上限等。

server 块

这块和虚拟主机有密切关系，虚拟主机从用户角度看，和一台独立的硬件主机是完全一样的，该技术的产生是为了 节省互联网服务器硬件成本。

  • 每个 http 块可以包括多个 server 块，而每个 server 块就相当于一个虚拟主机。
  • 而每个 server 块也分为全局 server 块，以及可以同时包含多个 locaton 块。
全局 server 块

最常见的配置是本虚拟机主机的监听配置和本虚拟主机的名称或IP配置。

location 块

一个 server 块可以配置多个 location 块。

这块的主要作用是基于 Nginx 服务器接收到的请求字符串（例如 server_name/uri-string），对虚拟主机名称 （也可以是IP 别名）之外的字符串（例如 前面的 /uri-string）进行匹配，对特定的请求进行处理。地址定向、数据缓 存和应答控制等功能，还有许多第三方模块的配置也在这里进行。

{16D6F7A3-62D5-46F0-9D9D-9904B48E6249}.png

server块

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

    root /var/www/mywebsite;
    index index.html index.htm;

    location / {
        try_files $uri $uri/ =404;
    }
}

上面配置文件代表监听80端口 域名为example.com，如果没有，可以写localhost,root为工作目录也就是资源目录。

location参数解析

uri：表示请求的 URI 对应的文件路径。例如，如果请求 example.com/about.html，… $uri 就是 /about.html。

$uri/：表示请求的 URI 对应的目录路径。例如，/about/。这通常用于查找目录下的默认文件（如 index.html）。

=404：如果前面的文件或目录都不存在，则返回 HTTP 404 错误（页面未找到）。

一般是这样(前端history模式)

 location / {
        try_files $uri $uri/ /index.html;;
    }

这段代码的作用是，当用户刷新页面时，Nginx会先检查当前URL是否存在，如果不存在，就会尝试访问index.html，从而可以正常显示页面。

其中nginx可以配置多个静态文件通过location匹配实现多个不同前端静态资源 如下图所示

我们可以通过命令创建一个软链接，将站点配置文件从 sites-available 目录启用到 sites-enabled 目录

sudo ln -s /etc/nginx/sites-available/myapp /etc/nginx/sites-enabled/

当然我们也可以在nginx的主配置文件中添加

include /www/server/panel/vhost/nginx/tcp/*.conf;
反向代理

这样前端静态资源就部署完成了，接下来我们可以通过proxy_pass来进行后端的反向代理

location /day06api/ {
  proxy_pass http://127.0.0.1:8080/;
}
转发：/day06api/api/abc -> http://127.0.0.1:8080/api/abc

location /day06api {
  proxy_pass http://127.0.0.1:8080/;
}
转发：/day06api/api/abc -> http://127.0.0.1:8080//api/abc

location /day06api/ {
  proxy_pass http://127.0.0.1:8080;
}
转发：/day06api/api/abc -> http://127.0.0.1:8080/day06api/api/abc

location /day06api {
  proxy_pass http://127.0.0.1:8080;
}
转发：/day06api/api/abc -> http://127.0.0.1:8080/day06api/api/abc

以上是常见的代理规则

接下来使用nginx搭配lets encrypt申请数字证书以及自动重定向https

我们使用lets encrype来自动申请证书我们需要安装Certbot

sudo yum install certbot python2-certbot-nginx -y

接着执行

sudo certbot --nginx

Certbot 会自动配置你的 Web 服务器以使用新的 SSL 证书。

如果我们使用的是宝塔等控制面板安装的nginx那么自动配置会报错找不到nginx.conf文件我们可能就需要手动的执行一下命令

sudo certbot --nginx --nginx-server-root /www/server/nginx/conf/ -d carbinol.club -d www.carbinol.club

指定 Nginx 的配置文件位于 /www/server/nginx/conf/ 目录下，而不是默认的 /etc/nginx/。

为域名 carbinol.club 和 www.carbinol.club 申请和安装 SSL/TLS 证书。

一般来讲在 Nginx 配置中添加将 HTTP 请求重定向到 HTTPS 的规则，我们可以在nginx.conf中添加

server{
  return 301 https://$host$request_uri;
}

开启gzip

作用：

开启gzip对于前端来说还是比较重要的，浏览器加载的包大概能节约一半的空间。例如首页需要加载a.js文件，该文件为900kb，在开启gzip之后，浏览器会去加载a.js经过gzip之后的文件a.js.gz，大概只有450kb，能够很好的提升浏览速度。

如何配置：

在http块的全局块里

gzip on; # 默认off，是否开启gzip
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
 
# 上面两个开启基本就能跑起了，下面的愿意折腾就了解一下
gzip_static on;
gzip_proxied any;
gzip_vary on;
gzip_comp_level 6;
gzip_buffers 16 8k;
# gzip_min_length 1k;
gzip_http_version 1.1;

维护页面：

作用：

在系统进行维护升级时，用户打开我们的网站看到的维护页面。在server块里

# 系统临时维护请打开下面这行注释，并重启nginx,维护完毕后请注释下年这行,并重启nginx
  rewrite ^(.*)$ /maintainace.html break;

最后附上常用的nginx配置

image.png

avatar
文章
阅读
粉丝