准备前后端项目，vue 和 drf项目
cd /opt/vue_drf
wget https://files.cnblogs.com/files/pyyu/luffy_boy.zip wget https://files.cnblogs.com/files/pyyu/07-luffy_project_01.zip
解压缩前后端项目
unzip luffy_boy.zip unzip 07-luffy_project_01.zip
从vue搞起(windows打包也可，linux打包也可以)
下载node二进制包，此包已经包含node，不需要再编译 wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz 解压缩 tar -zxvf node-v8.6.0-linux-x64.tar.gz 进入node文件夹 [root@web02 opt]# cd node-v8.6.0-linux-x64/ [root@web02 node-v8.6.0-linux-x64]# ls bin CHANGELOG.md etc include lib LICENSE README.md share [root@web02 node-v8.6.0-linux-x64]# ls bin node npm npx
将node命令，添加至linux环境变量,修改/etc/profile
vim /etc/profile 在末尾添加如下 /opt/vue_drf/node-v8.6.0-linux-x64/bin/
读取文件，生效PATH
source /etc/profile
测试path
[root@web02 node-v8.6.0-linux-x64]# node -v v8.6.0 [root@web02 node-v8.6.0-linux-x64]# npm -v 5.3.0
node环境有了，安装node模块，以及打包node项目
进入vue源码目录 cd 07-luffy_project_01/ 安装vue模块，默认去装package.json的模块内容，如果出现模块安装失败，手动再装 npm install 此时注意，你本地写的vue代码，接口很可能连接的服务器地址有问题，注意Axios.POST提交的地址，一定得发送给django应用（如果用了nginx，就发送给nginx的入口端口） 这里为了试验方便，将vue项目和django项目放在了一台服务器，通过nginx反向代理功能(8000端口)，转发vue请求给django(9000) 准备编译打包vue项目，替换配置文件所有地址，改为服务器地址 sed -i 's/127.0.0.1/192.168.119.12/g' /opt/07-luffy_project_01/src/restful/api.js 此时打包vue项目，生成一个dist静态文件夹 npm run build 检查dist文件夹 [root@web02 07-luffy_project_01]# ls dist/ index.html static
配置后端代码，解决虚拟环境，保证项目干净隔离
mkvirtualenv drf
[root@web02 opt]# cat 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
pip3 install -r allenv.txt
这个路飞代码数据库用的是sqllite，不需要配置数据库了
购物车用都的是redis，因此要启动服务器的redis-server服务端
cd /opt/redis-4.0.10/ mv redis-6380.conf redis-6379.conf sed -i "s/6380/6379/g" redis-6379.conf 然后去掉最后一行密码设置，具体内容如下： (drf) [root@qishione redis-4.0.10]# cat redis-6379.conf port 6379 daemonize yes pidfile /data/6379/redis.pid loglevel notice logfile "/data/6379/redis.log" dir /data/6379 protected-mode yes mkdir -p /data/6379
redis-server redis-6379.conf
通过uwsgi启动路飞项目
[uwsgi] # Django-related settings # the base directory (full path) chdir = /opt/vue_drf/luffy_boy # Django's wsgi file module = luffy_boy.wsgi # the virtualenv (full path) home = /root/Envs/drf # process-related settings # master master = true # maximum number of worker processes processes = 1 # the socket (use the full path to be safe #结合nginx使用的参数，将uwsgi运行在一个socket链接上 socket = 0.0.0.0:9000 #不用nginx，直接向访问到后端的数据页面 #http = 0.0.0.0:9000 # clear environment on exit vacuum = true
开始配置nginx软件，用nginx找到vue，且用nginx做反向代理
1.配置nginx，找到vue的index.html文件 编译nginx.conf ，写入如下配置 server { listen 80; server_name 192.168.11.37; #只要请求来自于192.168.11.37； location / { root /opt/vue_drf/07-luffy_project_01/dist; index index.html; } } 配置nginx，使用nginx反向代理功能 #虚拟主机1，用于找到vue的静态文件 server { listen 80; server_name 192.168.11.37; location / { root /opt/vue_drf/07-luffy_project_01/dist; index index.html; } } #虚拟主机2，用于接受vue发起的8000端口的请求，反向代理转发给9000的uwsgi应用 server { listen 8000; server_name 192.168.11.37 ; location / { include /opt/nginx112/conf/uwsgi_params; uwsgi_pass 0.0.0.0:9000; } }
重启nginx，加载配置文件
./nginx -s reload
准备好前后端的 项目配置，确保 以下每一项都正常
1.nginx的配置正常
2.vue的api.js发送数据地址正常
3.保证uwsgi启动项目正常
4.保证redis数据库运行正常
配置supervisor进程管理工具，管理uwsgi
编辑配置文件，写入管理路飞业务的命令 vim /etc/supervisor.conf 写入如下信息 [program:my_luffy] command=/root/Envs/drf/bin/uwsgi /opt/vue_drf/luffy_boy/uwsgi.ini stopasgroup=true ;默认为false,进程被杀死时，是否向这个进程组发送stop信号，包括子进程 killasgroup=true ;默认为false，向进程组发送kill信号，包括子进程
启动supervisord服务端
#启动服务端 supervisord -c /etc/supervisor.conf #管理客户端 supervisorctl -c /etc/supervisor.conf
