• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

Vue+Django项目部署详解

vue 搞代码 4年前 (2022-01-08) 22次浏览 已收录 0个评论

这篇文章主要介绍了Vue+Django项目部署详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

本地项目配置

1 复制 luffy/settings/dev.py为prop.py

修改luffy/settings/prop.py中以下几项

(1) allow_hosts

 ALLOWED_HOSTS = [   'api.youdomain.com', ]

(2) 跨域白名单

 CORS_ORIGIN_WHITELIST = (   # 前端域名   "www.youdomain.com",   # 后端api接口域名   "api.youdomain.com" ) 

(3) 支付宝电脑网站支付配置信息

 ALIPAY_APPID = "xxxxxxx" APP_NOTIFY_URL = None ALIPAY_DEBUG = True # APIPAY_GATEWAY="https://openapi.alipay.com/gateway.do" APIPAY_GATEWAY = "https://openapi.alipaydev.com/gateway.do" ALIPAY_RETURN_URL = "http://www.youdomain.com/success" ALIPAY_NOTIFY_URL = "http://api.youdomain.com:8000/payments/success" 

2 修改luffy/wsgi.py文件

第14行

 os.environ.setdefault("DJANGO_SETTINGS_MODULE", "luffy.settings.prop")

3 修改manage.py文件

不改也可以,为了在服务器测试方便一点

第6行

 os.environ.setdefault("DJANGO_SETTINGS_MODULE", "luffy.settings.prop") 

4 导出pip安装的包列表

 freeze > docs/requirements.txt

5 收集静态文件

 python manage.py collectstatic

6 提交并推送

 git add . git commit -m "项目完成" git push -u origin master

7 前端配置修改 src/settings.js

设置后端服务器域名和端口

 Host:http://api.youdomain.com:80,

8 构建

 npm run build

9 提交并推送

 git add . git commit -m "项目完成" git push -u origin master 

服务器上配置

1 安装所需软件

 yum install python36-pip.noarch python36.x86_64 python36-devel.x86_64 nginx gi<a>本文来源gao*daima.com搞@代#码&网6</a>t gcc -y pip3 install virtualenv -i https://pypi.douban.com/simple

注意:uwsig 最好使用pip方式安装

 pip3 install uwsgi -i https://pypi.douban.com/simple

2 mysql数据库相关配置

(1)安装mysql

 yum install mysql-server -y 

或者使用容器

设置密码以及初始化配置请自行解决

(2) 启动数据库

 systemctl start mysqld 

(3)新建数据库luffy

 create database luffy; 

(4) 导入数据

 mysql -uroot -pmysql luffy <luffy.sql 

3 redis 安装与配置

可以使用 yum 安装并启动 ,简单粗暴!

为了使用最新版,我采用解压安装

那种方式你喜欢就好!

(1) 下载

 cd /opt/ wget http://download.redis.io/releases/redis-5.0.5.tar.gz 

(2) 解压并安装

 tar -xf redis-5.0.5.tar.gz cd /opt/redis-5.0.5 make && make install 

(3)修改配置文件

vim redis.conf
69行 bind 127.0.0.1
改为 bind 0.0.0.0

(4)启动Redis,并放置在后台

 nohup redis-server redis.conf & 

4 拉取前端项目

 cd /opt/ git clone https://gitee.com/SunHarvey/luffyweb.git 

前端项目路径为 /opt/luffyweb/

只有 /opt/luffyweb/dist/ 文件有用 ,

dist用作前端根目录,其他的不要亦可!

5 创建虚拟环境

(1)创建虚拟环境

 cd /opt/ virtualenv luffy 

即就是虚拟环境路径为 /opt/luffy/

 cd /opt/luffy/

(2)激活虚拟环境

 source /opt/luffy/bin/activate

(3)拉取后端项目

 git clone https://gitee.com/SunHarvey/luffy.git

注:项目根路径为 /opt/luffy/luffy/

 cd luffy

可以看到以下文件

 docs luffy manage.py scripts static 

(4)pip安装所需包

我的 django 使用的是2.0版本,不需要因为 pymysql 报错该源码

删除 luffy/docs/requirements.txt中 xadmin中的那行

 pip3 install https://codeload.github.com/sshwsfc/xadmin/zip/django2 pip3 instal -r /opt/luffy/luffy/docs/requirements.txt 

(5)用 runserver 启动django项目看看是否正常

记得启动MySQL数据库和redis

 python manage.py runserver

没有报错的话继续,报错了就根据提示排除吧

6 uwsgi配置

(1) uwsgi.ini 配置内容如下

 vim /opt/luffy/luffy/uwsgi.ini [uwsgi] # 设置uwsgi 启动用户,不设置也可,会有警告,也可以设置为当前登录的用户 uid = nginx gid = nginx #使用nginx连接时使用,Django程序所在服务器地址 socket=127.0.0.1:8000 #直接做web服务器使用,Django程序所在服务器地址 #http=0.0.0.0:8080 #项目目录 chdir=/opt/luffy/luffy #项目中wsgi.py文件的目录,相对于项目目录 wsgi-file=luffy/wsgi.py # 进程数 processes=1 # 线程数 threads=2 # uwsgi服务器的角色 master=True # 存放进程编号的文件 pidfile=uwsgi.pid # 日志文件,因为uwsgi可以脱离终端在后台运行,日志看不见。我们以前的runserver是依赖终端的 daemonize=uwsgi.log # 指定依赖的虚拟环境 virtualenv=/opt/luffy/ # clear environment on exit #退出时清除环境 vacuum = true 

(2) 修改文件所有者, 如果用root启动可忽略此步骤

 chown -R nginx.nginx /opt/luffy/luffy/ 

也可以把nginx换成当前登录用户的用户名,其它用户也可以。

(3) 启动uwsgi , 记得启动MySQL数据库和redis

 uwsgi --ini /opt/luffy/luffy/uwsgi.ini 

7 nginx配置

(1) 创建配置文件

 vim /etc/nginx/conf.d/your.conf # 设置后端uwsgi服务器,可写多个用作负载均衡 upstream luffy {   server 127.0.0.1:8000; } # 后端 api服务器配置 server {   listen 80;   server_name api.youdomain.com;   location / {     include uwsgi_params;     uwsgi_pass luffy;   }   # 加载css、js文件   location ~ .*\.(css|js)$ {     root /opt/luffy/luffy/;     } } # 前端页面服务器配置 server {   listen 80;   # 不要怀疑,你没有看错!nginx的80端口可以启动 n 个域名!   server_name youdomain.com www.youdomain.com;   location / {     # /opt/luffyweb/dist/ 为npm run build生成的文件夹     root /opt/luffyweb/dist/;     index index.html;     try_files $uri $uri /index.html;   } } 

这是最基本配置,其它优化配置就不再赘述!

(2)检查nginx配置文件语法

 nginx -t 

(3) 启动nginx

 systemctl start nginx 

以上就是Vue+Django项目部署详解的详细内容,更多请关注gaodaima搞代码网其它相关文章!


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:Vue+Django项目部署详解

喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址