centos部署loki centos部署vue项目

服务器环境：centos7+nginx+uwsgi+python3+django
数据库：MySQL 8.0
项目框架：Django 3.7 + Vue + ElementUI

1、服务器部署

1.更新系统软件包

yum update -y

2.安装软件管理包和可能使用的依赖

yum -y groupinstall "Development tools"
yum install openssl-devel bzip2-devel expat-devel gdbm-devel readline-devel sqlite-devel psmisc libffi-devel

1.1、Python安装

python版本：3.7

1.下载Pyhton3到/usr/local 目录

cd /usr/local
wget https://www.python.org/ftp/python/3.7.3/Python-3.7.3.tgz

2.解压

tar -zxvf Python-3.7.3.tgz

3.进入Python-3.7.3路径

cd Python-3.7.3

4.编译安装到指定路径。（/usr/local/python3 路径可以自己指定，自己记着就行，下边要用到。）

./configure --prefix=/usr/local/python3

5.安装python3

make
make install

6.安装完成之后建立软链接，添加变量，方便在终端中直接使用python3

ln -s /usr/local/python3/bin/python3.7 /usr/bin/python3

7.Python3安装完成之后pip3也一块安装完成，不需要再单独安装，同样给pip3建立软链接

ln -s /usr/local/python3/bin/pip3.7 /usr/bin/pip3

8.查看Python3和pip3安装情况

1.2、virtualenv安装和使用

1.安装virtualenv，方便不同版本项目管理

pip3 install virtualenv

2.建立软链接

ln -s /usr/local/python3/bin/virtualenv /usr/bin/virtualenv

3.安装成功在根目录下建立两个文件夹，主要用于存放env和网站文件的。

mkdir -p /data/env
mkdir -p /data/wwwroot

4.切换到/data/env/下，创建指定版本的虚拟环境

• 虚拟环境名称：pyweb
• 指定python版本python3，不然会默认使用系统自带的python2

virtualenv --python=/usr/bin/python3 pyweb

5.然后进入/data/env/pyweb/bin，启动虚拟环境

cd /data/env/pyweb/bin 
source activate

• 启动成功之后，红线位置会出现虚拟环境名称，代表启动成功。

6.退出虚拟环境

• 退出虚拟环境不用进入指定目录，在任意路径下面执行下面命令即可。

deactivate

1.3、django和uwsgi的安装

1.非虚拟环境下，安装uwsgi

pip3 install uwsgi

2.给uwsgi建立软链接，方便使用,一次就可以，虚拟环境中安装不需要此操作。

ln -s /usr/local/python3/bin/uwsgi /usr/bin/uwsgi

3.进入虚拟环境pyweb的bin目录下，激活该虚拟环境

• 为什么要进入虚拟环境呢？因为我们可能不止部署一个项目，每个项目到环境配置不一样，一个虚拟环境相当于一个独立的空间。

cd /data/env/pyweb/bin
source activate

安装django和uwsgi django版本：2.2

uwsgi要安装两次，先在系统里安装一次，然后进入对应的虚拟环境安装一次。

pip3 install django==2.2
pip3 install uwsgi

1.4、nginx安装

1.进入home目录，执行下面命令

cd /home/
wget http://nginx.org/download/nginx-1.13.7.tar.gz

2.下载完成后，执行解压命令

tar -zxvf nginx-1.13.7.tar.gz

3.进入解压后的nginx-1.13.7文件夹，依次执行以下命令

./configure
make
make install

1.5、Mysql8.0安装

1.安装前，我们可以检测系统是否自带安装 MySQL

rpm -qa | grep mysql

2.如果你系统有安装，那可以选择进行卸载

rpm -e mysql  // 普通删除模式
rpm -e --nodeps mysql  // 强力删除模式，如果使用上面命令删除时，提示有依赖的其它文件，则用该命令可以对其进行强力删除

3.接下来我们在 Centos7 系统下使用 yum 命令安装 MySQL，需要注意的是 CentOS 7 版本中 MySQL数据库已从默认的程序列表中移除，所以在安装前我们需要先去官网下载 Yum 资源包，下载地址为：
https://dev.mysql.com/downloads/repo/yum/

