Centos7上使用Nginx部署Django Vue 前后端分离项目_放开这小书包

Centos7上使用Nginx部署Django Vue 前后端分离项目

前言

之前使用Django和Vue开发了一个前后端分离的项目，本次将项目部署到全新的腾讯云上，所以有一些服务器的环境配置本文也会有所涉及。

1、准备工作

• 全新Centos7.6
• Django项目
• Vue项目

2、基础配置

(1)、新建一个普通用户

连上新服务器后默认是root用户，我们可以新建一个普通用户

adduser xwj    #新建用户
passwd  xwj    #设置用户密码
1
2

(2)、赋予用户权限

编辑 sudoers文件

vim /etc/sudoers
1

在文件中加上

xwj  ALL=(ALL)  ALL
1

切换到普通用户下，之后我们的所有操作都是在该用户下完成的

su xwj
1

(3)、安装python

• 先更新一下系统软件

sudo yum update
1

• 安装依赖

sudo yum install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel libffi-devel wget gcc make
1

• 下载python

  本次使用的python3.8.10,使用wget进行python源码下载，可以在官网下载，也可以在下载国内镜像

官网安装（很慢）

wget https://www.python.org/ftp/python/3.8.10/Python-3.8.10.tgz
1

阿里镜像

wget https://cdn.npm.taobao.org/dist/python/3.8.10/Python-3.8.10.tgz
1

• 解压配置

tar -xzf Python-3.8.10.tgz  
1

• 配置安装选项

进入解压后的文件夹

cd Python-3.8.10             
1

快速安装，指定安装路径

./configure --prefix=/home/xwj/Python/python3.8.10
1

也可以设置优化选项--enable-optimizations

./configure --prefix=/home/xwj/Python/python3.8.10 --enable-optimizations
1

Centos7设置优化项后安装可能会报错，原因可能是需要修改编码格式，或者提高gcc的版本。本次直接快速安装。

• 编译安装

make && make install
1

• 设置软链接

软连接是linux中一个常用命令，它的功能是为某一个文件在另外一个位置建立一个同不的链接。

具体用法是：ln -s 源文件 目标文件。

当我们需要在不同的目录，用到相同的文件时，我们不需要在每一个需要的目录下都放一个必须相同的文件，我们只要在其它的 目录下用ln命令链接（link）就可以，不必重复的占用磁盘空间，相当于Windows中的快捷方式。ls _

在root 用户下，常用的软连接操作命令存放在/usr/bin中

在普通用户下，我们也可以新建一个目录（/usr/bin）存放软连接命令

将/usr/bin 加入PATH中

#配置环境变量
vim ~/.bashrc    

#在文件中添加
export PATH=~/usr/bin:$PATH

#刷新
source ~/.bashrc
1
2
3
4
5
6
7
8

创建软连接

# 设置软链接后可以直接调用，相当于快捷方式
ln -s ~/Python/python3.8.10/bin/python3.8 ~/usr/bin/python
ln -s ~/Python/python3.8.10/bin/pip3.8 ~/usr/bin/pip
ln -s ~/Python/python3.8.10/bin/python3.8-config ~/usr/bin/python-config
1
2
3
4

进入 ~/usr/bin中可以看见新建的三个软连接文件，使用python -V 和pip -V 可以看到链接的是我们新下载的python3.8.10

如果不想设置软连接，也可以直接将python的bin目录加入PATH中(注：普通用户至少将一个python加到.bashrc中，后面需要建虚拟环境)

#配置环境变量
vim ~/.bashrc    

#在文件中添加
export PATH=~/Python/python3.8.10/bin:$PATH

#刷新
source ~/.bashrc

#然后可以使用python3，pip3调用
1
2
3
4
5
6
7
8
9
10

• 修改镜像源

配置PyPI国内镜像源

豆瓣 https://pypi.douban.com/simple/
阿里云 https://mirrors.aliyun.com/pypi/simple/ 
清华大学 https://pypi.tuna.tsinghua.edu.cn/simple
1
2
3

在用户根目录下新建.pip/pip.conf文件，如果目录不存在，自己创建，文件内容如下

[global]
index-url = https://pypi.tuna.tsinghua.edu.cn/simple/
[install]
trusted-host = pypi.tuna.tsinghua.edu.cn
1
2
3
4

(4)、安装虚拟环境

#安装虚拟环境
pip install virtualenv

#安装虚拟环境扩展包
pip install virtualenvwrapper

#新建一个文件夹用来保存虚拟环境
mkdir .virtualenv
1
2
3
4
5
6
7
8

