安装nginx

xv
24 阅读6分钟

blog.csdn.net/zhang_13091… blog.csdn.net/weixin_5000… juejin.cn/post/743698…

1.下载安装nginx和其依赖包

2.依赖包较多，最好采用在线安装

3.将下载的nginx上传到服务器 /usr/local 路径下

4.解压安装包

#解压安装包
tar -zxvf nginx-1.26.0.tar.gz

5.cd 到解压后的nginx目录内执行配置脚本

#cd 进解压后的目录中
cd nginx-1.26.0/
#执行配置脚本 --prefix是指定安装目录
./configure --prefix=/usr/local/nginx

如果遇到报错“./configure: error: C compiler cc is not found”，如下图

image.png

解决：

yum -y install gcc gcc-c++ autoconf automake make

6.编译安装

#对nginx编译和安装
make & make install

7.启动nginx

cd /usr/local/nginx/sbin/
./nginx

nginx启动成功之后可以通过以下命令进行查询

ps -ef|grep nginx

启动成功之后显示如下：

image.png

nginx的默认监听端口是80，所以访问本机加上80端口查看nginx，如下图正常访问

image.png 如果你的服务器开启了防火墙，则需要对80端口进行放行，不然无法访问

将80端口加入到防火墙白名单

#查看已放行的端口
firewall-cmd --list-all
#将80端口加入到防火墙放行白名单中，并重载防火墙
firewall-cmd --add-port=80/tcp --permanent
firewall-cmd --reload

8.访问nginx页面：

在浏览器中输入 ip + 端口号访问（端口默认80）

这样就算安装成功了

image.png

9.配置nginx环境变量

1.1 添加环境变量

打开系统环境变量配置文件：

# 使用 vim 编辑器打开配置文件
sudo vim /etc/profile

# 或者使用其他编辑器，如：
sudo nano /etc/profile

添加以下内容：

# Nginx 环境变量配置
export NGINX_HOME=/usr/local/nginx
export PATH=$PATH:$NGINX_HOME/sbin
1.2 使配置生效

保存文件后，执行以下命令使配置立即生效：

source /etc/profile

测试nginx命令

# 查看 Nginx 版本
nginx -v

# 检查 Nginx 配置
nginx -t

10.设置nginx开机自启

这里采用Systemd方式，把nginx作为系统服务，设置开机自启动

首先执行以下命令

vi /etc/systemd/system/nginx.service

创建一个nginx系统服务文件，按 i 键并输入以下内容，esc键退出，:wq保存

注意 /usr/local/nginx要替换成自己的nginx的安装路径(不是解压路径)

[Unit]
Description=The nginx HTTP and reverse proxy server
After=network.target
 
[Service]
Type=forking
ExecStartPre=/usr/local/nginx/sbin/nginx -t
ExecStart=/usr/local/nginx/sbin/nginx
ExecReload=/usr/local/nginx/sbin/nginx -s reload
ExecStop=/usr/local/nginx/sbin/nginx -s stop
 
[Install]
WantedBy=multi-user.target


nginx -s quit # 这种方法较stop相比就比较温和，需要进程完成当前工作后再停止。

nginx -s stop # 立即停止服务 这种方法比较强硬，无论进程是否在工作，都直接停止进程

刷新配置

sudo systemctl daemon-reload

允许nginx自启动

sudo systemctl enable nginx.service

启动nginx

sudo systemctl start nginx.service

查看nginx服务的状

sudo systemctl status nginx.service

image.png

查看开机自启动的服务列表

systemctl list-units --type=service

image.png

停止nginx服务

sudo systemctl stop nginx.service

image.png

image.png

11.上传并配置dist访问路径

1.上传

finalsell 使用 rz 命令 或者傻瓜式点击按钮上传 dist.zip 到 nginx 目录下的 html 目录中；

rm -rf index.html 删除原有的默认html页面，保留50.html报错页面；

unzip dist.zip 解压dist文件。

2.配置路径

cd 到nginx目录下conf目录

cd /usr/local/nginx/conf

输入以下命令打开nigix配置文件 vim nginx.conf

