django+vue项目阿里云服务器部署uwsgi+nginx

最新推荐文章于 2024-04-30 10:13:51 发布

小孩的小马甲

最新推荐文章于 2024-04-30 10:13:51 发布

阅读量680

点赞数 1

分类专栏：服务器文章标签： django nginx vue

本文链接：https://blog.csdn.net/weixin_45329799/article/details/120037864

版权

服务器专栏收录该内容

1 篇文章 0 订阅

订阅专栏

文章目录

服务器
django和vue代码部署
- 修改django的settings.py
uwsgi+nginx
- nginx
- uwsgi.ini
其他

服务器

试用产品

常见的云服务器有阿里云、百度云、腾讯云、华为云等，这里选择阿里云的试用产品，免费试用1个月。
服务器信息：阿里云、CentOS8.0 64位、1核2GB、4Mbps 带宽。
试用链接 https://free.aliyun.com/?spm=5176.21103406.J_6174043250.2.64e417190hC4e4
记录公网ip、开放安全组端口、设置密码。
8005端口是之后我要用到的，所以开放。22是远程连接端口，xshell连接用；443是https端口，80是http端口。

连接服务器

windows下使用Xshell连接服务器、Xftp把本地文件传输到服务器上。官网地址https://www.netsarang.com/zh/all-downloads/
下载安装参考教程https://blog.csdn.net/qq_44614026/article/details/108896217
文件传输也可以使用github或gitee。
- xshell连接到服务器后，yum install git
- 本地文件传到github或gitee仓库，在服务器上git clone xxx链接。
我都试过，还是xftp方便一些。
Mac / Linux: 在终端配置ssh进行连接。

服务器配置环境

先升级服务器所有包、软件和系统内核yum -y update
安装python环境 yum install -y python3
安装pip3 yum install -y python3-pip
安装虚拟环境 pip install virtualenv，便于服务器上多项目的管理。
- 创建虚拟环境，虚拟环境目录名自己起，我起的是su-venv，virtualenv su-venv
- 激活虚拟环境，source su-venv/bin/activate，激活后命令前面会出现(su-venv)
- 退出虚拟环境时试用deactivate，我们先不退。
在本地项目的根目录下试用命令pip freeze > requirements.txt把项目需要的库的清单输出到requirements.txt中，稍后我们安装在服务器虚拟环境下。

django和vue代码部署

关于本地django和vue代码的整合如果不清楚可以先看看这个https://cloud.tencent.com/developer/article/1576599

修改django的settings.py

下面是我的settings.py文件，直接粘上来，标注*****的地方是我认为很重要或者很有帮助的地方。

import os
from pathlib import Path

BASE_DIR = Path(__file__).resolve().parent.parent

SECRET_KEY = 'django-insecure-8m1d7!uuo3-z95m!n_d6)-iecn*kxq46n56fcs_ofny8=7tn^j'

# DEBUG = True

# ALLOWED_HOSTS = []
# ------------上线模式---BEGIN----------
DEBUG = False # 关闭调试模式 *****
ALLOWED_HOSTS = ['*'] # 允许的服务器，*代表全部允许 *****
# 上线模式下不会输出项目中print的信息和报错信息 
# 下面的代码使得相关信息可以输出到uwsgi的日志文件中
# 对解决一些500 Internet Server Error很有帮助 ******
LOGGING = {
    'version': 1,
    'disable_existing_loggers': False,
    'formatters': {
        'normal': {
            'format': '[%(asctime)s][%(levelname)s] %(message)s'
        }
    },
    'handlers': {
        'console': {
            'level': 'DEBUG',
            'filters': None,
            'class': 'logging.StreamHandler',
            'formatter': 'normal',
        },
    },
    'loggers': {
        'django': {
            'handlers': ['console'],
            'level': os.environ.get("DJANGO_LOG_LEVEL", "INFO"),
        },
    },
}

# 增加跨域忽略 ******
CORS_ORIGIN_ALLOW_ALL = True 
CORS_ALLOW_CREDENTIALS = True

