首页 > 系统相关 >Django + Vue 使用Nginx + uWsgi部署

Django + Vue 使用Nginx + uWsgi部署

时间:2024-06-04 09:56:40浏览次数:28  
标签:Vue log nginx deploy Django Nginx static mydjango uwsgi

1.settings.py配置
STATIC_ROOT = os.path.join(BASE_DIR, 'static/dist')
# 导入前后端静态资源后更改即可
DEBUG = True # 为True不容易暴露项目信息,当然也不显示BUG信息
ALLOWED_HOSTS = ['*']

STATIC_URL = '/static/'

 

2.django端打包静态资源
# 会在static 下生成
[root@dsc1 mydjango]# mkdir -p /deploy/mydjango/static
[root@dsc1 mydjango]# cd /deploy/mydjango
[root@dsc1 mydjango]# python manage.py collectstatic

128 static files copied to '/deploy/mydjango/static/dist'.

 

3.在uwsgi_conf中写入uwsgi.ini
[root@dsc1 deploy]# mkdir -p /deploy/uwsgi_conf
# vi /deploy/uwsgi_conf/uwsgi.ini

[uwsgi]
# 使用Nginx连接时使用,Django程序所在服务器地址和端口号
socket=127.0.0.1:8000
# 项目目录绝对路径
chdir=/deploy/mydjango
# 项目中wsgi.py文件的目录,相对于项目目录
wsgi-file=opwf/wsgi.py
# 进程数(机器核数的1倍)
processes=4
# 线程数
threads=20
# uwsgi服务器的角色
master=True
# 存放进程编号的文件
pidfile=uwsgi.pid
# 日志文件
daemonize=uwsgi.log

 

4.打包Vue静态资源
npm run build
提取dist静态资源
将静态资源放置后端 /deploy/mydjango/static/dist 下

文件如下
[root@dsc1 html]# cd /deploy/mydjango/static/dist/
[root@dsc1 dist]# ls
admin index.html static

 

5.配置ngnix

