nginx部署前后端分离项目(最详细版)(linux系统)

一. gcc 安装

安装 nginx 需要先将官网下载的源码进行编译,编译依赖 gcc 环境,如果没有 gcc 环境,则需要安装:

yum install gcc-c++

二. PCRE pcre-devel 安装

PCRE(Perl Compatible Regular Expressions) 是一个Perl库,包括 perl 兼容的正则表达式库。nginx 的 http 模块使用 pcre 来解析正则表达式,所以需要在 linux 上安装 pcre 库,pcre-devel 是使用 pcre 开发的一个二次开发库。nginx也需要此库。命令:

yum install -y pcre pcre-devel

三. zlib 安装

zlib 库提供了很多种压缩和解压缩的方式, nginx 使用 zlib 对 http 包的内容进行 gzip ,所以需要在 Centos 上安装 zlib 库。

yum install -y zlib zlib-devel

四. OpenSSL 安装

OpenSSL 是一个强大的安全套接字层密码库,囊括主要的密码算法、常用的密钥和证书封装管理功能及 SSL 协议,并提供丰富的应用程序供测试或其它目的使用。
nginx 不仅支持 http 协议,还支持 https(即在ssl协议上传输http),所以需要在 Centos 安装 OpenSSL 库。

yum install -y openssl openssl-devel

五.直接下载.tar.gz安装包,地址:https://nginx.org/en/download.html

wget -c https://nginx.org/download/nginx-1.12.0.tar.gz

六.解压

依然是直接命令:

tar -zxvf nginx-1.12.0.tar.gz

cd nginx-1.12.0

七.配置

其实在 nginx-1.12.0 版本中你就不需要去配置相关东西,默认就可以了。当然,如果你要自己配置目录也是可以的。
1.使用默认配置

./configure

2.自定义配置(不推荐

./configure \
--prefix=/usr/local/nginx \
--conf-path=/usr/local/nginx/conf/nginx.conf \
--pid-path=/usr/local/nginx/conf/nginx.pid \
--lock-path=/var/lock/nginx.lock \
--error-log-path=/var/log/nginx/error.log \
--http-log-path=/var/log/nginx/access.log \
--with-http_gzip_static_module \
--http-client-body-temp-path=/var/temp/nginx/client \
--http-proxy-temp-path=/var/temp/nginx/proxy \
--http-fastcgi-temp-path=/var/temp/nginx/fastcgi \
--http-uwsgi-temp-path=/var/temp/nginx/uwsgi \
--http-scgi-temp-path=/var/temp/nginx/scgi

3.编译安装

make

make install

八.whereis nginx 查询nginx安装的路径

nginx 后端服务器域名解析配置 nginx部署后端_linux

九.进入你安装nginx目录下找到nginx.conf进行编辑 如下配置是vue静态资源加速

添加

#启用或禁用gzipping响应。
         gzip on;
        #启用或禁用gzipping响应。
         gzip_buffers 4 16k;
        #设置level响应的gzip压缩。可接受的值范围为1到9。
        gzip_comp_level 5;
        #置将被gzip压缩的响应的最小长度。长度仅由“Content-Length”响应头字段确定。
        gzip_min_length 100;
        #匹配MIME类型进行压缩,text/html默认被压缩。        
        gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
        log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                          '$status $body_bytes_sent "$http_referer" '
                          '"$http_user_agent" "$http_x_forwarded_for"';
		#引入/usr/local/nginx/conf.d下面的所有配置文件
		include /usr/local/nginx/conf.d/*.conf;

nginx 后端服务器域名解析配置 nginx部署后端_nginx_02

:wq退出保存后创建目录名为conf.d

nginx 后端服务器域名解析配置 nginx部署后端_nginx 后端服务器域名解析配置_03


目录下就可以方自己单独的配置文件

nginx 后端服务器域名解析配置 nginx部署后端_java_04


开始启动配置

vim /etc/profile

加入

PATH=$PATH:/usr/local/nginx/sbin
export PATH
source /etc/profile

十一. 启动、停止nginx

cd /usr/local/nginx/sbin/
#启动
./nginx 
#停止
./nginx -s stop
#刷新
./nginx -s reload

网站可以访问ip+端口查询nginx是否安装成功 (如果是如下图片就算是安装成功了)

nginx 后端服务器域名解析配置 nginx部署后端_linux_05

解决Nginx: [error] open() "/usr/local/Nginx/logs/Nginx.pid 重新启动服务器,访问web服务发现无法浏览啦!登陆服务器之后进到nginx使用./nginx -s reload重新读取配置文件,发现报nginx: [error] open() "/usr/local/nginx/logs/nginx.pid" failed (2: No such file or directory)错误,进到logs文件发现的确没有nginx.pid文件

解决方法:

/usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf

十二. 部署vue前端

nginx 后端服务器域名解析配置 nginx部署后端_vue_06


项目打包

npm run build

nginx 后端服务器域名解析配置 nginx部署后端_nginx_07


上传项目到服务上

nginx 后端服务器域名解析配置 nginx部署后端_nginx_08

十三. 配置xiyan.conf 你自己在上面创建conf.d目录下创建这个文件

nginx 后端服务器域名解析配置 nginx部署后端_linux_09