文章目录

  • 前言
  • 部署前准备：
  • 打包两个Vue项目
  • nginx中的配置
  • 准备后端代码
  • 服务器环境搭建
  • 一，安装mysql和redis
  • 二，安装python（有坑）
  • 三，安装uwsgi以及配置
  • nginx中的配置
  • 四，安装daphne + superviors以及配置 （目的是让Websocket正常使用）
  • nginx中的配置


前言

使用到的所有技术栈：
     Vue+ Django + DRF + Celery + Websocket + Mysql + Redis + nginx + uwsgi + daphne + supervisor
自己项目用到的东西比较多，在部署服务器也是踩过无数次的坑，今天来整理一下自己部署项目的全部流程。
    自己主要学的后端，所以这里只是讲述了我部署项目的一个流程和踩过的坑。目前对于部署用到的技术栈不是很熟悉，所以哪里说错了还请大神勿喷。如果你对哪里有疑问或者自己不同的见解，非常欢迎和我一起探讨

部署前准备：

打包两个Vue项目

npm run build

Vue打包配置文件内容（vue.config.js）

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  outputDir:'../打包项目/resume1',  // 打包文件存放的路径
  publicPath:'/resume/' // 这个是项目在服务器的路径
})

避坑：publicPath路径是路由后边的路径，不是相对于根目录的路径。举个例子
域名地址：project.com
project.com 可以直接访问项目一，
project.com/resume/ 访问项目二，
那第一个项目的publiPath值为’/‘,第二个就为’/resume/’
注意：publicPath的地址和项目在服务器的实际路径没有关系,实际路径是需要nginx去配置的 我就是把publicPath写成了项目在服务器根目录的相对路径，然后每次打包后都是白屏。

nginx中的配置
root /www/server/nginx/html;

 location /EditResume {  // 第二个项目
     alias /www/server/nginx/html/pluging/EditResume;
     try_files $uri $uri/ /EditResume/index.html;
 }

 location / {  // 第一个项目
     root /www/server/nginx/html/vblog3;
     try_files $uri $uri/ /index.html;
 }

准备后端代码

    后端代码不需要打包啥的，只需要导出依赖包就够了

pip3 freeze > requirements.txt

服务器环境搭建

一，安装mysql和redis

网上教程非常多，这就不详细赘述了。
我自己刚开始是编译安装，后来是直接压缩包安装，再后来就是宝塔面板的商城安装了。
不要问为啥我安装了那么多次，你应该可以理解一个没有大神指导自己找视频问度娘有多辛酸

二，安装python（有坑）

1，登录python官网找到项目对应的python版本右键复制链接地址

宝塔面板docker安装wordpress 宝塔面板安装websocket_websocket

wget -c 你复制的python下载地址

2，吧压缩文件解压到某个文件夹

tar -xvf Python-3.8.9.tgz

3，进入解压后的文件夹，找到Modules文件夹下边的SetUp文件将一下四行的注释去掉重要

SSL=/my/path/openssl  #改为刚安装的ssl路径
_ssl _ssl.c \
       -DUSE_SSL -I$(SSL)/include -I$(SSL)/include/openssl \
       -L$(SSL)/lib -lssl -lcrypto

我的项目用到了Celery异步去发送邮件所以要用到ssl，如果没有这步操作项目执行到异步任务的时候会报错 no modules name ssl的错误

4，准备编译环境

yum -y install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel libffi-devel gcc make

5，编译安装
cd到解压的python目录下执行命令

./configure --prefix=你要安装的目录
make
make install

没有报错即安装成功
6，建立软连接

ln -s /usr/local/tools/Python-3.8.9/bin/python3.8 /usr/bin/python3
ln -s /usr/local/tools/Python-3.8.9/bin/pip3.8 /usr/bin/pip3

三，安装uwsgi以及配置

1，使用python配置项目需要的虚拟环境，我用到的是virtualenv。

pip3.8 install virtualenv
virtualenv 环境名称

注意如果报错virtualenv不是内部命令，可以使用软连接吧virtualenv放到常用命令里边，或者直接到python文件夹bin目录下使用./virtualenv 目录/环境名 2，在本地环境和虚拟环境都安装uwsgi

pip3.8 install uwsgi

进入虚拟环境的方法：source 虚拟环境目录/bin/activate

3，uwsgi配置

vim /etc/uwsgi/uwsgi.ini

[uwsgi]
uid=root
gid=root
master=True
socket=127.0.0.1:9090
vhost=True
no-site=True
workers=2
reload-mercy=10
vacuum=True
max-requests=1000
limit-as=512
buffer-size=30000
pidfile=/var/run/uwsgi.pid
daemonize=/var/log/uwsgi.log

pythonpath=/usr/src/virtualenv/myblog/lib/python3.8/site-packages
// 这里是虚拟环境的依赖包地址

4，启动之前记得给项目做数据库迁移操作

进入项目文件夹

python3.8 manage.py makemigrations
python3.8 manage.py migrate

nginx中的配置
location /api {
  include uwsgi_params;
  uwsgi_pass 127.0.0.1:9090;
  uwsgi_param UWSGI_SCRIPT myblog.wsgi;  // 项目名.wsgi
  uwsgi_param UWSGI_CHDIR /www/server/nginx/html/myblog; //项目地址
  index index.html index.htm;
}

四，安装daphne + superviors以及配置 （目的是让Websocket正常使用）

1，进入项目所在的虚拟环境安装daphne

pip install dapne

这个命令是可以启动asgi服务的，就可以让你的webscoket服务正常使用，启动命令

daphne --p 7002 项目名.asgi:application

注意该命令需要进入到项目文件夹与manage.py同级目录下
如果报错daphne不是内部命令就使用绝对路径或者建立软连接即可

2，安装supervisor
supervios是一个纯python写的进程管理工具。我们使用supervisor就可以让daphne在后台运行
安装superviors

pip install supervisor

3，生成配置文件

echo_supervisord_conf > supervisord.conf

4，打开配置文件目录添加配置

vim /etc/supervisord.conf

在最后添加以下内容

[program:daphne]
directory=/www/server/nginx/html/myblog   
command=/usr/src/virtualenv/myblog/bin/daphne -b 127.0.0.1 -p 7002 --proxy-headers myblog.asgi:application 
autostart=true
autorestart=true
stdout_logfile=/tmp/websocket.log 
redirect_stderr=true

需要自己改的地方：第一行是自己的项目路径，第二行前边的是daphne的启动地址，7002是端口号这里需要和nginx配置端口号保持一致

5，启动命令

supervisord -c supervisord.conf

终止命令

supervisorctl shutdown

nginx中的配置
location /ws {
    proxy_pass http://127.0.0.1:7002;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
     
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Host $server_name;
}