[root@dsc1 ~]# more /etc/nginx/nginx.conf
# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 4096;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    # Load modular configuration files from the /etc/nginx/conf.d directory.
    # See http://nginx.org/en/docs/ngx_core_module.html#include
    # for more information.
    include /etc/nginx/conf.d/*.conf;

    server {
        listen       8080;
        server_name  192.168.1.102;
        
        location /static {
            alias /deploy/mydjango/static;
        }

        location / {
           include uwsgi_params;
           uwsgi_pass 127.0.0.1:8000;
           uwsgi_ignore_client_abort on;
        }

        error_page 404 /404.html;
        location = /404.html {
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
        }
    }


    server {
        listen       8888;
        server_name  192.168.1.102;
        location / {
            alias   /deploy/mydjango/static/dist/;
            index  index.html,index.htm;
            try_files $uri $uri/ /index.html;
        }

    }

}

 

 

6.Nginx启动
systemctl restart nginx # 开启nginx
tail -f /var/log/nginx/access.log # 查看nginx接入日志
tail -f /var/log/nginx/error.log # 查看nginx错误日志

 

7.uWSGI启动
[root@dsc1 uwsgi_conf]# cd /deploy/uwsgi_conf
# 进入项目目录

uwsgi --ini uwsgi.ini
# 启动uwsgi的 django项目
# http://192.168.1.102:8888/

uwsgi --stop uwsgi.pid
# 关闭uwsgi

tail -f uwsgi.log
# 查看uwsgi日志

ps -ef|grep uwsgi
# 查看uwsgi服务是否启动

netstat -anptu | grep 8888
# 查看8888端口被哪一个程序 占用


8.测试验证
uwsgi --http :8080 --wsgi-file /deploy/mydjango/mydjango/test.py

 

标签:Vue,log,nginx,deploy,Django,Nginx,static,mydjango,uwsgi
From: https://www.cnblogs.com/hxlasky/p/18230206

相关文章

  • 从零手写实现 nginx-03-nginx 基于 Netty 实现
    前言大家好,我是老马。很高兴遇到你。我们希望实现最简单的http服务信息,可以处理静态文件。如果你想知道servlet如何处理的,可以参考我的另一个项目:手写从零实现简易版tomcatminicatnetty相关如果你对netty不是很熟悉,可以读一下Netty权威指南-01-BIO案例Netty......
  • vue3中ref绑定自定义组件没有获取到dom?
    问题<template><my-compref="test"/></template><scriptlang="ts"setup>consttest=ref()onMounted(()=>{console.log(test.value)})</script>打印出来的是一个proxy对象解决办法1.如果ref绑定的是一个普通的d......
  • 第十九节:带你梳理Vue2: 父组件向子组件传参(props传参)
    1.组件嵌套1.1组件的嵌套使用之前有说过,Vue组件跟Vue实例是一样的,因此在Vue中一个组件中也可以定义并使用自己的局部组件,这就是组件的嵌套使用例如:示例代码如下:<divid="app"><!--3.使用组件--><my-component></my-component></div><script>......
  • 第十八节:带你梳理Vue2: Vue组件中的注意事项和特例
    1.Vue组件名推荐使用驼峰命名现在我们来看看为什么在Vue中推荐注册组件时使用驼峰写法,在了解这个之前,相信大家应该都能明白为什么在Vue中,局部组件的使用频率高于全局组件.推荐使用驼峰写法也是和局部组件有关系我们先看一个示例<divid="app"><!--3.在注......
  • Nginx的Location匹配与Rewrite重写
    目录一.Nginx中location与rewrite1.Nginx中常用正则表达式2.location与rewrite的联系和区别二.location概述1.分类2.匹配规则3.优先级4.示例三.rewrite概述1.rewrite功能2.rewrite执行顺序3.跳转实现4.语法格式5.示例5.1.基于域名的跳转5.2.基于旧域名跳转到新......
  • Nginx Rewrite
    目录1.Nginx正则表达式2.location概述2.1 location匹配规则2.2location优先级3.rewrite概述4.rewrite实例操作4.1基于域名的跳转4.2基于客户端IP访问跳转4.3基于旧域名跳转到新域名后面加目录4.4基于参数匹配的跳转4.5基于目录下所有php结尾的文件跳转4.......
  • 【前端每日基础】day42——关于 Vuex 共有几个属性,哪里可以书写同步任务,哪里可以书写
    Vuex是Vue.js的一个状态管理模式,它集中式地存储和管理应用的所有组件的状态。Vuex提供了以下几个核心属性,每个属性在状态管理中有不同的用途:Vuex共有的几个属性:State:用于存储应用的状态。可以通过this.$store.state或在组件中通过mapState辅助函数访问。Gette......
  • 在vue项目中使用element-plus
    目录1.在构建的vue3项目中安装element-plus2.导入element-plus3.检验1.在构建的vue3项目中安装element-plusnpminstallelement-plus--save2.导入element-plus在src下的main.ts文件导入3.检验生效......
  • Vue渲染函数与JSX指南
    title:Vue渲染函数与JSX指南date:2024/6/3下午6:43:53updated:2024/6/3下午6:43:53categories:前端开发tags:Vue渲染JSX基础性能优化组件对比ReactJSX大项目测试策略第1章:Vue.js入门Vue.js的历史和背景Vue.js是一个用于构建用户界面的JavaScript框架,旨......
  • 从零手写实现 nginx-01-为什么不能有 java 版本的 nginx?
    前言大家好,我是老马。很高兴遇到你。作为一个java开发者,工作中一直在使用nginx。却发现一直停留在使用层面,无法深入理解。有一天我在想,为什么不能有一个java版本的nginx呢?一者是理解nginx的设计灵魂,再者java开发者用java语言的服务器不是更加自然吗。于是动手开......