Nginx基本使用以及部署前端项目
创始人
2025-01-21 06:37:01
0

前言

最近学习了一下Nginx,整理了一个博客,主要参考的是狂神说的b站视频教程,文章链接如下:狂神说Nginx快速入门


一、下载、启动Nginx

1.下载Nginx

到Nginx官方选择自己电脑适用的稳定版本下载,我下载的的windows版本。
在这里插入图片描述
下载完,就会有一个压缩包。需要创建一个文件夹用于存放解压后的nginx内容(注意:存放Nginx的文件夹最好不要有中文,否则会报错),解压后的内容如下所示:
在这里插入图片描述

后续我们经常使用到的就是conf配置文件。

2.启动Nginx

Win+R,运行cmd,切换到nginx解压之后的目录:
在这里插入图片描述
可以查看下conf目录中的nginx.conf文件。
在这里插入图片描述
用记事本打开,可以看到它的默认端口是80端口,默认访问域名是以localhost访问。也就是以后只要访问80端口,就会被Nginx拦截。
在这里插入图片描述
接着,打开浏览器,输入 http://localhost:80并 回车,出现以下内容说明Nginx启动成功了!
在这里插入图片描述
也可以在任务管理器中看到nginx是在运行状态的。
在这里插入图片描述

3.常用命令

强制停止nginx:nginx -s stop 安全退出nginx:nginx -s quit 重新加载配置文件:nginx -s reload (如果修改了配置文件就执行这行命令,否则修改就是无效的。前提:nginx服务是启动的状态,否则reload是不成功的。) 

二、nginx.conf配置文件分析

最上面的是全局配置;events是最大连接的数量;http中有一些小模块,比如静态资源文件配置,里面可以配置多个server,server可以配置不同的服务,比如location,比如负载均衡配置upstream。
在这里插入图片描述

1.配置反向代理

例如:修改nginx.conf配置文件,配置location中proxy_pass指向YSL官网。

// 这行代码就说明请求会代理到 https://www.yslbeautycn.com proxy_pass  https://www.yslbeautycn.com  

在这里插入图片描述

注意:
proxy_pass后面跟的是空格
写完一个配置项后面需要以分号;结尾

修改了nginx.conf配置文件后,运行nginx -s reload
在浏览器输入http://localhost:80并回车,就可以发现出现的是YSL官网了。
在这里插入图片描述

2.负载均衡upstream

在一堆服务器中,Nginx能够将从客户端请求“均匀地”分配到这些服务器中,这就是负载均衡。

场景:如果请求很多,一台服务器忙不过来,就需要多个服务器一起合作。假如我们有100G的服务器、64G的服务器、16G的服务器,我们希望实现更多的请求能够到100G的服务器中,更少的请求到16G的服务器中。这就是负载均衡的功能了。

常用方式:

  • 轮询
    "轮询"会将客户端的请求循环分配给不同的后端服务器。轮询容易产生资源分配不合理的问题。
    在这里插入图片描述
    假设有三个服务器,那么就可以在nginx.conf文件中使用upstream块定义这三个服务器;然后再配置location中的proxy_pass指令指向upstream名称。写法如下所示:
    在这里插入图片描述

  • 加权轮询
    用于服务器性能不同的集群中,可以让资源分配更合理。
    在这里插入图片描述
    服务器性能越好的,权重就更高;性能越差的,权重就越低。(权重weight
    如上图所示:如果请求很多的情况下,那么大量的请求都会到权重为4的第三个服务器中,只有一部分请求才会到权重为1的服务器中,这样可以确保服务器没有超负荷。权重weight越高的,请求就越多;这样,可以保证服务器性能的最大化,哪怕有一台很小的服务器,也可以上线去使用,这样会节约成本。
    可以通过weight来设置服务器的不同权重,写法如下所示:
    在这里插入图片描述
    优点:分布式处理,提升网络的灵活性、稳定性,使得服务器性能最大化。

三、Nginx上部署前端项目

Vue项目需要打包好,打包项目运行npm run build即可,打包完成项目中会多出一个dist目录,我这里的项目叫demo。
我们将demo项目下dist目录中的内容都复制粘贴到nginx目录下的html目录中,将原本的nginx下的html中的内容删除掉。
在这里插入图片描述
效果就是这样:
在这里插入图片描述
配置文件依然是默认的80端口,localhost打开。运行一下:start nginx,可以看到vue项目运行成功了。
在这里插入图片描述


总结

以上就是我要分享的Nginx相关的内容了。

相关内容

热门资讯

热点推荐!微信小程序途游辅助免... 热点推荐!微信小程序途游辅助免费,有哪些免费的wpk作弊码,细节揭秘(有挂技巧)-哔哩哔哩是一款可以...
重大消息!互游辅助脚本,哈糖大... 重大消息!互游辅助脚本,哈糖大菠萝怎么开挂,德州教程(有挂助手)-哔哩哔哩;互游辅助脚本简单的灵活控...
推荐一下!福建天天开心辅助真实... 推荐一下!福建天天开心辅助真实性,黑桃a3辅助,一贯有挂(哔哩哔哩)1、起透看视 福建天天开心辅助真...
今日焦点!腾讯欢乐卡五星辅助器... 今日焦点!腾讯欢乐卡五星辅助器,wepoker怎么下载游戏,力荐教程(真是有挂)-哔哩哔哩;亲,有的...
解谜一下!大宝苏北麻将怎么开挂... 解谜一下!大宝苏北麻将怎么开挂,开心游戏快跑辅助,其实存在有挂(哔哩哔哩)大宝苏北麻将怎么开挂能透视...
一分钟揭秘!边锋老友杰克辅助,... 一分钟揭秘!边锋老友杰克辅助,wepoker私人局俱乐部怎么进,插件教程(新版有挂)-哔哩哔哩;AI...
详情一下!九九山城辅助免费,浙... 详情一下!九九山城辅助免费,浙江宝宝游戏辅助工具,一贯存在有挂(哔哩哔哩)1、下载好九九山城辅助免费...
玩家必看教程!白金岛跑胡子脚本... 玩家必看教程!白金岛跑胡子脚本,微扑克游戏辅助器,科技教程(有挂秘诀)-哔哩哔哩;白金岛跑胡子脚本最...
有挂一下!老友广东潮汕麻雀,山... 有挂一下!老友广东潮汕麻雀,山西扣点带你辅助工具破解,都是是有挂(哔哩哔哩)1、老友广东潮汕麻雀模拟...
今日重大通报!花舍辅助,wep... 今日重大通报!花舍辅助,wepoker软件靠谱么,必备教程(有挂方式)-哔哩哔哩;1、不需要AI权限...