ubuntu+Docker双容器docker-compose部署Django+Vue项目(2-Django)

news2024/12/23 9:19:39

文章目录

    • 部署Django后端接口
      • 下载Python环境及一些尝试
      • pip包管理
      • 运行项目容器
        • 报错1(查询容器IP解决)
        • 报错2(pvsite_uwsgi.ini文件配置socket还是http)
        • 报错3(用http先)
        • 用python manage.py runserver运行项目先
          • 报错4(下载cryptography库)
        • 回到用uwsgi+django运行成功先
        • 在uwsgi+django中加入nginx配置
    • 最终使用docker-compose双容器配置
      • 项目目录树
      • docker-compose.yml配置
      • 最终Django文件配置
        • requirements.txt文件配置
        • pvsite_uwsgi.ini文件配置
        • Django下的Dockerfile文件配置
      • 最终Vue文件配置
        • Vue下的Dockerfile文件配置
        • Vue下的nginx.conf文件配置
    • 其他笔记
    • 写在最后

部署Django后端接口

下载Python环境及一些尝试

由于项目用到是3.8.8版本,避免之后出现问题。就不下最新的了

docker pull python:3.8.8

请添加图片描述
以python镜像启动一个容器,参数以命令模式进入该容器:

docker run -it python /bin/bash

/bin/bash进入容器中的命令行,暂时我理解为进入之后用法和ubuntu中的终端一样。(毕竟一个容器相当于一个虚拟机[滑稽])
但是上面的命令的命令会默认运行最新的python版本,本地的旧版本都不行
运行指定版本镜像

docker run -it python:3.8.8 /bin/bash

请添加图片描述
后台运行
在大部分的场景下,我们希望 docker 的服务是在后台运行的,我们可以过 -d 指定容器的运行模式,--name给容器起名

docker run -itd  --name pythonTest python:3.8.8 /bin/bash  

在这里插入图片描述
进入容器
exec 命令适用于进入后台运行的容器

docker exec -it 容器ID /bin/bash

可以直接进入容器中下载Django,执行如下命令,第一次不行,第二次就好了

pip install django

pip包管理

在本地下载pip管理工具(可以下载其他工具试试,这里用pipreqs)

pip install pipreqs

下载完执行命令

pipreqs  --encoding=utf8  ./

导出文件到当前路径,后续可继续添加所需要的库
请添加图片描述
在这里插入图片描述

运行项目容器

先跑出项目容器

docker run -it -d --name Djangotest -p 9001:9001 -v /home/andy/Web/Django:/home/andy/Web/Django python:3.8.8
#-v /home/test:/home/test是将/home/test是将主机上的该目录挂载到容器内的home目录下(当然也可以使用docker cp命令)

其他解释见第一节

-v         用于挂载容器目录路径,内外共享目录,用法:-v 宿主机路径:容器路径

进入容器

docker exec -it Djangotest bash

然后安装requirements.txt中的库,执行完再安装uwsgi

pip install -r /home/andy/Web/Django/requirements.txt
pip install uwsgi

uwsgi运行项目

uwsgi  --ini  /home/andy/Web/Django/pvsite_uwsgi.ini 

报错1(查询容器IP解决)

在这里插入图片描述
应该pvsite_uwsgi.ini中的IP配置有问题
查看docker容器的IP

docker inspect 99ef4b98f188(该容器ID)

请添加图片描述
容器IP就是172.17.0.5
修改pvsite_uwsgi.ini配置如下

[uwsgi]

#chdir=/home/andy/Documents/photovoltaic/photovoltaicsite   # 指定运行目录:项目根目录的绝对路径

# 指定sock的文件路径,可以用端口或sock文件(Nginx监听的端口)
socket = 172.17.0.5:9001
# stats子系统允许您将uWSGI的内部统计数据导出为JSON, 在指定的地址上,开启状态服务
#stats = 127.0.0.1:9999
#载入wsgi-file
wsgi-file = photovoltaicsite/wsgi.py

