vue+drf的前后端分离部署笔记

前端部署过程

端口划分:

vue+nginx的端口 是81
vue向后台发请求,首先发给的是代理服务器,这里模拟是nginx的 9000
drf后台运行在 9005端口上

1.获取前端代码

wget https://files.cnblogs.com/files/pyyu/07-luffy_project_01.zip

2.解压缩,准备编译前端代码

unzip 07-luffy_project_01.zip

3.下node源码,配置nodejs编译环境

wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz

4.配置nodejs的环境变量

tar -zxvf node-v8.6.0-linux-x64.tar.gz
# 加入PATH中
PATH="/opt/python367/bin/:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/root/bin:/vuedrfs24/node-v8.6.0-linux-x64/bin"

5.安装vue代码所需的模块

进入前端代码的目录,找到package.json文件,里面定义了前端所需要的模块信息
[root@s24_linux 07-luffy_project_01]# pwd
/vuedrfs24/07-luffy_project_01

6.修改vue的数据提交地址,修改如下配置文件

/vuedrfs24/07-luffy_project_01/src/restful/api.js 

# 批量替换ip地址信息
sed -i 's/127.0.0.1:8000/192.168.16.85:9000/g' src/restful/api.js

7.执行安装模块的命令

# 进入vue源码目录
# 安装vue模块,默认去装package.json的模块内容,如果出现模块安装失败,手动再装
npm install
# 始编译前端代码,生成dist静态文件夹,前端所有代码,都打包编译生成了一个dist
npm run build

8.生成了dist静态文件夹之后,丢给nginx去处理即可

#返回路飞首页的静态文件服务器
server {
listen 81;
server_name _;
#最低级url匹配,所有请求都走到了这里
location / {
root /code/07-luffy_project_01/dist;
index index.html;
}
} #反向代理虚拟主机,vue的请求转发给drf
server {
listen 9000;
server_name _;
location / {
uwsgi_pass 0.0.0.0:9005;
include uwsgi_params;
} }

9.重启nginx

nginx -s reload

后端部署过程

1.整一个新的路飞虚拟环境,然后下载后端代码

 mkvirtualenv s24luffy

2.下载后端代码

wget  https://files.cnblogs.com/files/pyyu/luffy_boy.zip

3.解决drf运行的模块问题(最好使用requirements.txt文件去处理模块问题)

	[root@web02 opt]# cat requirements.txt
certifi==2018.11.29
chardet==3.0.4
crypto==1.4.1
Django==2.1.4
django-redis==4.10.0
django-rest-framework==0.1.0
djangorestframework==3.9.0
idna==2.8
Naked==0.1.31
pycrypto==2.6.1
pytz==2018.7
PyYAML==3.13
redis==3.0.1
requests==2.21.0
shellescape==3.4.1
urllib3==1.24.1
uWSGI==2.0.17.1

4.用uwsgi去启动drf后台

  • 创建uwsgi.ini文件,写入如下参数
[uwsgi]

# 填写项目的完整绝对路径,第一层
chdir = /vuedrfs24/luffy_boy #指定django的wsgi文件路径,填写相对路径
module = luffy_boy.wsgi #填写虚拟环境的绝对路径
home = /root/Envs/s24luffy master = true #定义程序的多进程数量的,以cpu核数的2倍+1数量填写 2n+1 数量
processes = 9 #把uwsgi启动在socket协议上,的8000端口 socket = 0.0.0.0:9005 #指定http协议的话,用户是可以直接访问到的,不安全的,因此使用socket协议
#http =0.0.0.0:8000
vacuum = true

5.使用supervisor进程管理工具,同管理crm和路飞的进程

[program:s24luffy]
command=/root/Envs/s24luffy/bin/uwsgi --ini //luffy_boy/uwsgi.ini ; 程序启动命令
autostart=true ; 在supervisord启动的时候也自动启动
stopasgroup=true ;默认为false,进程被杀死时,是否向这个进程组发送stop信号,包括子进程
killasgroup=true ;默认为false,向进程组发送kill信号,包括子进程

6.启动路飞后台

在学习阶段吧,先干掉所有的crm和supervisor
pkill -9 uwsgi
pkill -9 supervisor 然后重启supervisor
(s24luffy) [root@s24_linux luffy_boy]# supervisord -c /etc/supervisord.conf
Unlinking stale socket /var/run/supervisor/supervisor.sock
(s24luffy) [root@s24_linux luffy_boy]#
(s24luffy) [root@s24_linux luffy_boy]#
(s24luffy) [root@s24_linux luffy_boy]# supervisorctl -c /etc/supervisord.conf
s24crm RUNNING pid 42172, uptime 0:00:04
s24luffy RUNNING pid 42173, uptime 0:00:04

7.还得启动redis数据库,才能够访问购物车功能

1.安装redis
yum install redis -y
2.启动redis
systemctl start redis 3.检查redis是否正常

8.访问路飞的课程列表,以及添加购物车数据

