一、 安装Nginx
步骤1: 安装相关组件
默认需要 zlib、openssl 和 pcre 依赖包,其他组件可以根据自己需要选择安装。输入如下命令:
#安装组件
yum -y install gcc gcc-c++ zlib zlib-devel openssl openssl-devel pcre pcre-devel
gcc:编译器组件,包括C、C++等
zlib:数据压缩库
openssl:https安全传输协议,默认没有打开
pcre:正则表达式库
步骤2:编译安装Nginx
官方网站下载最新 Nginx,线上环境最好下载最新稳定版本Stable version。默认安装路径:/usr/local/nginx
#获取nginx。如果未安装wget,使用 yum -y install wget
wget https://nginx.org/download/nginx-1.17.1.tar.gz
#解压,zxvf显示解压文件
tar zxf nginx-1.17.1.tar.gz
#进入nginx源文件目录
cd nginx-1.17.1
#编译,默认https没有打开,需要添加 --with-http_ssl_module
./configure --with-http_ssl_module
#安装Nginx
make && make install
#启动Nginx
/usr/local/nginx/sbin/nginx
步骤3:配置防火墙
#查看防火墙状态
firewall-cmd --state
#关闭防火墙
systemctl stop firewalld.service
#打开防火墙
systemctl start firewalld.service
#永久开放80端口
firewall-cmd --zone=public --add-port=80/tcp --permanent
#更新防火墙规则
firewall-cmd --reload
二、 上传项目
步骤1:打包项目
- 运行 npm run build 生成一个dist 文件并压缩备用 (zip格式)
- 进入 cd /usr/local/nginx/html 上传项目至服务器 输入命令 rz 选择桌面dist压缩包
3.配置文件访问路径,我的打包位置 publicPath: ‘/wxzf/dist/’, 打包文件相对路径 wxzf/dist
在 /usr/local/nginx/html 路劲下面 mkdir wxzf 将刚刚解压的dist移动到wxzf路径下 mv dist wxzf
此时用ip访问 既能打开项目,如果域名用域名访问也可以!!!!!!!!!!
可以看到项目已经能访问但是,接口404,这时要配置 nginx 反向代理,转发接口!!!
三、 配置nginx,反向代理
- 进入到配置目录 cd /usr/local/nginx/conf/
- 编辑默认配置 vim nginx.conf
- 在 serve 中配置
server {
....
location ~*^.+$ {
proxy_pass http://mysvr; #请求转向mysvr 定义的服务器列表
}
}
vim操作帮助:英文模式下
1.输入 i 进入编辑模式
2.按下esc 按下 : 输入 wq 保存退出
4.重启nginx
/usr/local/nginx/sbin/nginx -s reload -- 重启nginx