记录nginx学习

记录nginx学习

nginx是一个HTTP网络服务器,反向代理,内容缓存,负载均衡器,TCP/UDP代理服务器和邮件代理服务器。

对于我们前端码农来说,了解到它能作为HTTP服务器,能配置前端项目就可以了。

下载 nginx ,推荐稳定版本1.26.3,安装到一个自己喜欢的目录

nginx.org/en/download...

我们先来了解一下基础命令和基础配置

nginx 基础命令

  • 启动

找到 nginx 安装目录,打开命令行工具 cmd 或者 powershell

powershell 复制代码
start nginx
  • 重新加载配置文件

在更改 .conf 配置文件后,需要重新加载才可以生效

powershell 复制代码
nginx -s reload
  • 强制阻断服务
arduino 复制代码
nginx -s stop
  • 相比于强制阻断,nginx 提供了一个命令,可以等待当前请求完成之后再关闭服务

    nginx -s quit

基础配置

首先我们认识一下nginx的配置文件,先找到nginx所在目录,打开 conf 目录下nginx.conf 文件

我把一些目前用不到的注释去掉了,留下来了一些关键配置,主要用到的是http模块,在这里我们可以配置服务端口号,静态文件、负载均衡、处理容灾

nginx 复制代码
#user  nobody;
worker_processes  1; 
events {
    worker_connections  1024;
}

http {
    include       mime.types; #允许访问的文件类型,对应请求中允许的content type
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       80;
        server_name  localhost;

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

对nginx基础配置有所了解后,下面我会以场景为切入点,一步步配置nginx

如何将Vue或React项目部署到nginx,能访问到页面?
  1. 找到项目打包文件地址,一般是dist文件目录下,可以看到有一个index.html,主要是将这个文件配置到nginx中

  2. 截取了关键部分,看到server模块,listen是代表监听端口,默认端口为80

    nginx 复制代码
    server {
        listen       9666; # 默认端口号为80
        server_name  localhost;#主机名
    
        location / {
            root   E:\yu\doris\packages\admin\dist; #打包文件所在目录,在这改为自己项目打包后的文件路径
            index  index.html index.htm; #打包入口文件,一般是index.html
        }
    }

  3. 简单配置号server之后,就可以启动nginx看一下了

    这里可以看到访问 localhost:9666 能够看到页面了,但是页面数据没有显示,这是因为我们还没配置后端,之后会慢慢补充

相关推荐
一只小阿乐14 小时前
window 服务器上部署前端静态资源以及nginx 配置
运维·服务器·nginx
Linux运维技术栈14 小时前
Nginx 动静分离原理与工作机制详解:从架构优化到性能提升
运维·nginx·架构
墨苒孤1 天前
【Nginx】Nginx代理WebSocket
运维·websocket·nginx
苹果醋31 天前
Vue3组合式API应用:状态共享与逻辑复用最佳实践
java·运维·spring boot·mysql·nginx
华无丽言2 天前
如何简单实现发版不影响客户使用?nginx负载
linux·nginx
令狐少侠20112 天前
ai之对接电信ds后端服务,通过nginx代理转发https为http,对外请求,保持到达第三方后请求头不变
nginx·ai·https
DuelCode3 天前
Windows VMWare Centos Docker部署Springboot 应用实现文件上传返回文件http链接
java·spring boot·mysql·nginx·docker·centos·mybatis
dyj0953 天前
【Rancher Server + Kubernets】- Nginx-ingress日志持久化至宿主机
运维·nginx·rancher
PanZonghui3 天前
Centos项目部署之Nginx部署项目
linux·nginx
Hellc0073 天前
Nginx 高级 CC 与 DDoS 防御策略指南
运维·nginx·ddos