原文转载自「刘悦的技术博客」https://v3u.cn/a_id_102

这一次使用vue.js+tornado的组合来部署前后端分离的web项目,vue.js不用说了,前端当红炸子鸡,泛用性非常广,无论是单页应用,还是混合式开发app,亦或是微信小程序开发,样样得心应手,tornado最近的风头有点被新锐框架sanic抢走了,但是作为老牌的异步非阻塞框架,其内置了支持epoll/kqueue 等高效网络库,而具备了处理高并发的能力并且开发效率也不低,这一次tornado作为承载后端压力的角色。

首先部署前端,将测试好的vue.js2.6项目打包,值得一提的是,在生产环境并不需要node.js服务,因为利用vue.js的特性可以对前端页面进行打包,使其成为一个纯静态页包,上线后利用nginx对其代理即可,既方便又安全。在项目目录下执行npm run build命令,在执行之前,先把conifg目录下index.js中的bulid配置…/dist改成./dist

执行命令后,会在项目的config目录下的dist目录生成静态页,将dist目录上传到服务器的/root目录下

运行 chmod 755 /root/dist 对项目文件授权

然后,在线上安装nginx

#设置源
sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm #安装
yum install -y nginx #启动服务
systemctl start nginx.service

服务器需要暴露80端口,此时,测试一下,看看能否显示欢迎页

没有问题,这时修改一下nginx 配置文件 vim /etc/nginx/conf.d/default.conf 增加下面的配置,这里前端服务默认监听80端口

server {
listen 80;
server_name localhost; access_log /root/md_vue_access.log;
error_log /root/md_vue_error.log; client_max_body_size 75M; location / { root /root/dist;
index index.html;
try_files $uri $uri/ /index.html; } error_log /root/dist/error.log error; }
#继续修改配置
vim /etc/nginx/nginx.conf
将第一行改为 user root;

改好后,重启nginx服务

systemctl reload nginx.service

每次修改nginx配置一定要重启服务,否则修改不会生效

访问一下,看看效果

至此,前端就部署好了,是不是很简单呢?这一次我们摒弃了老美多商城丑陋而原始的模板,采用响应式设计的新模板,兼容任意大小屏幕,并且还可以打包成apk,简直棒

接着,我们来部署后端,首先安装python3,需要注意的是centos自带python2.7,当装软件的时候千万不要影响这个python2.7,因为系统很多东西都依赖python2,所以我们只要python2和python3共存就可以了

yum install epel-release

yum install python36

wget --no-check-certificate https://bootstrap.pypa.io/get-pip.py

python3 get-pip.py

pip3 install pymysql

pip3 install pillow

pip3 install pycryptodome

pip3 install tornado==5.1.1

pip3 install sqlalchemy

将tornado项目上传到/root/mytornado下,修改项目权限:chmod -R 755 /root/mytornado 然后将项目的debug模式关闭,并且修改端口号为8001,同时阿里云暴露8001端口,进行项目根目录,启动服务:python3 server.py,检查一下

没有问题,此时修改nginx配置文件,用nginx对tornado进行反向代理,新建一个配置文件

vim /etc/nginx/conf.d/tornado.conf
upstream tornado {
server 127.0.0.1:8001;
} server {
listen 8000;
root /root/mytornado;
index server.py index.html; server_name server; # 静态文件直接由Nginx处理
location /static/{
alias /root/mytornado/static/;
expires 24h;
}
location /{
proxy_pass_header Server;
proxy_set_header Host $http_host;
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
# 把请求方向代理传给tornado服务器,负载均衡
proxy_pass http://tornado;
} }

该配置的意思就是由nginx监听8000端口,并且将请求反向代理至tornado服务,这里我们只起了一个8001的服务,还可以启动更多,这就是传统意义上的负载均衡

重启一下nginx

systemctl restart nginx.service

访问服务器的8000端口,阿里云也别忘了暴露一下8000

最后,每次手动在命令行启动应用是比较麻烦的,我们还需要一个能够方便的管理服务进程的工具,包括自动重启进程等,而Supervisor的作用在这里就可以体现了。我们使用它来管理这个Tornado web server相关的进程

安装supervisor

yum install epel-release
yum install -y supervisor

生成配置文件

supervisord -c /etc/supervisord.conf

修改配置文件

然后修改配置文件 vim /etc/supervisord.conf 将下面几行的注释解开

[inet_http_server]         ; inet (TCP) server disabled by default
port=*:9001 ; (ip_address:port specifier, *:port for all iface)
username=user ; (default is no username (open server))
password=123 ; (default is no password (open server))

意思是将web服务页面打开,需要注意ip地址要写*,否则外网访问不了,而username和password就是登录服务页面的用户名和密码,可以改的复杂一点,另外阿里云也需要向外网暴露一下9001端口

然后在配置文件末尾加上tornado的配置

[program:mytornado]
command=python3 /root/mytornado/server.py --port=8001
directory=/root/mytornado
autorestart=true
redirect_stderr=true