#允许主进程存在(enable master process)
master=true
#设置最大工作进程数:将会生成4个进程, 每个进程有2个线程
processes=4
threads = 2
#某个权限
chmod-socket = 666  
#退出时清除环境  
vacuum=true  

再次运行

报错2(pvsite_uwsgi.ini文件配置socket还是http)

invalid request block size:21573 (max 4896) …skip

看样子能访问,但是uwsgi内部解析的数据包只能最大4k。
看样子给pvsite_uwsgi.ini文件增加一条这个就行。(后续结合nginx应该不会出现这种问题)

#设置用于uwsgi包解析的内部缓存区大小到64k。默认是4k。
buffer-size = 65536

在这里插入图片描述
加完之后继续运行

报错3(用http先)

uwsgi_proto_uwsgi_parser(): Resource temporarily unavailable [proto/uwsgi.c line 40]

这个报错目前不清楚是为什么,在docker中测试了很久。我是按照这个地址192.168.80.128:9001去访问的。而这个地址和端口是Django+uwsgi容器运行直接映射的端口。
知道为什么了,人都傻了。自己在pvsite_uwsgi.ini配置的socket = 172.17.0.5:9001。我部署的是socket不是http怎么能用浏览器去访问到了。要在nginx中去监听这个socket才能访问啊。socket改成http就可以了。

用python manage.py runserver运行项目先

运行到现在其实还没配置好数据库(直觉告诉我先python manage.py runserver运行成功,这些问题迎刃而解),先用python manage.py runserver启动项目。配置好数据库吧。

Django项目在settings.py中先改成连接另外一个ubuntu里的mysql试试
在这里插入图片描述

报错4(下载cryptography库)

出现了之前一样的问题。确实个package。

bash RuntimeError: 'cryptography' package is required for sha256_password or caching_sha2_password auth methods

按照下面下载之后就可以运行成功了。

 pip install cryptography

回到用uwsgi+django运行成功先

先收集Django后台的资源,运行如下命令,在当前路径下会生成static文件夹保存网页需要的静态资源。

python manage.py collectstatic

由于之前在Django中的settings配置过资源路径只需要pvsite_uwsgi.ini文件新增如下:

#加上读取静态资源路径(Django后台的css文件等,不然没样式)
static-map =/static=/home/andy/Web/Django/photovoltaicsite/static

访问Django后台成功了
请添加图片描述

在uwsgi+django中加入nginx配置

先将pvsite_uwsgi.ini配置的http= 172.17.0.5:9001。改成socket=容器IP:端口
加上-d后台运行uwsgi -d --ini /home/andy/Web/Django/pvsite_uwsgi.ini

然后运行nginx容器
这里我用的是-v挂载宿主机的目录和文件,所以有点长。(后面完善直接打包镜像用更好的方法) 。别忘了最后的nginx镜像

docker run -it -d --name Vuetest -p 8080:8080 -v /home/andy/Web/Vue/dist/:/usr/share/nginx/html/ -v /home/andy/Web/Vue/nginx.conf:/etc/nginx/nginx.conf  nginx

文件目录挂载

#-v /home/andy/Web/Vue/dist/:/usr/share/nginx/html/
#-v /home/andy/Web/Vue/nginx.conf:/etc/nginx/nginx.conf

这里已经要开启另外的nginx容器了。双容器运行的话要进行通信(像两个独立的虚拟机)。下面用到docker-compose

最终使用docker-compose双容器配置

项目目录树

/home/andy/web目录下的大致目录结构

