这篇文章主要介绍了关于Nginx部署前后端分离服务以及配置说明，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下
在CentOS 7 服务器中使用yum命令安装Nginx：
sudo yum install -y nginx
文件位置
一般nginx配置文件在etc目录下，也可以执行命令rpm -ql nginx查看路径。
切换至/etc/nginx目录后，可以看到nginx.conf这个配置文件。
执行 vi nginx.conf即可打开配置文件。
| 命令 | 作用 |
|---|---|
| i | 光标前面开始输入内容 |
| a | 光标后面开始输入内容 |
| Esc | 退出输入模式 |
| u | 在非输入模式下撤销上一步操作 |
| :w | 在非输入模式下,保存 |
| :wq | 在非输入模式下,保存并关闭 |
| :q | 关闭（已保存） |
| :q! | 不保存,强制关闭 |
# For more information on configuration, see:
# * Official English Documentation: http://nginx.org/en/docs/
# * Official Russian Documentation: http://nginx.org/ru/docs/
user nginx;
worker_processes auto; #启动进程
error_log /var/log/nginx/error.log; #全局错误日志
pid /run/nginx.pid; #PID文件
# Load dynamic modules. See /usr/share/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;
events {
worker_connections 1024; #单个后台worker process进程的最大并发链接数
}
http {
gzip on; #开启gzip压缩
gzip_min_length 1k; #设置对数据启用压缩的最少字节数
gzip_buffers 4 16k;
gzip_http_version 1.0;
gzip_comp_level 6; #设置数据的压缩等级,等级为1-9，压缩比从小到大
gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml; #设置需要压缩的数据格式
gzip_vary on;
#虚拟主机配置
server {
listen 80 default_server; #侦听80端口,并为默认服务,default_server只能有一个
server_name www.binlive.cn binlive.cn; #服务域名,可以有多个,用空格隔开
location /{
proxy_pass http://127.0.0.1:3000; #代理本机3000端口服务
proxy_set_header Host $http_host; # required for docker client's sake
proxy_set_header X-Real-IP $remote_addr; # 获取用户的真实IP地址
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 900;
}
# 图片缓存时间设置
location ~ .*.(gif|jpg|jpeg|png|bmp|swf)$ {
expires 10d;
}
# JS和CSS缓存时间设置
location ~ .*.(js|css)?$ {
expires 1h;
}
# 404定义错误提示页面
error_page 404 /404.html;
# 500定义错误提示页面
error_page 500 502 503 504 /50x.html;
}
server {
listen 80;
server_name admin.binlive.cn;
location /{
proxy_pass http://127.0.0.1:3080;
proxy_set_header Host $http_host; # required for docker client's sake
proxy_set_header X-Real-IP $remote_addr; # pass on real client's IP
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 900;
}
}
}在前后端分离端项目里，前端的代码会被打包成为纯静态文件。使用 Nginx的目的就是让静态文件运行起服务，由于后端的接口也是分离的，直接请求可能会产生跨域问题，此时就需要Nginx转发代理后端接口。
# For more information on configuration, see:
# * Official English Documentation: http://nginx.org/en/docs/
# * Official Russian Documentation: http://nginx.org/ru/docs/
user nginx;
worker_processes auto; #启动进程
error_log /var/log/nginx/error.log; #全局错误日志
pid /run/nginx.pid; #PID文件
# Load dynamic modules. See /usr/share/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;
events {
worker_connections 1024; #单个后台worker process进程的最大并发链接数
}
http {
gzip on; #开启gzip压缩
gzip_min_length 1k; #设置对数据启用压缩的最少字节数
gzip_buffers 4 16k;
gzip_http_version 1.0;
gzip_comp_level 6; #设置数据的压缩等级,等级为1-9，压缩比从小到大
gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml; #设置需要压缩的数据格式
gzip_vary on;
#虚拟主机配置
server {
listen 80;
server_name mark.binlive.cn;
root /home/spa-project/dist; #定义服务器的默认网站根目录位置
index index.html; #定义index页面
error_page 404 /index.html; #将404错误页面重定向到index.html可以解决history模式访问不到页面问题
location ^~ /api/{
proxy_pass http://127.0.0.1:7000;
proxy_send_timeout 1800;
proxy_read_timeout 1800;
proxy_connect_timeout 1800;
client_max_body_size 2048m;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_set_header Host $http_host; # required for docker client's sake
proxy_set_header X-Real-IP $remote_addr; # pass on real client's IP
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
location ^~ /auth/{
proxy_pass http://127.0.0.1:7000;
proxy_send_timeout 1800;
proxy_read_timeout 1800;
proxy_connect_timeout 1800;
client_max_body_size 2048m;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_set_header Host $http_host; # required for docker client's sake
proxy_set_header X-Real-IP $remote_addr; # pass on real client's IP
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
}将前端代码打包后的dist文件放入指定服务目录
将服务目录指定到spa-project/dist目录下即可代理静态服务
配置里开启了gzip压缩，可以很大程度上减小文件体积大小
将404错误页面重定向到index.html，可以解决前端history路由模式由于刷新页面访问不到服务出现404的问题
location为代理接口，可以转发代理后端的请求接口域名或者ip，即可解决接口跨域问题
当完成配置后即可启动nginx
执行nginx -t，可以测试Nginx的配置是否正确。
执行nginx，在配置文件正确的情况下即可启动nginx服务。
修改nginx配置文件后执行nginx -s reload可以完成平滑过渡重新加载配置
| 命令 | 描述 |
|---|---|
| nginx -h | 查看Nginx的帮助 |
| nginx -v | 查看Nginx的版本 |
| nginx -t | 测试Nginx的配置 |
| nginx -T | 测试Nginx的配置，并打印配置信息 |
| nginx | 启动nginx |
| nginx -s reload | 重新加载配置文件，平滑启动nginx |
| nginx -s stop | 停止nginx的命令 |
以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！
相关推荐：
以上是Nginx部署前后端分离服务以及配置说明的详细内容。更多信息请关注PHP中文网其他相关文章！