将virtualenvwrapper.sh加入到.bashrc中

vim ~/.bashrc 
"
export WORKON_HOME=~/.virtualenv
source ~/Python/python3.8.10/bin/virtualenvwrapper.sh
"
#刷新
source ~/.bashrc
1
2
3
4
5
6
7

如果是在安装使用时报错

需要在.bashrc中指明使用的python,即~/Python/python3.8.10/bin/python3.8,可以是使用软连接的 ~/usr/bin/python

vim ~/.bashrc 
"
export WORKON_HOME=~/.virtualenv
export VIRTUALENVWRAPPER_PYTHON=~/usr/bin/python
source ~/Python/python3.8.10/bin/virtualenvwrapper.sh
"
#刷新
source ~/.bashrc
1
2
3
4
5
6
7
8

常用操作

• 创建虚拟环境

 mkvirtualenv my_env
1

如果不指定python，则使用前面默认的python环境，即使用python3.8.10构建虚拟环境。

使用 -p 可以指定python版本

如：cd

 mkvirtualenv -p /usr/local/python3.8.10/bin/python3.8.10 test_env
1

• 切换到某个虚拟环境

 workon my_env
1

• 退出当前虚拟环境

deactivate
1

• 删除某个虚拟环境

rmvirtualenv my_env
1

• 进入到虚拟环境所在的目录

 首先切换到该虚拟环境
 cdvirtualenv
1
2

3、安装mysql

• 查看是否安装mariadb # sudo rpm -qa |grep mariadb
• 如果有就卸载 mariadb #sudo rpm -e --nodeps mariadb-libs-5.5.60-1.el7_5.x86_64
• 安装依赖 #sudo yum install libaio

(1)、下载mysql源安装包

centos没有mysql的仓库安装源，需要从mysql官网下载，repo下载页面 https://dev.mysql.com/downloads/repo/yum/ ，在此页面选择合适的版本。

如果有需要可以去官网找到对应链接

wget https://dev.mysql.com/get/mysql80-community-release-el7-5.noarch.rpm
1

(2)、安装mysql源

sudo yum -y localinstall mysql80-community-release-el7-5.noarch.rpm
1

(3)、查是否安装成功

yum repolist enabled | grep "mysql.*-community.*"
1

(4)、安装mysql

上述命令执行完之后，安装mysql

sudo yum install mysql-community-server
1

安装之后，重启服务

sudo systemctl start mysqld
1

查看mysql服务状态

sudo systemctl status mysqld
1

设置开机自动启动

sudo systemctl enable mysqld
sudo systemctl daemon-reload
1
2

(5)、配置以及部分命令

mysql安装完后，会在/var/log/mysqld.log文件中生成一个默认的root用户密码，查看默认密码，然后登录mysql修改

sudo grep 'temporary password' /var/log/mysqld.log
1

mysql登录,密码是上面查出来的

mysql -uroot -p
1

修改密码

ALTER USER 'root'@'localhost' IDENTIFIED BY 'Test@123456';
1

注意：mysql8 默认安装了密码安全检查插件（validate_password），默认密码检查策略要求密码必须包含：大小写字母、数字和特殊符号，并且长度不能少于8位。否则会提示ERROR 1819 (HY000): Your password does not satisfy the current policy requirements错误。

通过msyql环境变量可以查看密码策略的相关信息（执行这一步需要先修改默认密码，即执行完上一步修改才可以，否则会报错：ERROR 1820 (HY000): You must reset your password using ALTER USER statement before executing this statement.）

show variables like '%password%';
1

validate_password_policy：密码策略，默认为MEDIUM策略

validate_password_dictionary_file：密码策略文件，策略为STRONG才需要

validate_password_length：密码最少长度

validate_password_mixed_case_count：大小写字符长度，至少1个

validate_password_number_count ：数字至少1个

validate_password_special_char_count：特殊字符至少1个

上述参数是默认策略MEDIUM的密码检查规则。

修改密码验证策略

在/etc/my.cnf文件添加validate_password.policy=0配置，指定密码策略：

选择0（LOW），1（MEDIUM），2（STRONG）其中一种，选择2需要提供密码字典文件。

如果不需要密码策略，添加my.cnf文件中添加如下配置禁用即可：validate_password = off

重启mysql服务使配置生效

sudo systemctl restart mysqld
1

如有需要可以再修改密码

(6)、允许远程链接

默认root用户只允许本地访问，如果远程需要就需要修改root用户远程访问权限