Web:.
│  docker-compose.yml
├─Django
│  │  Dockerfile
│  │  uwsgi_params 
│  └─photovoltaicsite
│      │  manage.py
│      │  pvsite_uwsgi.ini
│      │  requirements.txt
│      ├─photovoltaiccalculation
│      │  │  admin.py
│      │  │  api.py
│      │  │  api_url.py
│      │  │  apps.py
│      │  │  models.py
│      │  │  modelToJson.py
│      │  │  tests.py
│      │  │  views.py
│      │  │  __init__.py
│      │  ├─migrations
│      │          
│      ├─photovoltaicsite
│      │  │  asgi.py
│      │  │  settings.py
│      │  │  urls.py
│      │  │  wsgi.py
│      │  │  __init__.py
│      │  └─__pycache__         
│      ├─static
│      │  ├─admin
│      │  │  ├─css            
│      │  │  ├─fonts    
│      │  │  ├─img          
│      │  │  └─js                 
│      │  └─rest_framework
│      │      ├─css      
│      │      ├─docs
│      │      │  ├─css    
│      │      │  ├─img  
│      │      │  └─js        
│      │      ├─fonts     
│      │      ├─img     
│      │      └─js
│      │              
│      └─upload
│          └─headImg
│                  20221027135148-4.png
│                  20221206021825-1.png
│                  
├─Mysql(这个项目我直接连接了另外一台虚拟机上的mysql)
└─Vue
    │  Dockerfile
    │  nginx.conf
    └─dist
        │  favicon.ico
        │  index.html  
        ├─css     
        ├─fonts     
        ├─img      
        └─js            

在windows下可以终端下用tree /f >tree.md生成目录树

docker-compose.yml配置

version: "3"

networks: # 自定义网络(默认桥接), 不使用links通信 
  #proxy:
    #ipam:
      #config:
      #- subnet: 172.16.0.0/24 #由于默认bridge桥接网络,重启容器后ip地址会改变.固定IP
  django_network:
    driver: bridge
  vue_nginx_network:
    driver: bridge

services:
  django:
    build: /home/andy/Web/Django # '.'代表当前目录
    #command: uwsgi  --ini  /home/andy/Web/Django/photovoltaicsite/pvsite_uwsgi.ini   # 容器启动后启动web服务器,执行多条指令用下面的
    command: bash -c 'python manage.py makemigrations&&python manage.py migrate&&uwsgi  --ini  /home/andy/Web/Django/photovoltaicsite/pvsite_uwsgi.ini'
    networks:
     - django_network
     #proxy:
      #ipv4_address: 172.17.0.5 #固定IP
    ports:       #暴露容器端口,与-p相同,但是端口不能低于60
      - "9090:9090"
    volumes:      #虚拟机挂载文件和目录到容器
      - /home/andy/Web/Django:/home/andy/Web/Django
    restart: always # always表容器运行发生错误时一直重启

  vue_nginx:
    build: /home/andy/Web/Vue
    ports:
      - "8080:8080"
      - "9001:9001"
    restart: always # always表容器运行发生错误时一直重启
    volumes:     #虚拟机挂载文件和目录到容器
      - /home/andy/Web/Vue/nginx.conf:/etc/nginx/nginx.conf
      - /home/andy/Web/Vue/dist/:/usr/share/nginx/html/
      - /home/andy/Web/Django:/home/andy/Web/Django
    networks:
      - vue_nginx_network
      - django_network #将vue_nginx_network加入到django的网络中
    depends_on: #此标签用于解决容器的依赖,启动先后问题。如启动应用容器,需要先启动数据库容器php:depends_on:- apache- mysql
      - django

最终Django文件配置

Django下的setttings.py配置就不展示了。网上其他教程容易搜到

requirements.txt文件配置

Django==4.1
djangorestframework==3.14.0
PyMySQL==1.0.2
django-cors-headers==3.13.0
uwsgi==2.0.21
cryptography==38.0.4

pvsite_uwsgi.ini文件配置

[uwsgi]

#chdir=/home/andy/Documents/photovoltaic/photovoltaicsite   # 指定运行目录:项目根目录的绝对路径

# 指定sock的文件路径,可以用端口或sock文件(Nginx监听的端口)
socket = 0.0.0.0:9090

