前后端分离,vue前端提供静态页面,且可以向后台发起get,post等restful请求。
django后台提供数据支撑,返回json数据,返回给vue,进行数据页面渲染
后端
创建虚拟环境 解决django文件的环境依赖
pip install 环境依赖包
(通过windows转至linux环境下 处理windows环境下环境依赖   
(pip freeze >  requirements.txt : 将windows下python所需要的包 写入requirements.txt中
在linux中通过命令安装 pip3 install -r  requirements.txt )
(创建requirements.txt 需要的包写入, 在linux中通过命令安装 pip3 install -r requirements.txt)
)
安装uwsgi
(pip install uwsgi)
启动方式 1 用参数启动    (uwsgi --socket  :8000  --module  luffy_boy.wsgi)
启动方式2:用配置文件启动 
在项目的中 创建 uwsgi.ini 文件 写入配置
[uwsgi]
# Django-related settings
# the base directory (full path)     项目的绝对路径
chdir           = /opt/luffy_boy
# Django's wsgi file                        带有wsgi.py的文件路径(相对路径)
module          = luffy_boy.wsgi
# the virtualenv (full path)
home            = /root/Envs/s17luffy   虚拟环境的路径   (cdvirtualenv 进入  pwd查看  )
# 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  --ini   uwsgi.ini)
前端 vue
node准备
解压  (tar  -zxvf   包名) (unzip  包名)   压缩 (tar   -zcvf  文件 )
添加环境变量    (vim  /etc/profile )  刷新 环境变量   ( source  /etc/profile )  查看 (echo  $PATH)
开始编译打包前端vue文件
修改vue文件   vue文件下的/src/restful/api.js
修改 成当前服务器的ip和端口号  全局修改文件  ( sed  -i 's/需要修改的的内容/修改后的内容/g '  vue文件的绝对路径/src/restful/api.js)
进入 vue文件 找到找到package.json,安装它的内容   (npm  install)
编译打包vue代码,这一步会生成dist静态文件夹,用于nginx展示   (npm  run  build )
配置nginx
修改nginx.conf   需要两个虚拟主机
虚拟主机1   用于找到vue页面
server {
                listen       80;
                server_name  localhost;     # 访问的地址
                location / {
                root  /opt/s17luffy/dist;        # 展示vue页面 dist的绝对路径
                index index.html;
                }
    }