use mysql;
select host,user from user;
1
2

查看表格中 root 用户的 host，默认应该显示的 localhost，只支持本地访问，不允许远程访问。

授权 root 用户的所有权限并设置远程访问

update user set host='%' where user ='root';
1

刷新

flush privileges;
1

记得在开通3306端口

*如有需要再执行之前授权报错的命令即可成功，最后同样使用**flush privileges;*命令刷新。

如果遇到远程链接密码错误问题，在服务器登录修改密码

ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password';
1

(7)、新建用户允许远程访问

在mysql交互环境中，用户信息包含用户名user和主机名host。因此创建用户时，用户信息是用户名@主机，如果只是本地连接数据库，默认是localhost,如果允许所有客户端（远程）连接，可以用通配符%。

#创建用户
create user 'xwj'@'%' identified with mysql_native_password by 'password';

#赋予权限
#grant all privileges on testdb to xwj;    如果想把某一个数据库的所有权限都赋值给xwj
grant all on *.* to `xwj`@`%`;   #为xwj用户赋予所有主机的所有权限，但不包含给其他账号赋予权限的权限。这里的*.*第一个*表示数据库名，第二个为表名，*.*表示对所有库所有表赋全部权限，如果要指定则改为具体的数据库名和表名

#刷新
flush privileges;
1
2
3
4
5
6
7
8
9

revoke all on *.* from 'xwj'@'%';      #移除用户xwj权限
drop user xwj;    #删除用户xwj
1
2

(8)、卸载mysql

sudo yum remove  mysql mysql-server mysql-libs mysql-server mysql-community-server # 快速删除
sudo rpm -qa|grep -i mysql  # 查找残留文件
sudo yum remove <文件名> # 逐个删除残留文件
whereis mysql  # 查找残留目录
sudo rm –R <残留目录> # 删除残留目录
1
2
3
4
5

3、Django项目部署

(1)、上传Django项目

将文件上传服务器的方法有很多，可以将文件使用git上传GitHub，或者码云等平台，再在服务器中下载；也可以使用Xftp等三方工具将文件直接上传到服务器；也可以直接使用Pycharm上传代码。这里不多做介绍

(2)、Django项目运行配置

新建虚拟环境

mkvirtualenv django_torch
1

安装python第三方库

pip install -r res.txt
1

我有使用mysqlclient，需要提前安装依赖

sudo yum python3-devel mysql-devel    #centos

#如果是ubuntu 则是 sudo apt-get install libmysqlclient-dev
1
2
3

安装好第三方库之后，去数据库中新建数据库，修改django项目中的setting数据库配置，然后生成迁移文件，执行迁移

#生成迁移文件
python manage.py makemigrations

#执行迁移
python manage.py migrate
1
2
3
4
5

将django的启动端口(8000)加入安全组，直接启动服务，访问服务接口，测试能否正常访问数据。

 python manage runserver 0.0.0.0:8000
1

目前项目启动正常运行，但是运行能力太弱，访问量提升之后就会崩溃，因为是单线程运行的项目，为了提高项目的并发能力，此时需要使用到nginx和uwsgi。

(3)、使用uwsg启动程序

uwsgi是一个应用服务器，非静态文件的网络请求必须通过他完成， 他也可以充当静态文件服务器，但不是他的强项。

pip install uwsgi
1

然后进入项目文件夹，配置uwsgi.ini文件,即启动文件。

[uwsgi]
#http通信
http = 0.0.0.0:8000
#python虚拟环境路径
home = /home/xwj/.virtualenv/django_torch
#配置项目路径，项目的所在目录
chdir=/home/xwj/WorkSpace/Torch
#配置wsgi接口模块文件路径,也就是wsgi.py这个文件所在的目录名（dacts/wsgi.py）
module=Torch.wsgi
#配置启动的进程数
processes=2
#配置每个进程的线程数
threads=2
#配置启动管理主进程
master=True
#配置存放主进程的进程号文件
pidfile=uwsgi_torch.pid
#配置dump日志记录,
#daemonize=uwsgi_torch.log
buffer-size = 65535
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

然后执行uwsgi.ini文件,启动服务

uwsgi --ini uwsgi.ini
1

若想要根据端口杀死服务

sudo fuser -k 8080/tcp
1

4、使用Nginx部署Django项目

虽然uwsgi可以正常的部署我们的项目了。但我们还是依然要采用nginx来部署web服务器。使用nginx来部署web服务器有以下好处：

