飘过。。。

二,配置nginx

一般nginx配置文件在etc目录下

cd /etc/nginx
sudo vi nginx.conf

另,如何找nginx.conf配置文件:

sudo find /etc -name nginx.conf  //在 /etc 目录下查找 nginx.conf 配置文件

sudo locate nginx.conf  //locate 是在后台数据库中按文件名搜索 , 搜索速度比 find 更快 , 但对于刚建立的文件 , 使用该命令进行查找将会搜索不到所创建的文件 , 如果想使刚创建的文件被 locate 命令搜索到 , 可以使用 updatedb 命令 , 更新 mlocate 数据库

在前后端分离端项目里,前端的代码会被打包成为纯静态文件。使用 Nginx的目的就是让静态文件运行起服务,由于后端的接口也是分离的,直接请求可能会产生跨域问题,此时就需要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;大专栏  Nginx部署前后端分离服务/span>
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 -s reload

四,问题

在执行 nginx -t 时出现如下了报错:

nginx: [emerg] getpwnam("nginx") failed in /etc/nginx/nginx.conf:1
nginx: configuration file /etc/nginx/nginx.conf test failed

谷歌得到解答,将 user nginx; 替换成 user nobody nogroup; 然后再次执行 nginx -t 就没有报错了。

END

Thanks!

https://segmentfault.com/a/1190000014972747

https://serverfault.com/questions/581145/getpwnamwww-failed-in-etc-nginx-nginx-conf

https://blog.csdn.net/tojohnonly/article/details/70160388

Nginx部署前后端分离服务的更多相关文章

  1. 使用 Nginx 部署前后端分离项目,解决跨域问题

    前后端分离这个问题其实松哥和大家聊过很多了,上周松哥把自己的两个开源项目部署在服务器上以帮助大家可以快速在线预览(喜大普奔,两个开源的 Spring Boot + Vue 前后端分离项目可以在线体验了 ...

  2. vue+uwsgi+nginx部署前后端分离项目

    前后端分离,vue前端提供静态页面,且可以向后台发起get,post等restful请求. django后台提供数据支撑,返回json数据,返回给vue,进行数据页面渲染 后端 创建虚拟环境 解决dj ...

  3. docker-compose + nginx部署前后端分离的项目

    安装docker 安装必要的系统工具 # 更新yum工具 yum update -y # 安装必要的工具 yum install -y yum-utils device-mapper-persiste ...

  4. Nginx部署前后端分离的单页应用配置

    #user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #erro ...

  5. linux --- 部署前后端分离项目

    vue + uwsgi +nginx 部署前后端分离项目 准备项目 1.将前端vue项目包和后端django项目包上传服务器,通过lrzsz,直接从windows拖进linux中 2.解压缩操作 前端 ...

  6. 在centos7.6上部署前后端分离项目Nginx反向代理vue.js2.6+Tornado5.1.1,使用supervisor统一管理服务

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_102 这一次使用vue.js+tornado的组合来部署前后端分离的web项目,vue.js不用说了,前端当红炸子鸡,泛用性非常广 ...

  7. Docker Compose 部署前后端分离应用

    部署前后端分离应用 容器化 Abp 应用 关于 Abp 应用的容器化,其实和普通的 ASP.NET Core 应用差不多,大家可以参考我此前的文章. 唯一需要注意的是:因为 Abp 解决方案中有多个项 ...

  8. centos7部署前后端分离项目的过程

    概述 本文主要讲解在安装了centos7的Linux主机中部署前后端分离项目的过程. 前端项目名为:vue_project:后端项目名为:django_project. 将这两个项目放在/opt/wh ...

  9. docker+nginx+redis部署前后端分离项目!!!

    介绍本文用的经典的前后端分离开源项目.项目的拉取这些在另一篇博客!!! 其中所需要的前后端打包本篇就不做操作了!!不明白的去看另一篇博客!!! 地址:http://www.cnblogs.com/ps ...

随机推荐

  1. vector内部实现2

    push_back 往动态数组的内部进行添加数据 pop_back 往动态数组的尾部进行删除数据 resize  讲元素的数量len改成num个数量  如果size()变大了,多出来的将用默认构造来创 ...

  2. [原]PInvoke导致栈破坏

    原, 总结, 调试, 调试案例  项目中遇到一个诡异的问题,程序在升级到.net4.6.1后会崩溃,提示访问只读内存区.大概现象如下: debug版不崩溃,release版稳定崩溃. 只有x64位的程 ...

  3. 关于XML的一些总结

    xml的知识结构图 eXtensible Markup Language,可扩展标记语言,简称XML,和HTML比较而言,语法相似,作用不同 XML被设计用来存储和传输数据,但存储数据方面,数据库是主 ...

  4. iOS UIWebView 允许所有三方cookie

    前几天项目中用到UIWebView, 而在网页中,用到了多说评论的第三方.但是当我在手机端发表评论的时候,出现禁用第三方cookie,而安卓是没有这种情况的,于是就在找原因.找了很久也没有找到原因.一 ...

  5. AD中导出所有计算机的(计算机名+操作系统类型)

    要想用powershell管理域,首先先加载activedirectory模块 PS C:\> import-module activedirectory 下面就可以利用get-adcomput ...

  6. 吴裕雄--天生自然python机器学习:使用决策树预测隐形眼镜类型

    解决策树如何预测患者需要佩戴的隐形眼镜类型.使用小数据 集,我们就可以利用决策树学到很多知识:眼科医生是如何判断患者需要佩戴的镜片类型:一旦 理解了决策树的工作原理,我们甚至也可以帮助人们判断需要佩戴 ...

  7. demo4j解析xml

    1//先加入dom4j.jar包 2import java.util.HashMap; 3import java.util.Iterator; 4import java.util.Map; 5 6im ...

  8. Python练习四-浅拷贝&深拷贝

    一.数字.字符串不论是浅拷贝.深拷贝都是指向一个地址. a = 1 b = "abc" print (id(a)) print (id(b)) a1 = a b1 = b prin ...

  9. iOS仿写有妖气漫画、视频捕获框架、启动页广告页demo、多种动画效果等源码

    iOS精选源码 以tableview的section为整体添加阴影效果/ta'b'le'vi'e'w顶部悬浮.... 一个可以轻松应用自定义过滤器的视频捕获框架. 基于UITableView的组件,旨 ...

  10. Swiper中文网

    http://3.swiper.com.cn/api/Slides_grid/2014/1215/24.html slidesPerView :2,   即设置slider容器能够同时显示的slide ...