# stats子系统允许您将uWSGI的内部统计数据导出为JSON, 在指定的地址上,开启状态服务
#stats = 127.0.0.1:9999
#载入wsgi-file
wsgi-file = photovoltaicsite/wsgi.py

#允许主进程存在(enable master process)
master=true
#设置最大工作进程数:将会生成4个进程, 每个进程有2个线程
processes=4
threads = 2
#某个权限
chmod-socket = 666  
#退出时清除环境  
vacuum=true  
#设置用于uwsgi包解析的内部缓存区大小到64k。默认是4k。
buffer-size = 65536

Django下的Dockerfile文件配置

# 建立  python:3.8.8 环境
FROM python:3.8.8
# 镜像作者andy
MAINTAINER andy
# 将项目文件拷贝到工作目录下(拷贝的主机内容,最好是相对路径)
COPY Django/ /home/andy/Web/Django
# 设置容器内工作目录
WORKDIR /home/andy/Web/Django/photovoltaicsite
# 在容器内安装django项目需要的库
RUN pip install -r /home/andy/Web/Django/photovoltaicsite/requirements.txt

最终Vue文件配置

dist文件是vue-cli中build项目得到的

Vue下的Dockerfile文件配置

# 设置基础镜像
FROM nginx
# 定义作者
MAINTAINER andy
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/  /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/nginx.conf
#-v dist/  /usr/share/nginx/html/
#-v /home/andy/Web/Vue/nginx.conf:/etc/nginx/nginx.conf

Vue下的nginx.conf文件配置

user www-data;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
	worker_connections 768;
}