虚拟主机2  用于反向代理 找到django
server{
listen 8000;
    server_name  localhost;
 
    location / {
include uwsgi_params;
uwsgi_pass 0.0.0.0:6666;
    }
重启nginx使配置生效  (nginx -s  reload )
redis数据库
启动redis数据库 ( redis-server redis.conf )
 
 

vue+uwsgi+nginx部署前后端分离项目的更多相关文章

  1. 使用 Nginx 部署前后端分离项目,解决跨域问题

    前后端分离这个问题其实松哥和大家聊过很多了,上周松哥把自己的两个开源项目部署在服务器上以帮助大家可以快速在线预览(喜大普奔,两个开源的 Spring Boot + Vue 前后端分离项目可以在线体验了 ...

  2. nginx+vue+uwsgi+django的前后端分离项目部署

    Vue+Django前后端分离项目部署,nginx默认端口80,数据提交监听端口9000,反向代理(uwsgi配置)端口9999 1.下载项目文件(统一在/opt/luffyproject目录) (1 ...

  3. linux --- 部署前后端分离项目

    vue + uwsgi +nginx 部署前后端分离项目 准备项目 1.将前端vue项目包和后端django项目包上传服务器,通过lrzsz,直接从windows拖进linux中 2.解压缩操作 前端 ...

  4. centos7部署前后端分离项目的过程

    概述 本文主要讲解在安装了centos7的Linux主机中部署前后端分离项目的过程. 前端项目名为:vue_project:后端项目名为:django_project. 将这两个项目放在/opt/wh ...

  5. Nginx部署前后端分离服务

    飘过... 一,安装Nginx 二,配置nginx 一般nginx配置文件在etc目录下 另,如何找nginx.conf配置文件: 在前后端分离端项目里,前端的代码会被打包成为纯静态文件.使用 Ngi ...

  6. 在centos7.6上部署前后端分离项目Nginx反向代理vue.js2.6+Tornado5.1.1,使用supervisor统一管理服务

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_102 这一次使用vue.js+tornado的组合来部署前后端分离的web项目,vue.js不用说了,前端当红炸子鸡,泛用性非常广 ...

  7. 海纳百川无所不容,Win10环境下使用Docker容器式部署前后端分离项目Django+Vue.js

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_179 随着现代化产品研发的不断推进,我们会发现,几乎每个产品线都会包含功能各异的服务,而且服务与服务之间存在也会存在着错综复杂的依 ...

  8. docker+nginx+redis部署前后端分离项目!!!

    介绍本文用的经典的前后端分离开源项目.项目的拉取这些在另一篇博客!!! 其中所需要的前后端打包本篇就不做操作了!!不明白的去看另一篇博客!!! 地址:http://www.cnblogs.com/ps ...

  9. vue.js+UEditor集成 [前后端分离项目]

    首先,谈下这篇文章中的前后端所涉及到的技术框架内容. 虽然是后端的管理项目,但整体项目,是采用前后端分离的方式完成,这样做的目的也是产品化的需求: 前端,vue+vuex+vue router+web ...

随机推荐

  1. JavaWeb三大组件

    一.JavaWeb三大组件 Servlet,Listener,Filter.它们在JavaWeb开发中分别提供不同的功能. JavaWeb三大组件都必须在Web.xml中配置 二.三大组件 1.Ser ...

  2. eclipse juint4 出错!!!

    今天在学习javaee,调用方法的时候突然出现这个错误,之前还好使,调用了几次就不好使了,我查了很多问题,据说是harmcrest的jar包没有导进来,或者是junit的jar包版本太低了,我过段时间 ...

  3. 廖雪峰 JavaScript 学习笔记(函数)

    JavaScript中,定义函数的方式如下: function abs(x) { if (x >= 0) { return x; } else { return -x; } } 上述abs()函 ...

  4. python多环境下虚拟环境的搭建和使用

    由于开发环境要求,或者实际需要.经常会出现python2.7和python3.x共存下的开发环境问题.虚拟环境的搭建可以很好的隔离Projects的开发环境. 1.首先解决python2.7和pyth ...

  5. Qt551.窗口滚动条

    1.代码的方式来创建 ScrollArea,然后使用 倒是 正常(有滚动条显示),但是此方式太麻烦 不如直接拖控件来的方便直观快捷. 但是,直接拖控件的方式 ScrollArea中无法显示出 滚动条, ...

  6. webgl学习

    学习网址: https://www.yiibai.com/webgl/webgl_shaders.html# 多重纹理 https://blog.csdn.net/Chase_freedom/arti ...

  7. 2018-2019-2 网络对抗技术 20165303 Exp6 信息搜集与漏洞扫描

    实践内容 (1)各种搜索技巧的应用 (2)DNS IP注册信息的查询 (3)基本的扫描技术:主机发现.端口扫描.OS及服务版本探测.具体服务的查点(以自己主机为目标) (4)漏洞扫描:会扫,会看报告, ...

  8. React文档(二十一)协调

    React提供了一个声明式地API因此你不用担心每一次更新什么东西改变了.这使得开发应用变得简单,但是这个东西在React中如何实现的并不是很明显.这篇文章会解释我们在React的算法中所做的选择以便 ...

  9. PAT 1124 Raffle for Weibo Followers

    1124 Raffle for Weibo Followers (20 分)   John got a full mark on PAT. He was so happy that he decide ...

  10. 229. Majority Element II求众数II

    网址:https://leetcode.com/problems/majority-element-ii/ 参考:https://blog.csdn.net/u014248127/article/de ...