项目部署 (vue + nginx + uwsgi + django + mysql + redis)

一 . 前端部署

  1. 下载vue代码,解压缩

wget https://files.cnblogs.com/files/pyyu/07-luffy_project_01.zip
# zip格式的用unzip解压
unzip 07-luffy_project_01.zip

  2. 配置node环境,去打包编译vue代码

# 下载node的代码包
wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz
# 解压缩node代码包
tar -zxvf node-v8.6.0-linux-x64.tar.gz
# 配置node环境,找到bin的路径添加到PATH里,然后source /etc/profile

  3. 验证node是否正确配置(node就如同python的解释器, npm就是如同pip管理工具软件包

node  -v
npm -v

  4.修改vue的代码文件

因为vue需要向后台发起请求,找到uwsgi
# 我们的架构是将uwsgi隐藏在nginx后面
!!!所有 vue(端口80)首先找的是nginx(反向代理,端口是9000),然后nginx(反向代理,端口是9000)反向代理给uwsgi(后端地址,9001)
# 修改方式
找到/opt/s18luffy/07-luffy_project_01/src/restful 的 api.js 文件
#这里更改你自己的服务器ip地址
sed -i "s/127.0.0.1:8000/192.168.226.132:9000/g" api.js
sed 是linux处理字符串的命令
-i 是将结果替换到文件
"s/127.0.0.1:8000/192.168.226.128:9000/g" #解释 s是替换模式 /你想替换的内容/你想替换的结果/ g是全局替换
api.js 你想修改操作的文件

  5.进行打包vue,生成静态文件夹 dist

# 要确保在vue文件夹下, 我直接在/luffy_project_01下安装的,然后cd到这里就可以,ls命令可以看到build就对了.
npm install #解决vue代码所需的模块依赖
npm run build #进行编译打包

  6.当vue打包正确完成后,ls指令就可以看到生成一个dist静态文件夹,此时就给丢给nginx去处理啦!!!

二 . 后端uwsgi部署

  1.下载路飞代码

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

  2.安装新的虚拟环境,解决环境依赖问题 ,可以用requirements.txt解决依赖问题

mkvirtualenv  s18luffy
workon s18luffy # 进入到虚拟环境
vim 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

  3.安装这个文件 requirements.txt(这些东西一定要在虚拟环境下安装)

pip3 install -i https://pypi.douban.com/simple -r requirements.txt

  4.使用uwsgi去启动路飞学城后端

# 这个uwsgi.ini文件一定要写到项目下,使用uwsgi.ini配置文件方式启动,内容如下:

[uwsgi]
# Django-related settings
# the base directory (full path)
#填写项目的绝对路径(第一层路径)
chdir = /opt/s18luffy/luffy_boy
# Django's wsgi file
#填写crm第二层目录下的wsgi.py文件的路径
module = luffy_boy.wsgi
# the virtualenv (full path)
#填写虚拟环境的绝对路径
home = /root/Envs/s18luffy # process-related settings
# master
master = true
# maximum number of worker processes
#基于uwsgi的多进程,根据cpu来优化
processes = 4
# the socket (use the full path to be safe #如果你用了nginx反向代理,就填写socket参数
#如果你用了nginx反向代理,就填写socket参数
#如果你用了nginx反向代理,就填写socket参数
socket = 0.0.0.0:9001 #如果你没用nginx,想直接通过浏览器测试后端,使用http
#http = 0.0.0.0:9001 # ... with appropriate permissions - may be needed
# chmod-socket = 664
# clear environment on exit
vacuum = true

  5.用supervisor也去管理路飞的后台

[program:s18luffy]
command=/root/Envs/s18luffy/bin/uwsgi --ini /opt/s18luffy/luffy_boy/uwsgi.ini
stopasgroup=true
killasgroup=true

三 . nginx反向代理转发

  修改nginx.conf内容如下

# 虚拟主机1
server {
#第一个虚拟主机,监听的80端口
listen 80;
server_name 192.168.226.128;
location / {
try_files $uri $uri/ /index.html; # 保证vue刷新不404
root /opt/s18luffy/07-luffy_project_01/dist;
index index.html;
}
} # 虚拟主机2 server {
listen 9000;
server_name 192.168.226.128;
location / {
uwsgi_pass 0.0.0.0:9001;
include uwsgi_params;
}
} 重启nginx生效

四 . 启动redis,用的是sqllite,不需要mysql

yum install redis -y  #安装命令
systemctl start redis # redis登录命令
redis-cli
登录后输入 ping 返回一个pong代表正确启动