http {
	sendfile on;
	tcp_nopush on;
	tcp_nodelay on;
	keepalive_timeout 65;
	types_hash_max_size 2048;
	include /etc/nginx/mime.types;
	default_type application/octet-stream;

	##
	# SSL Settings
	##

	ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
	ssl_prefer_server_ciphers on;

	##
	# Logging Settings
	##

	access_log /var/log/nginx/access.log;
	error_log /var/log/nginx/error.log;

	##
	# Gzip Settings
	##

	gzip on;
	#	Vue configuration
	server {
	listen   8080;     #配置访问时的端口号
	server_name  192.168.80.129;
	charset     utf-8;
	client_max_body_size  75M;  #影响post文件的最大大小

	location / {          #配置web静态资源
		root /usr/share/nginx/html/;
		index index.html;
		add_header 'Access-Control-Allow-Origin' '*';
		}
	}

#	uWSGi configuration
	upstream django {
	    server 192.168.80.129:9090; # for a web port socket (we'll use this first)
	}
	server {
	listen   9001;     #配置访问时的端口号
	server_name  192.168.80.129;
	charset     utf-8;
	client_max_body_size  75M;  #影响post文件的最大大小
	
	location /upload {        #配置媒体资源文件
		expires 30d;
		autoindex  on;
		add_header Cache-Control private;
		alias /home/andy/Web/Django/photovoltaicsite/upload;
		}
	location /static {      #配置静态资源文件
		expires 30d;
		autoindex on;
		add_header Cache-Control private;
		#alias /home/andy/Documents/photovoltaic/photovoltaiccalculation;
		alias /home/andy/Web/Django/photovoltaicsite/static;
	}
	location / {          #配置uWSGI服务器
		include /etc/nginx/uwsgi_params;
		uwsgi_pass django;
		uwsgi_read_timeout 2;

	}
	}
	include /etc/nginx/conf.d/*.conf;
	include /etc/nginx/sites-enabled/*;
}

请添加图片描述
最后能成功运行。

其他笔记

Linux中echo命令的功能是写内容到标准输出。

#echo hello world
hello world

给static文件夹及其子文件和子目录的所有权限(读写)给所有用户:(当前路径有static文件夹)

chmod -R 777 static

写在最后

由于初次使用Docker。这篇博客更像是个人的一个笔记(边做边记),可能写的不是很清晰。但是对ubuntu+Docker环境的部署还是会有一些参考价值。

在部署完后之后。对个人也有一些开发上的思考。比如在访问前端项目时,如果出现一些网络错误或是莫名其妙的短暂性的跨域(Django中已经设置过cors解决跨域了,不知道为什么会间歇性出现这个报错。但却不影响功能)导致访问不到资源,此时网站应该给出一个响应,类似返回一个自定义404页面或是500页面。

主要参考链接1
主要参考链接2
做完发现的一个比较完善的部署教程

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/65906.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

FT2004(D2000)开发实战之PBF配置

一 PBF概述 PBF英文全称Phytium Base Firmware,PBF主要作用: 初始化PLL设置CPU主频初始化DDR4初始化PCIe控制器初始化全局中断和定时器跳转到U-boot 飞腾FT2004芯片BIOS固件由两部分构成,PBF+U-boot或者PBF+UEFI,最终的BIOS烧写⽂件由PBF固件包中的脚本程序⽣成,当然在生…

为什么消费返利模式层出不穷?这个消费返利玩法值得你借鉴

大家好,我是林工,不知道大家听说过消费返利没有?消费返利是互联网常见的一个商业模式,是指互联网平台将自己所销售的商品和服务让渡给消费者并获得一定比例的报酬,消费者通过平台享受到的佣金和消费总额(金…

正则表达式简介

一、介绍 正则表达式(Regular Expression)是一种文本模式,包括普通字符(例如,a 到 z 之间的字母)和特殊字符(称为"元字符")。 正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字…

观察|数字营销正当时,企业如何玩转短视频?

​​双十二购物狂欢节即将来临,从手机APP的开屏广告到线下随处可见的广告屏,铺天盖地的短视频成为各大品牌宣传造势的重头戏。凭借具有强烈视觉冲击力的画面和魔性的配音配乐,短视频已然超越传统图文广告,迅速成长为占领受众心智的…

Java数据结构与Java算法学习Day05---二叉树(简略笔记记录)

目录 一、二叉树 79 1.1树的基本定义79 1.2数的相关术语 80 1.3二叉树的基本定义 81 1.4二叉查找树的创建 82 1.4.1二叉树查找树创建---插入方法(put) 83 1.4.2二叉树查找树创建---获取方法(get)84 1.4.3二叉树查找树创建…

大数据学习:进程管理(2)

文章目录一、系统资源监控1、free命令2、uname命令3、uptime命令4、netstat命令5、vmstat命令二、任务管理1、前台进程2、后台进程3、操作案例一、系统资源监控 1、free命令 观察内存(memory)使用情况 2、uname命令 查阅系统与核心相关信息 3、up…

JavaEE技术点:MySQL目录及基本命令介绍

1.MySQL目录介绍 (1)首先来看MySQL的安装目录,如图1-1所示: 图1-1 MySQL的安装目录 (2)图1-1中的bin目录中存放的是二进制的可执行文件,如图1-2所示: 图1-2 bin目录结构 (3)图1-2中的mysqld.exe是服务器程序,必须先…

山东:推进自然资源确权登记 助力自然资源保护发展

2019年,自然资源统一确权登记工作启动以来,山东省认真贯彻生态文明思想,坚决扛牢政治责任,按照国家统一部署,担当作为、加压奋进,在探索推进自然资源确权登记法治化、规范化、标准化、信息化等方面取得了积…

用亚马逊自养号进行测评的好处

自养号顾名思义就是自己用真实环境养出来的买家账号。通过真实的邮箱、手机号码和注册地当地真实收货地址,包括IP等等,但是也有很多卖家没有完全认清自养号的好处,下面就看看用亚马逊自养号进行测评的好处 对于卖家来说,使用自养号…

【超全面】机器学习中的超参优化方法总结

目录 1. 什么是超参数 2. 超参数类型 3. 主流超参优化方法 (1)手动调参 缺点: python代码:(例子) 手动调参 参数的重要性顺序 超参具体如何影响模型性能 超参合适的范围 (2)网格搜索 …

Web3中文|马斯克也疯狂?网红AI “ChatGPT”有多火?

一个名为“ChatGPT”的网红AI竟写出了毁灭人类的计划书。 计划书的步骤详细到入侵各国计算机系统、控制武器、破坏通讯、交通系统等等。和电影里的情节一模一样,甚至ChatGPT还给出了相应的Python代码。 诱导ChatGPT写下该计划的是一位名为扎克德纳姆(Z…

使用 Echarts 插件完成中国旅游地图

目录前言:什么是 Echarts 插件具体实现思路中国旅游地图成品展示步骤:完成中国旅游地图代码总结:前言: 大家都知道,一般情况下,想要使用前端设置一个 中国旅游地图 需要使用 canvas 画布进行编写&#xff…

尿苷二磷酸修饰阿拉伯糖,阿拉伯糖偶联核苷酸,UDP-B-L-阿拉伯糖二钠盐,15839-78-8

产品名称:尿苷二磷酸修饰阿拉伯糖,阿拉伯糖偶联核苷酸 英文名称:UDP-b-L-arabinopyranose disodium salt,UDP-L-Arabinose CAS号:15839-78-8 分子式:C14H22N2O16P2 分子量:536.27600 产地&am…

一种基于交叉选择的柯西反向鲸鱼优化算法QOWOA附matlab代码

✅作者简介:热爱科研的Matlab仿真开发者,修心和技术同步精进,matlab项目合作可私信。 🍎个人主页:Matlab科研工作室 🍊个人信条:格物致知。 更多Matlab仿真内容点击👇 智能优化算法 …

研究 | CT图像迭代重建算法研究进展

上次讲到我实现了一下代数迭代重建(ART),到周六开会的时候才大概了解了我的研究方向应该是统计迭代重建,一下子就把我给搞懵了。按照书上的说法,统计迭代法是在发射型CT(SPECT和PET)中应用广泛&…

WMS系统4.0,仓库管理的20年历史变局你知道吗?

20年之前,中国的仓储物流技术还处于起步阶段,很多时候都是从国外企业的经验中摸索出来的,而高端的技术,依然需要国外企业来完成。 20年过去了,中国庞大的应用场景、庞大的产业、庞大的物料、庞大的商业活动推动着中国的…

如何用Zabbix监控温湿度?Zabbix对接modbus tcp设备实操

背景: 1、公司机房没有专用的温度监控设备,以往是通过snmp功能get服务器的CPU或是主板温度,根据偏差值算出机房的大致温度(温度计值与服务器的差值),可最近研发部门经常在服务器跑高负载任务,导致计算出的环境温度极度…

实验7 数据库编程

第1关 定义一个名为PROC_COUNT的无参数存储过程 任务描述 定义一个名为PROC_COUNT的无参数存储过程,查询工程名称中含有“厂”字的工程数量,并调用该存储过程。 相关知识 1、工程项目表J由工程项目代码(JNO)、工程项目名(JNAME)、工程项目所在城市(CITY)…

计算机网络-网络层:IP协议

目录 一、IP协议格式 二、IP地址管理 1.动态地址分配&组建私网 1.1 动态地址分配DHCP 1.2 NAT技术组建私网 2. 早期网络划分方式 3. 当前网络划分方式CIDR方案 4. 特殊IP地址 5. 公网与私网(外网与内网) 6. 路由选择 网络层:负…

JavaScript Date对象中的常用方法有哪些?

JavaScript中的日期对象用来处理日期和时间。例如,秒杀活动中日期的实时显示、时钟效果、在线日历等。下面将对日期对象进行详细讲解。 日期对象的使用 JavaScript中的日期对象需要使用new Date()实例化对象才能使用,Date()是日期对象的构造函数。在创…