示例项目 -- LuffyCity.com 的上线
具体解释,vue前端提供静态页面,且可以向后台发起get,post等restful请求
django后台提供数据支撑,返回json数据,返回给vue,进行数据页面渲染
下面是部署笔记:
-- 先从后端搞起 解决环境依赖 -- 解决环境依赖的办法:1 挨个报错的处理2 pip3 freeze >requirements.txt 3 传这个txt文件到linux linux通过命令安装 pip3 install -r requirements.txt4 或者自己创建 touch requirements.txtvim requirements.txt 写进去包数据
(s17luffy) [root@master luffy_boy]# 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
5 安装uwsgi启动项目后端
启动方式1 :用参数启动 uwsgi --socket :8000 --module luffy_boy.wsgi
方式2 用配置文件启动 创建 touch uwsgi.ini
vim uwsgi.ini 写入
启动命令 (虚拟环境) [root@web02 opt]# uwsgi --ini luffy_boy/uwsgi.ini 找见 .ini文件的地址
[uwsgi] # Django-related settings # the base directory (full path) chdir = /opt/luffy_boy # Django's wsgi file module = luffy_boy.wsgi # the virtualenv (full path) home = /root/Envs/s17luffy # process-related settings # master master = true # maximum number of worker processes processes = 1 # the socket (use the full path to be safe socket = 0.0.0.0:6666 此处需注意 # ... with appropriate permissions - may be needed # chmod-socket = 664 # clear environment on exit vacuum = true
#后台运行uwsgi
daemonize=yes
-- 前端代码 vue 打包搞起 --1 准备node环境,下载node环境包wget https://nodejs.org/download/release/v8.6.0/node-v8.6.0-linux-x64.tar.gz2 解压包tar -zxvf node-v8.6.0-linux-x64.tar.gz3 添加到环境变量 vim /etc/profilePATH="......" 4 编译打包前端的vue文件1 修改vue提交的请求地址,修改文件是/opt/s17luffy/07-luffy_project_01/src/restful/api.js 2 更该接口内的地址原来是 127.0.0.1:8000/改成服务器的ip地址和端口sed -i "s/127.0.0.1/192.168.11.186/g" /opt/s17luffy/07-luffy_project_01/src/restful/api.js 此时进入vue代码的第一册层文件夹,
cd /opt/s17luffy/07-luffy_project_01
3 安装node模块,这是找到package.json,安装它的内容
npm install
4 编译打包vue代码,这一步会生成 dist 静态文件夹,用于nginx 展示,路飞的页面都在这里了
npm install build
5 配置nginx去找到这个路飞学城页面
修改 nginx.conf 参数如下所示:
虚拟主机1，用于找到vue页面server {listen 80;server_name s17dnf.com;location / {root /opt/s17luffy/dist; index index.html;}}虚拟主机2，用于反向代理，找到djangoserver{listen 8000;server_name 192.168.11.250;location / {include uwsgi_params;uwsgi_pass 0.0.0.0:6666;}}
nginx -t 检查
django是前端还是后端？ nginx -s reload 重启使得配置生效
-- 启动redis数据库,支撑购物车数据
redis-server redis.conf 默认6379端口
-- 确保前端vue正常,后端django正常,nginx启动正常,redis正常,在Windows中访问页面
-- 确保可以添加购物车数据,用户登陆
更多请访问 https://www.cnblogs.com/pyyu/p/10160874.html