wget https://repo.mysql.com//mysql80-community-release-el7-3.noarch.rpm
rpm -ivh mysql80-community-release-el7-3.noarch.rpm
yum update
yum install mysql-server

4.权限设置

chown mysql:mysql -R /var/lib/mysql

5.初始化 MySQL

mysqld --initialize

6.启动 MySQL

systemctl start mysqld

7.查看 MySQL 运行状态

systemctl status mysqld

8.Mysql安装成功后，默认的root用户密码为空，你可以使用以下命令来创建root用户的密码

[root@host]# mysqladmin -u root password "new_password";

2、代码准备

2.1、Django代码

1.在项目目录下用下面的命令把当前的环境依赖包导出到requirements.txt文件

pip freeze > requirements.txt

2.django项目集成vue，修改django的setting.py文件

TEMPLATES = [
	{
		'DIRS': [os.path.join(BASE_DIR, 'vue/dist')],  # 第一处修改
	}，
]

# 第二处修改
DEBUG = False
ALLOWED_HOSTS = ['*']

# 第三处修改——添加静态文件
STATICFILES_DIRS = [
	os.path.join(BASE_DIR, 'vue/dist/static'),
]

3.修改django的url.py文件

from django.views.generic.base import TemplateView
urlpatterns = [
	path(r'', TemplateView.as_view(template_name='index.html')),  # 将路径指向vue中到index页面
]

4.文件上传

• linux系统可以在本地将代码文件打包成zip格式或者其他格式到压缩包，并上传服务到/data/wwwroot/目录下
• windows系统图形界面压缩即可

zip -r temp.zip temp  # 压缩命令

• 解压，使用命令：

unzip temp.zip  # 解压缩命令

• 项目文件名称为temp。

5.进入虚拟环境然后进入项目路径安装requirements.txt里的依赖包

cd /data/env/pyweb/bin/  # 进入虚拟环境，已经进入虚拟环境就不用此步骤
source activate  # 激活
cd /data/wwwroot/temp/  # 项目根目录
pip3 install -r requirements.txt  # 安装依赖，requirements.txt生成步骤见上

2.2、vue代码

1.进入vue项目路径下找到并打开存放baseURL到文件，修改baseURL

baseURL: 'http://127.0.0.1:8080/',  //原来的
baseURL: 'http://域名/',  //有域名就填域名，网址输入域名就可以访问
baseURL: 'http://ip/',  //没有域名就填写ip，网址输入ip就可以访问
baseURL: 'http://ip:8080/',  //指定80端口，网址输入ip:80 可以访问

2.修改配置代码，在vue.config.js里面加入如下代码，防止打包过后的dist文件里面没有sattic文件夹，打开页面找不到路径，空白报错。

publicPath: './',
assetsDir: 'static',
productionSourceMap: false,

3.build 项目

• 进入vue代码根目录，执行命令 此命令会生成dist文件，打包dist文件

npm run build
zip -r dist.zip dist

4.在django项目根目录下面创建vue文件夹，将dist.zip上传到此处，并解压，目录结构为:/data/wwwroot/temp/vue/dist

2.3、数据库文件

1.在本地将数据库文件以sql格式导出，上传到服务器。

mysqldump -uroot -ppassword qiantai>qiantai.sql

2.打开终端，运行命令：

mysql -uroot -pxxx # xxx为密码
use 数据库名;
source /path/to/your/qiantai.sql;
exit;

3、运行配置

• 进入对应到虚拟环境中，进入django目录下通过如下命令运行一下项目，如果能正常启动则进行下一步，不能正常运行往上检查。

python3 manage.py runserver

3.1、uwsgi配置文件

1.在django项目根目录：/data/wwwroot/zzbceping/下创建uwsgi配置文件：uwsgi.ini #添加配置选择