Linux--前后端分离部署的更多相关文章

  1. springboot+apache前后端分离部署https

    目录 1. 引言 2. 了解https.证书.openssl及keytool 2.1 https 2.1.1 什么是https 2.1.2 https解决什么问题 2.2 证书 2.2.1 证书内容 ...

  2. VUE开发(二)nginx配合vue来实现前后端分离部署

    一.引言 由于本地是采用vue+spring boot实现的前后端分离项目,本机启动的时候先启动后场服务,再单独启动vue工程,然后可以实现全流程贯穿,但是我们要部署到服务器上的时候,一般都是打一个j ...

  3. django前后端分离部署

    部署静态文件: 静态文件有两种方式1:通过django路由访问2:通过nginx直接访问 方式1: 需要在根目录的URL文件中增加,作为入口 url(r'^$', TemplateView.as_vi ...

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

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

  5. Django前后端分离项目部署

    vue+drf的前后端分离部署笔记 前端部署过程 端口划分: vue+nginx的端口 是81 vue向后台发请求,首先发给的是代理服务器,这里模拟是nginx的 9000 drf后台运行在 9005 ...

  6. 前后端分离项目采用Prerender的SEO优化流程

    原文: https://blog.ccyws.cn/articles/4 一.概述 近年开发模式变化,新建Web站点采用前后端分离部署已经是大势所趋.但是,搜索引擎爬虫不会执行js脚本从后端加载数据, ...

  7. 喜大普奔,两个开源的 Spring Boot + Vue 前后端分离项目可以在线体验了

    折腾了一周的域名备案昨天终于搞定了. 松哥第一时间想到赶紧把微人事和 V 部落部署上去,我知道很多小伙伴已经等不及了. 1. 也曾经上过线 其实这两个项目当时刚做好的时候,我就把它们部署到服务器上了, ...

  8. 两个开源的 Spring Boot + Vue 前后端分离项目

    折腾了一周的域名备案昨天终于搞定了. 松哥第一时间想到赶紧把微人事和 V 部落部署上去,我知道很多小伙伴已经等不及了. 1. 也曾经上过线 其实这两个项目当时刚做好的时候,我就把它们部署到服务器上了, ...

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

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

  10. 【转】前后端分离的项目如何部署发布到Linux

    前后端分离的项目如何部署发布到Linux 前期准备 1.服务器的基本配置信息2.本机远程连接服务器的工具(xshell.xftp或者mobaXterm等等,看你自己喜欢) 第一步:部署环境 1.安装j ...

随机推荐

  1. 一文搞懂TCP与UDP的区别

    摘要:计算机网络基础 引言 网络协议是每个前端工程师都必须要掌握的知识,TCP/IP 中有两个具有代表性的传输层协议,分别是 TCP 和 UDP,本文将介绍下这两者以及它们之间的区别. 一.TCP/I ...

  2. springboot之JdbcTemplate

    springboot可以使用JdbcTemplate进行数据库访问,代码如下 添加pom文件 <parent> <groupId>org.springframework.boo ...

  3. oracle nvl,nvl2,coalesce几个函数的区别

    1.nvl(exp1,exp2)该函数是处理表达式中的空值: 假设表达式exp1是空值,则该函数返回表达式exp2的值, 假设表达式exp1没有是空值,则该函数返回表达式exp1的值. 2.nvl2( ...

  4. 博弈论进阶之Anti-SG游戏与SJ定理

    前言 在上一节中,我们初步了解了一下SG函数与SG定理. 今天我们来分析一下SG游戏的变式--Anti-SG游戏以及它所对应的SG定理 首先从最基本的Anti-Nim游戏开始 Anti-Nim游戏是这 ...

  5. CPP笔记_函数返回局部变量

    本篇笔记记录的是关于返回函数中的局部值. 我们知道,在函数中创建的局部变量会随着函数的调用过程的结束,也即其对应函数栈帧的清除,而结束其生命周期.那么,如果我们把这个局部变量返回,就有可能存在该变量对 ...

  6. mean项目的分模块开发

    全文字版: 新建maven工程在,作为父工程用于最后集合使用,该工程不需要src,只需要一个pom.xml文件,规定一下依赖版本之类的,再建一个工具类的工程,不需要放配置文件,和工程中方法接口有关的不 ...

  7. 关于在Python2中使用列表推导式会遇到的问题

    摘自<流畅的Python>第二部分第二章2.2 Python 2.x 中,在列表推导中 for 关键词之后的赋值操作可能会影响列表推导上下文中的同名变量.像下面这个 Python 2.7 ...

  8. ASP.NET Zero--解决方案结构(层)

    解决方案结构(层) 创建和下载项目后,您将具有如下所示的解决方案结构: 解决方案有8个项目: Core项目包含域层类(如 实体 和 域服务). Application项目包含应用程序逻辑(如应用程序服 ...

  9. Expression

    表达式目录树 1.什么是表达式目录树Expression? 表达式目录树是一个数据结构,语法树. 首先我们去看看 Expressions类 ,定义了一个泛型委托类型 TDelegate: // 摘要: ...

  10. VSCode的Python扩展下程序运行的几种方式与环境变量管理

    在VSCode中编写Python程序时,由于有些地方要使用环境变量,但是发现设置的环境变量有时不起作用,花了点时间研究了一下,过程不表,直接说结论. 首先,环境变量的设置,Python扩展中有三种方式 ...