INSTALLED_APPS = [
    'django.contrib.admin',  # 内置的后台管理系统
    'django.contrib.auth',  # 内置的用户认证系统
    'django.contrib.contenttypes',  # 记录项目中所有model元数据
    'django.contrib.sessions',  # session会话功能
    'django.contrib.messages',  # 消息提示功能
    'django.contrib.staticfiles',  # 查找静态资源路径
    'corsheaders', # 跨域设置 *****
    'question',
    'user',
    'answer'
]

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware', # 跨域设置，注意位置！
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'Qnaire.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        # 'DIRS': [],
        'DIRS': ['front/dist'], # 这里是vue打包后的文件所在的目录
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'Qnaire.wsgi.application'
# 数据库可以mysql也可以用自带的sqlite3
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': BASE_DIR / 'db.sqlite3',
    }
}
# 用mysql的话要在服务器上装msql，并创建一个数据库，比如qnaire
# DATABASES = {
#     'default': {
#         'ENGINE': 'django.db.backends.mysql',
#         'NAME': 'qnaire',
#         'USER': 'root',
#         'PASSWORD': '123456',
#         'HOST': 'localhost',
#         'PORT': '3306',
#     }
# }

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]

LANGUAGE_CODE = 'zh-Hans'
TIME_ZONE = 'Asia/Shanghai'

USE_I18N = True

USE_L10N = True

USE_TZ = True

# 对外提供WEB访问时static的URL地址
STATIC_URL = '/static/'  # *****

# STATICFILES_DIRS用来配置一些开发环境下生成的静态文件的地址，即编译好的VUE_STATIC_DIR
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'front/dist/static') # *****
]

# STATIC_ROOT设置绝对路径, 用来保存收集到的静态文件，服务器最终也将从该路径中获取文件进行转发。
# 在collectstatic运行的时候会把STATICFILES_DIRS中的静态文件拷贝到这个目录中,达到从开发环境到生产环节过程中移植静态文件的作用。
STATIC_ROOT = os.path.join(BASE_DIR, 'static/') # ******


DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'

# 设定文件的访问路径，如：访问http://127.0.0.1:8000/media/就可以获取文件
MEDIA_URL = '/media/'

# 设置文件的存储路径，全部存储在media目录下，会和model类中的upload_to属性值拼接
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

本地对代码做出修改后，要在本地试运行一下，无误后再把项目通过xftp传进服务器。
刚刚我们把DEBUG模式关闭进入生产环境，本地运行需要先使用python manage.py collectstatic将STATICFILES_DIRS中的静态文件移植到STATIC_ROOT下。
如果一切都没有问题，就可以利用xftp将文件拖入服务器。
刚刚我们已经用pip freeze > requirements.txt在项目的根目录下生成了 requirements.txt文件，项目传进服务器后，在进入项目根目录下，还是在虚拟环境下使用pip install -r requirements.txt命令安装项目所需的库。
如果我们项目使用的是django自带的数据库的话，需要对数据库开启读写权限，我的项目名是Qnaire，Qnaire文件夹下有一个db.sqlite3，要对数据库db.sqlite3用chmod 777 db.sqlite3开启权限，同时用chmod 777 Qnaire对Qnaire文件夹开启权限，不然之后运行会报错说写不进去。如果是mysql就不用了，记得服务器上创建数据库就好。

uwsgi+nginx

nginx服务器接收到http请求，若是静态资源请求会找到文件直接返回（效率极高），若是动态资源请求就转发给uwsgi服务器，uwsgi服务器运行django代码并将响应返回给nginx，nginx再返回给用户。

nginx

安装nginxyum install nginx
nginx.conf配置文件，放在目录/home/summerConf/下，这个summerConf是我自己定义的文件夹，打算把nginx的配置文件、日志文件和uwsgi的日志文件、进程文件都放在这里。

server {
    listen 80; # 80是http默认端口，443是https默认端口
    server_name 39.102.116.12;  # 这里云服务器公网ip或者域名 
    charset utf-8;

    access_log /home/summerConf/nginx.access.log; # 自己定义的nginx日志文件放哪里
    error_log /home/summerConf/nginx.error.log; 

    client_max_body_size 75M; # 上传文件大小限制
    
    # 静态文件交给给nginx处理，这个static文件夹是我们前面项目里的STATIC_ROOT配置之后collectstatic生成的static文件夹。
    # 如果访问http://ip地址/static/xxx，nginx就会去这个文件夹下找到文件返回。
    
    location /static {
	    alias /home/summer/Qnaire/static; 
    }
    
	# 动态请求pass给uwsgi服务器，8005端口是我们之前云服务器安全组开放过的，在这里用到了。
	# 意思是把请求传递给本机的8005端口处理，include会启动uwsgi的参数配置。
	# 这个文件和nginx默认配置文件nginx.conf在同一个目录下，可以去看看，它是nginx和uwsgi通信协议相关配置。
    
    location / {
        uwsgi_pass 127.0.0.1:8005;  
        include /etc/nginx/uwsgi_params;
    }
}