server {
        #此端口为配置端口（千万不要配置成后端接口端口）
        listen       8081; 
        server_name  localhost;

        #root为项目路径 index找该路径下的index页面

        location / {
            root   html/dist;
            index  index.html index.htm;
            try_files $uri $uri/ %uri/login  /index.html;
        }

        #error_page  404              /404.html;

        # 默认报错页面
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
}

配置完之后 重载nginx

nginx -s reload

重载完之后打开ip + 端口 成功打开项目页面

3.照着有些文档配置，页面刷新会出现404，在nginx.conf中的dist路径下添加 try_files配置可以解决

location / {
            root   html/dist;
            index  index.html index.htm;
            try_files $uri $uri/ %uri/login  /index.html;
        }

12.配置反向代理

打开项目后大概率发现我们项目的接口是用不了的

原因是因为nginx代理后走的接口会变成前端地址ip＋端口

这时候就需要反向代理将前端地址接口代理为 后端接口地址

如下代码（简单反向代理）

参考代码配置完后大概率可以pin通后端接口（不行先检查下路径有没有问题）

server {  
    #此端口为配置端口（千万不要配置成后端接口端口）
        listen       8081; 
        server_name  localhost;

        #root为项目路径 index找该路径下的index页面

        location / {
            root   html/dist;
            index  index.html index.htm;
            try_files $uri $uri/ %uri/login  /index.html;
        }

        #error_page  404              /404.html;

        # 默认报错页面
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
        # 反向代理操作 匹配对应接口路径 将路径代理为对应的后端接口路径
        location /api {  
            proxy_pass   http://127.0.0.1:8080;  
        }  
}

反向代理中，重写路径

假设 Nginx 配置如下：

location /api/ {
    rewrite ^/api/(.*)$ /$1 break;
    proxy_pass http://localhost:3000;
}

  • 当用户请求 /api/users 时：

    • 正则表达式 ^/api/(.*)$ 匹配 /api/users。
    • $1 捕获到 users。
    • URL 被重写为 /users。
    • 请求被代理到 http://localhost:3000/users。

13.同一个服务器中配置多个前端项目

将server复制一份，改变 listen 端口，改变 location 下的 root路径

1744081146468.png

image.png

地址用新端口在浏览器中无法访问时，可能是端口未开放。

查询指定端口是否已开，提示 yes，表示开启；no表示未开启。

firewall-cmd --query-port=81/tcp

添加指定需要开放的端口

firewall-cmd --add-port=81/tcp --permanent

重载入添加的端口

firewall-cmd --reload

14.nginx运行过程中突然运行失败

1.检查端口是否被占用，结束掉占用端口的应用

这几次发现是nginx自身挂掉了，再次启动时，端口没有释放。先结束掉nginx，再次启动

nginx -s quit # 这种方法较stop相比就比较温和，需要进程完成当前工作后再停止。

nginx -s stop # 立即停止服务 这种方法比较强硬，无论进程是否在工作，都直接停止进程

启动nginx

sudo systemctl start nginx.service

查看nginx服务的状

sudo systemctl status nginx.service

15.配置webSocket的代理

1.vite proxy的配置

创建WebSocket请求。

location.host 自动获取地址栏url

ws = new WebSocket('ws://' + location.host + '/wsProxy/请求的url');
proxy配置。

target需要配置成http或https

proxy: {
        '/wsProxy/': {
          target: 'http://172.16.15.29:9080', // 后台的websocket服务地址
          changeOrigin: false,
          ws: true,
          rewrite: (p) => p.replace(/^\/wsProxy/, '')
        }
      }

2.nginx配置

 map $http_upgrade $connection_upgrade {
        default upgrade;
        ''      close;
 }
    

server {
        listen       80;
        server_name  localhost;
        
        location /wsProxy/ {
            rewrite ^/wsProxy/(.*)$ /$1 break;
            proxy_pass  http://172.16.15.29:9080;
            proxy_http_version 1.1; // 有文档写必须设置成1.1
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_read_timeout 86400s;
        }
      }

16.启动报错解决

报错：nginx: [emerg] open() "/var/log/nginx/error.log" failed (2: No such file or directory) image.png

 # 1.创建日志目录
sudo mkdir -p /var/log/nginx

 # 2.重启 Nginx
sudo systemctl restart nginx
avatar
文章
阅读
粉丝