Django前后端分离项目部署的更多相关文章

  1. nginx+vue+uwsgi+django的前后端分离项目部署

    Vue+Django前后端分离项目部署,nginx默认端口80,数据提交监听端口9000,反向代理(uwsgi配置)端口9999 1.下载项目文件(统一在/opt/luffyproject目录) (1 ...

  2. Docker环境下的前后端分离项目部署与运维

    本教程将从零开始部署一个前后端分离的开源项目,利用docker虚拟机的容器技术,采用分布式集群部署,将项目转换成为高性能.高负载.高可用的部署方案.包括了MySQL集群.Redis集群.负载均衡.双机 ...

  3. 前后端分离项目部署到Linux虚拟机

    最近做了一个springboot+vue的前后端分离项目,把它部署到Linux虚拟机上.下面是我的步骤和遇到的问题,需要的朋友可以看下(看的时候注意要全部看完到底部,因为我习惯是把我遇到的问题放到最后 ...

  4. 从零开始搭建django前后端分离项目 系列一(技术选型)

    前言 最近公司要求基于公司的hadoop平台做一个关于电信移动网络的数据分析平台,整个项目需求大体分为四大功能模块:数据挖掘分析.报表数据查询.GIS地理化展示.任务监控管理.由于页面功能较复杂,所以 ...

  5. luffy项目搭建流程(Django前后端分离项目范本)

    第一阶段: 1.版本控制器:Git      2.pip安装源换国内源    3.虚拟环境搭建        4.后台:Django项目创建 5.数据库配置              6.luffy前 ...

  6. 云计算:Ubuntu下Vue+Springboot前后端分离项目部署(多节点)

    一.机器准备 首先准备三台机器: 我是一台WINDOWS系统主机,在WINDOWS里的 VMware 中安装两台Ubuntu系统虚拟机 如果你的虚拟机只有 CentOS,可以参考这篇文章:https: ...

  7. Docker环境下的前后端分离项目部署与运维(九)后端项目部署与负载均衡

    数据库准备 建立数据库 renren_fast ,然后运行renrenfast项目中的db文件夹内的脚本 -- 菜单 CREATE TABLE `sys_menu` ( `menu_id` bigin ...

  8. 从零开始搭建django前后端分离项目 系列四(实战之实时进度)

    本项目实现了任务执行的实时进度查询 实现方式 前端websocket + 后端websocket + 后端redis订阅/发布 实现原理 任务执行后,假设用变量num标记任务执行的进度,然后将num发 ...

  9. 从零开始搭建django前后端分离项目 系列二(项目搭建)

    在开始项目之前,假设你已了解以下知识:webpack配置.vue.js.django.这里不会教你webpack的基本配置.热更新是什么,也不会告诉你如何开始一个django项目,有需求的请百度,相关 ...

随机推荐

  1. 技术基础 | 改进版的Apache Cassandra客户端请求路由

    最近我们在客户端的驱动程序中引入了一些变更,这些变更会影响传入的请求在Apache Cassandra集群内的分发方式.   新的默认负载均衡算法即将随驱动程序推出,这些算法将有助于缩短长尾延迟,并提 ...

  2. Java与C#的代码区别

    Java和C#都是编程的语言,它们是两个不同方向的两种语言 相同点: 他们都是面向对象的语言,也就是说,它们都能实现面向对象的思想(封装,继承,多态) 区别: 1.c#中的命名空间是namespace ...

  3. 解决Windows2019登录黑屏问题

    打开服务 停止App Readiness服务并禁用即可恢复正常

  4. 游标数据练习java

    //===============================================================生成游标的方法 List menu=new ArrayList(); ...

  5. Android驱动学习-灯光系统总体框架

    Android的app访问硬件的大致流程可以分为一下几个步骤: 我们之前说过Android系统在添加新的硬件的时候需要添加一个接口java文件,通过jni来访问硬件. 这个java是我们自己实现的,我 ...

  6. FileZilla使用教程

    FileZilla使用教程和问题汇总 正式开始之前我还是想闲聊几句,毕竟调试解决这些问题,整整耗了我一天半的时间.前不久学校要求上交一个web大作业,然后我们宿舍就寻思光做出来前后端搞头不大,不如整个 ...

  7. Mapreduce实例--求平均值

    求平均数是MapReduce比较常见的算法,求平均数的算法也比较简单,一种思路是Map端读取数据,在数据输入到Reduce之前先经过shuffle,将map函数输出的key值相同的所有的value值形 ...

  8. 实现连续登录X天送红包这个连续登录X天算法

    实现用户只允许登录系统1次(1天无论登录N次算一次) //timeStamp%864000计算结果为当前时间在一天当中过了多少秒 //当天0点时间戳 long time=timeStamp-timeS ...

  9. 改进你的c#代码的5个技巧(一)

    亲爱的读者,在这篇文章中,我提供了一些c#编程的最佳实践. 你是否在用户输入验证中使用异常处理机制? 如果是,那么你就是那个把你的项目执行速度降低了62倍的人.你不相信我吗?等几分钟;我来教你怎么做. ...

  10. C#扫盲篇(三):Action和Func委托--实话实说

    一.基础定义 老王想找老张的老婆出去耍,但是一看,老张还在厨房煮饭.于是老王就对老张隔壁的淑芬说:"等下老张吃完饭出去喝茶,你就把前门晒的苞谷收了,老张从左门出,你就收右边的苞谷,我就知道从 ...