[uwsgi]
#配置和nginx连接的socket连接
socket=0:8081
#配置项目路径，项目的所在目录
chdir=/data/wwwroot/temp
#配置wsgi接口模块文件路径,也就是wsgi.py这个文件所在的目录名
wsgi-file=temp/wsgi.py
#配置启动的进程数,根据电脑配置来
processes=9
#配置每个进程的线程数，根据电脑配置来
threads=30
#配置启动管理主进程
master=True
#配置存放主进程的进程号文件
pidfile=uwsgi.pid
#配置dump日志记录
daemonize=uwsgi.log`

2.通过下面的命令启动运行uwsgi

uwsgi --ini  uwsgi.ini  # 显示 [uWSGI] getting INI configuration from uwsgi.ini 表明uwsgi运行成功

ps -ef|grep uwsgi  # 查看确认是否uwsgi启动
uwsgi --stop uwsgi.pid  # 停止运行uwsgi，通过包含主进程编号的文件设置停止项目
uwsgi --reload uwsgi.pid  # 重启uwsgi
killall -9 uwsgi  # 终止所有uwsgi进程
netstat -tunpl|grep 8080 #查询指定端口
kill -9 1321#此1321为进程号

3.2、nginx配置

1.进入nginx目录

cd /usr/local/nginx/conf/

2.备份nginx.conf

cp nginx.conf nginx.conf.bak

3.编辑nginx.conf

vi nginx.conf
按Ins键开始编辑
---------------------------------
# 编辑内容如下
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    include /usr/local/nginx/conf/vhost/*.conf;  # 直接将每个项目到配置文件放在vhost中，可以应对同一服务器配置多个项目到情况。
}

4.保存并退出

按Esc键退出编辑
:wq  # 保存并退出
:q  # 直接退出

5.创建文件夹vhost

mkdir vhost
cd vhost

6.创建文件temp.conf，并编辑

mkdir temp.conf
vi temp.conf
按Ins键开始编辑
----------------------------------
# 编辑内容
server {
	listen 8080;  # 项目运行在8080端口，此端口与前端vue中baseurl里面的端口地址一样，前端项目与后端项目交互的地址
    server_name 47.100.98.223:8080;  #改为自己的域名，没域名修改为外网地址加端口
    charset utf-8;
    location / {
    	include uwsgi_params;
        uwsgi_pass 127.0.0.1:8081;  #端口要和uwsgi里配置的一样
    }
    location /static/ {
    alias /data/wwwroot/temp/vue/dist/static/; #静态资源路径
    }
    location /media/ {
    alias /data/wwwroot/temp/media/; #配置django项目中的静态miedia路径
    }
    access_log    /data/wwwroot/temp/access.log;#存放错误日志文件
    error_log    /data/wwwroot/temp/error.log
}

7.如果同一服务器部署多个项目，只要再创建一个虚拟环境，进行同样的操作，另外再vhost中创建另外一个项目的conf文件即可。

8.进入/usr/local/nginx/sbin/目录

cd /usr/local/nginx/sbin/

9.检查配置文件是否有错

./nginx -t

10.运行nginx

./nginx

#一些nginx的指令
ps -ef|grep nginx  # 查看nginx是否启动
killall -9 nginx #终止所有的nginx进程

3.3、注意事项

• 以上大部分操作都在虚拟环境中操作
• 修改相关文件之后都要将nginx和uwsgi重启
• 要启动Django项目和Vue项目时，只需启动nginx和uwsgi就可以
• 附上常用操作合集

uwsgi
------------------
# 进入django项目根目录下面执行
uwsgi --ini uwsgi.ini  # 启动
uwsgi --stop uwsgi.pid  # 停止
uwsgi --reload uwsgi.pid  # 重启
killall -9 uwsgi  # 终止所有uwsgi
ps -ef|grep uwsgi  # 查看是否启动

nginx
------------------
cd /usr/local/nginx/sbin/  # 进入目录
./nginx  # 启动
./nginx -s reload  # nginx重启
./nginx -s quit  # 终止
ps -ef|grep nginx  # 查看nginx是否启动
killall -9 nginx #终止所有的nginx进程

参考

• https://www.django.cn/article/show-4.html
• https://www.runoob.com/mysql/mysql-install.html
•