• 安全：不管什么请求都要经过代理服务器，这样就避免了外部程序直接攻击web服务器

• 负载均衡：根据请求情况和服务器负载情况，将请求分配给不同的web服务器，保证服务器性能。

• 提高web服务器的IO性能：nginx具备优秀的静态内容处理能力，然后将动态内容转发给uWSGI服务器，可以达到很好的客户端响应。

• 运维起来更加方便：比如要将某些IP写入黑名单，nginx可以非常方便的写进去。而uWSGI可能还要写一大段代码才能实现。

(1)、Nginx安装

nginx常用命令

systemctl status nginx    #查看nginx状态
systemctl start nginx     #启动nginx
systemctl stop nginx      #停止nginx
systemctl restart nginx   #重启 nginx
1
2
3
4

安装nginx

sudo yum install nginx
1

(2)、配置

进入nginx文件夹

需要配置三个文件

• 第一个是将项目文件下的uwsgi.ini的http通信变为socket通信

  修改前面的uwsgi.ini文件

  [uwsgi]
  #配置和nginx连接的socket连接   防止和前端访问的接口冲突，这里换一个端口启动服务，将nginx中的server监听端口改外8000
  socket= 127.0.0.1:5000
  #python虚拟环境路径
  home = /home/xwj/.virtualenv/django_torch
  #配置项目路径，项目的所在目录
  chdir=/home/xwj/WorkSpace/Torch
  #配置wsgi接口模块文件路径,也就是wsgi.py这个文件所在的目录名（dacts/wsgi.py）
  module=Torch.wsgi
  #配置启动的进程数
  processes=2
  #配置每个进程的线程数
  threads=2
  #配置启动管理主进程
  master=True
  #配置存放主进程的进程号文件
  pidfile=uwsgi_torch.pid
  #配置dump日志记录
  #daemonize=uwsgi_torch.log
  buffer-size = 65535
  
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21

• 第二个是配置nginx

  因为nginx.conf 里面会默认导入conf.d里的.conf文件，为了以后方便管理，我们在conf.d里面新建一个base_nginx.conf文件（文件名可以随意取，但必须要是.conf文件）

  # 配置服务器 
  server {
          # 监听的端口号 
          listen 8000;
          # 域名
          server_name localhost;
          charset utf-8;
          # 静态文件访问的url 
          location /static {
          # 静态文件地址 ，有就放到这里
          }
          # 最后，发送所有非静态文件请求到flask服务器
          location / {
          uwsgi_pass 127.0.0.1:5000;   #后端启动端口
          # uwsgi_params文件地址 
          include /etc/nginx/uwsgi_params;
          }
  }
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18

• 将nginx.conf的用户改成使用用户，如果有多个用户，可以改为用户组
  

修改完成后记得重启nginx

sudo systemctl restart nginx
1

返回到项目文件夹，重新启动uwsgi服务

uwsgi --ini uwsgi.ini
1

5、Nginx部署vue项目

(1)、上传vue项目

将打包后的vue上传到服务器

(2)、配置

继续去上面的conf.d文件夹的nginx文件添加文件

server{
        # vue
        listen 8080;
        client_max_body_size 75M;
        # 域名
        server_name localhost;
        access_log      /home/xwj/WorkSpace/vue_torch/vue_access.log;
        error_log       /home/xwj/WorkSpace/vue_torch/vue__error.log;
        charset utf-8;
        location / {
                root /home/xwj/WorkSpace/vue_torch;
                index index.html index.htm;
                #add_header Access-Control-Allow-Origin *;
                try_files $uri $uri/ /index.html;
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

重启nginx

sudo systemctl restart nginx
1

注意点：

• 去安全组添加8080端口
• 去django项目中配置跨域请求
• 8080是vue项目的监听端口，当nginx监听到8080端口后就会根据配置的location下面的路径转发前端页面
• vue项目访问后端是通过8000端口，nginx监听到8000端口后，将服务转发给django服务的5000进行交互

总结

到这里整个部署基本完成了，nginx部署端口这块比较容易出问题，部署一个前后端项目，我这里用到了3个端口：

• 8080是请求前端页面的端口，也就是在浏览器地址栏输入的端口；这个端口是在服务器配置里设置的
• 8000是前端页面去通过这个端口，请求后端数据的，这个是在vue项目开发是写死的，由前后端人员共同约定的
• 5000是后端服务的启动接口，配置uwsgi.ini时可以只允许服务器本机访问，也可以允许其他主机访问
• 简单理解就是，8080是前端，5000是后端，8000是中转站