我们前面安装好nginx之后，如果跟我一样都是centos系统，应该可以在/etc/nginx/文件夹下找到默认的配置文件nginx.conf和文件夹conf.d。
把我们的配置文件/home/summerConf/nginx.conf建立软连接到/etc/nginx/conf.d/summer.conf下面，软连接后的名字自己起就好，目录正确即可。
ln -s /home/summerConf/nginx.conf /etc/nginx/conf.d/summer.conf。
然后更改nginx的默认配置文件vim /etc/nginx/nginx.conf，user那里默认是nginx我改成了root，（其实有人建议生产环境 nginx 最好不要运行在 root 上，安全性不好，只设置下文件夹权限，让nginx 运行用户可以访问即可，我第一次追求低了…）然后把我们的配置文件软连接include进去。
用nginx -t来测试是否成功，主要检查语法问题。
nginx相关的的一些命令在这里，

yum install nginx #安装nginx
nginx #启动服务
----------------------------------------
systemctl status nginx.service #查看nginx状态
systemctl stop nginx.service #停止
systemctl start nginx.service #开启
nginx -s reload #重载
killall nginx # 杀死所有nginx，这个我没用过不晓得可不可
------------------------
netstat -anp |grep 80 #查看80端口占用情况

uwsgi.ini

放在项目根目录下面 /home/summer/Qnaire/

[uwsgi]
# 项目根目录
chdir = /home/summer/Qnaire
# 虚拟环境目录
home = /home/project/su-venv  
# 项目的application
module = Qnaire.wsgi:application  

# 启用主进程
master = True
# 进程个数
processes = 4
# 设置自动中断时间
harakiri = 60
# 
max-requests = 5000


socket = 127.0.0.1:8005  # 这个端口号和前面nginx.conf里的要匹配
# 启动uwsgi的用户名和用户组
uid = 1000
gid = 2000

 # uwsgi进程文件
pidfile = /home/summerConf/uwsgi.pid  
 # uwsgi日志文件，我们setting.py中配置了报错信息输出，在这个文件里可以查看相关信息
daemonize = /home/summerConf/uwsgi.log 

# 服务停止时自动移除unix socket和pid文件
vacuum = True

uwsgi的一些命令

ps aux | grep uwsgi # 查看uwsgi服务状态
uwsgi --ini uwsgi.ini # 开启uwsgi服务
uwsgi --stop /home/summerConf/uwsgi.pid  # 停止服务
uwsgi --reload /home/summerConf/uwsgi.pid # 重新加载uwsgi服务

cat  /home/summerConf/uwsgi.log   # 查看uswgi日志文件
tail -20 /home/summerConf/uwsgi.log  # 查看uwsgi日志文件的后20行

其他

之后启动nginx和uwsgi服务，就可以成功访问你的ip了。如果出现500错误就去tail -20 /home/summerConf/uwsgi.log查看哪里有问题。如果4xx报错，可能是你的静态文件更新了没有python manage.py collectstatic
更新代码，比如我本地对vue代码变了，就重新打包vue项目，把dist文件夹拖到服务器里项目根目录/font/dist（就是settings.py的TEMPLATES里设置的的DIRS）下覆盖，然后服务器上重新python manage.py collectstatic，再把uwsgi服务重新加载一下。
如果django的views.py或者urlsl.py改变了，重新加载uwsgi即可。
如果前面都好了，还是报错，可能是服务器防火墙开着，或者用到的端口号没开之类的，要是你代码有问题，看uwsgi的日志文件的报错信息。我前些天第一次部署真的被报错搞得心态爆炸，归根结底就这几点了，有问题再看吧。
路漫漫其修远兮，吾将上下而求索！

小孩的小马甲

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
django+vue项目阿里云服务器部署uwsgi+nginx

服务器试用产品常见的云服务器有阿里云、百度云、腾讯云、华为云等，这里选择阿里云的试用产品，免费试用1个月。服务器信息：阿里云、CentOS8.0 64位、1核2GB、4Mbps 带宽。试用链接 https://free.aliyun.com/?spm=5176.21103406.J_6174043250.2.64e417190hC4e4记录公网ip、开放安全组端口、设置密码。8005端口是之后我要用到的，所以开放。22是远程连接端口，xshell连接用；443是https端口，80是htt
复制链接

扫一扫