保存文件退出后,启动supervisor服务

supervisord -c /etc/supervisord.conf

此时,将刚刚手动启动的tornado服务关闭,然后访问服务器的9001端口,用配置文件中的账号和密码登录

这样就可以在管理页面中控制tornado服务了,同时supervisor还赋予了守护进程模式,方便服务拉起

需要注意的是,当修改了supervisor的配置,想要生效就得重启supervisor服务,终止服务命令是:

killall -s INT /usr/bin/python

因为supervisor是基于python2的,所以不用担心python3的进程

另外如果只想在命令行中控制tornado也是可以的

#停止tornado服务
supervisorctl stop mytornado #启动tornado服务
supervisorctl start mytornado

至此,我们通过nginx反向代理tornado负载均衡,并且通过supervisor管理就部署好了,简直太简单了

原文转载自「刘悦的技术博客」 https://v3u.cn/a_id_102

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

  1. 服务器上详细前后端分离项目搭建(springboot+vue)

    介绍:本文用的经典的前后端分离开源项目ruoyi Gitee链接地址:https://gitee.com/y_project/RuoYi 一.拉取项目: 利用Git把项目拉取到本地,也可以直接利用id ...

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

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

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

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

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

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

  5. 海纳百川无所不容,Win10环境下使用Docker容器式部署前后端分离项目Django+Vue.js

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_179 随着现代化产品研发的不断推进,我们会发现,几乎每个产品线都会包含功能各异的服务,而且服务与服务之间存在也会存在着错综复杂的依 ...

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

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

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

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

  8. 前后端分离项目 nginx配置实践

    新项目采用前后端分离的方式开发,前后端代码打算分开部署(同机器且同域名),但打算支持后端依然可访问静态资源. 搜索nginx配置大部分都通过url前缀进行转发来做前后端分离,不适用目前项目. 说明 前 ...

  9. 在k8s中部署前后端分离项目进行访问的两种配置方式

    第一种方式 (1) nginx配置中只写前端项目的/根路径配置 前端项目使用的Dockerfile文件内容 把前端项目编译后生成的dist文件夹放在nginx的html默认目录下,浏览器访问前端项目时 ...

随机推荐

  1. html5 tts(文字朗读)

    在 chrome 下使用比较好的中文语音包. 注意 speechSynthesis.getVoices() 有时候可能会返回空数组,需要做验证 var zhCnLangs = speechSynthe ...

  2. MongoDB启动报错:Unrecognized option: storage try 'mongod --help' for more information(已解决)

    问题说明: 今天在使用配置文件方式启动MongoDB时,一直启动失败,报错显示:Unrecognized option: storage try 'mongod --help' for more in ...

  3. [2021-TKK 暑期训练第一场] 1585:下馆子-3

    题目做了超链接 参考官方题解,作部分优化 下馆子 -3 题意: 给定n组数据,由name,time构成 当只有一个最大值时,输出该同学 当不止有一个最大值时,输出最先大于等于max次的同学 题解: 考 ...

  4. OpenHarmony3.1 Release版本特性解析——硬件资源池化架构介绍

    李刚 OpenHarmony 分布式硬件管理 SIG 成员 华为技术有限公司分布式硬件专家 OpenHarmony 作为面向全场景.全连接.全智能时代的分布式操作系统,通过将各类不同终端设备的能力进行 ...

  5. 优秀开源平台,前后端分离快速开发平台,一站式多端开发(PC+APP)

    JNPF平台架构介绍 JNPF快速开发平台采用前后端分离技术.采用B/S架构开发,形成一站式开发多端(APP+PC)使用. PC端版本介绍 第一个当然是当下热门的.net core了,运行环境为Vis ...

  6. vue运行npm run dev时候,自动打开页面

    在config/index.js找到dev:{}里面的autoOpenBrowser: 设置为true,重新npm run dev一次就自动弹出浏览器页面啦!

  7. “极简”创建 github page 并设置域名

    最简单最详细的,创建 github page 并设置域名,没有多余的步骤,并且多图,对新手特别友好 尝试用 github page 创建博客,并设置独立域名.网上找了许多教程,都太复杂.自己的创建过程 ...

  8. CabloyJS V3.2.0支持Socket IO

    CabloyJS v3.2.0引入了Socket IO,并且实现了统一的在线推送和离线推送机制 效果演示 1. IM 用户向系统发送一条消息,系统通过websocket在线通道向用户推送一条回复 2. ...

  9. Linux系统下运行.sh文件

    在Linux系统下运行.sh文件有两种方法,比如我在root目录下有个vip666.sh文件 #chmod +x *.sh的文件名 #./*.sh的文件名 第一种(这种办法需要用chmod使得文件具备 ...

  10. JAVA学习之第一个HelloWorld程序

    第一个HelloWorld程序 第一步,创建java类型的文件 第二步,在创建文件的目录中打开cmd窗口 第三步,使用javac 命令将java文件编译为.class类型的字节码文件 第四步,使用ja ...