Vue+Django+Restframework+Nginx前后端分离项目部署

     阅读:50

        

目录

先介绍技术栈:

1.安装python

2.安装nginx

3.安装uwsgi,直接使用pip安装。

4.上传写好的的代码包。

5.配置uwsgi文件

6.配置Nginx配置文件:

7.浏览器测试


        开门见山,前段时间实地部署了一个web项目,鉴于目前各种博客教程琳琅满目但不完整,本贴将记录一个完整的web前后端分离项目的部署流程,保姆级!!!!!!!!!


先介绍技术栈:

        前端:vue、bootstrap

        后端:python、django-restframework

        本地代理服务器:nginx、uwsgi (uwsgi加载动态资源 Nginx加载静态资源)

        云服务器:阿里云腾讯云这些都行(centos 7)

1.安装python

        我使用python3.6,版本自己选择就好,为了简洁,把python安装专门抽离出来, 请参考:python安装教程

2.安装nginx

        nginx的部署包括反向代理和负载均衡,由于只有一台服务器,请求量也不大,故我只使用了反向代理。安装教程见下面链接:

Nginx安装教程

3.安装uwsgi,直接使用pip安装。

pip3 install uwsgi

        建立软连接:

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

        为了保证端口全部开放,可关闭防火墙(慎重)或者指定端口:

systemctl stop firewalld.service     //关闭防火墙
systemctl status firewalld.service     //查看状态

        安装好uwsgi后,要先测试一下能不能用,测试通过后再将配置项写入配置文件,测试脚本test.py如下所示:

def application(env, start_response):
     start_response(‘200 OK’, [(‘Content-Type’,‘text/html’)])
     return [b"This is struggle uWSGI test "]

        测试命令如下,(ip默认为127.0.0.1(访问公网ip即可),端口随便指定,但要在服务器控制台查看指定端口是否已经开启!!!这里需要注意的是,如果使用阿里云,不止要在操作系统开放指定端口,还要在用户控制台开放指定端口,这里就不演示了,就进入控制台后找到云服务器设置,然后点点点.....就好了):

uwsgi --http :9090 --wsgi-file test.py

        执行测试脚本,在本地浏览器访问服务器的公网ip(不是内网)+端口号,例如:222.25.31.8:9090    如果浏览器正常显示“This is struggle uWSGI test ”,就说明测试成功,uwsgi和服务器都是好的。

4.上传写好的的代码包。

        整个Django项目,包括前端文件,前端文件建议放在templete目录下。

        上传可以使用rz命令,如果提示没有的话使用 yum install lrzsz 安装一下就行。

        上传后开始安装代码所需要的依赖包,安装完成后先本地执行一下,看看报不报错。然后使用下面命令测试,里边的路径和端口一定要改成自己的:

uwsgi --chdir /root/login  --http :8080 --module login.wsgi:application
如果使用的是虚拟环境添加 --home参数

查看打印的日志,没有报错的话就说明没问题。停掉将配置写入配置文件。

5.配置uwsgi文件

        新建一个uwsgi.ini文件,写下面的配置,具体每个表示什么意思就不解释了,可以自行百度。把对应的配置项改成自己的就行。

[uwsgi]
socket = 127.0.0.1:8080
chdir = /root/login
module = login.wsgi:application
master = True
processes = 4
vacuum = true 
daemonize = /root/login/uwsgi_log.log 
pidfile = /root/login/uwsgi_pid.pid

        启动uwsgi配置文件:

uwsgi --ini uwsgi.ini

         附上相关命令:

uwsgi --reload uwsgi/uwsgi.pid    //重启uwsgi
uwsgi --stop uwsgi/uwsgi.pid       //停止uwsgi

6.配置Nginx配置文件:

vim /usr/local/nginx/conf/conf.nginx
server {
        listen       80;
        server_name  www.xuptaiedu.xyz;       //改成自己的域名或者公网ip

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /root/login/templates;           //改成自己的静态资源路径
            index  index.html index.htm;
        }

        由于部署的是前后端分离的项目,故还需要添加一个前端向后端发请求的端口,在默认的server下新添加一个server:

 server{
        listen 8001;              //前端向后端请求的端口,如果有多个,在下面添加多个server
	    server_name www.xuptaiedu.xyz;     //自己的域名或公网ip

        location / {
        include uwsgi_params;

        uwsgi_pass 127.0.0.1:8080;      //这个端口一定要是uwsgi配置文件中写的端口
}

        配置好后,启动nginx,(如果按照我的nginx安装教程配置了软连接,不进入nginx目录也行):

cd /usr/local/nginx/sbin
./nginx

        或者进入上述文件夹,使用重启命令:

nginx -s reload

7.浏览器测试

        最后一步,在浏览器输入公网ip,如果正常打开首页,则配置正常。