Django静态文件媒体文件文件上传

文章目录

  • 一、静态文件和媒体文件
    • 1.在django中使用静态文件
    • 实践
    • 2.在django中使用媒体文件
  • 二、文件上传
    • 单文件上传
    • 实践
    • 多文件上传


一、静态文件和媒体文件

媒体文件: 用户上传的文件,叫做media
静态文件:存放在服务器的css,js,image,font等 叫做static

1.在django中使用静态文件

1)首先确保django.contrib.staticfiles在 INSTALLED_APPS中
2)在settings中定义STATIC_URLSTATIC_URL = '/static/'
3)在你app的static目录中存放静态文件,比如App/static/example.jpg
4)如果有别的静态资源文件,不在app下的static目录下,可以通过STATICFILES_DIRS来指定额外的静态文件搜索目录。STATICFILES_DIRS = [os.path.join(BASE_DIR, "static"),...]
5)在模板中使用load标签去加载静态文件{% load static %}<img src="{% static "App/example.jpg" %}" />

实践

创建一个新项目 Day06DjangoPro01

在这里插入图片描述

每一个应用中都可以新建一个static和templates

在这里插入图片描述

如果想要额外再加一些静态文件路径,就再加一个STATICFILES_DIRS
在这里插入图片描述

App\templates\index.html
一般用<link rel="stylesheet" href="{% static 'css/index.css' %}">

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>使用静态文件</title>{% load static %}
{#    <link rel="stylesheet" href="/static/css/index.css">#}<link rel="stylesheet" href="{% static 'css/index.css' %}"></head>
<body>
<h2>使用静态文件</h2>
<hr></body>
</html>

App\static\css\index.css

h2 {color: #7FFF00FF;
}

根路由Day06DjangoPro01\urls.py

from django.contrib import admin
from django.urls import path
from App.views import *urlpatterns = [path('admin/', admin.site.urls),path('index/', index),
]

App\views.py

from django.shortcuts import render# 静态文件的使用
def index(request):return render(request, 'index.html')

在这里插入图片描述

在项目根目录下的static和templates 也是可以这样用的

2.在django中使用媒体文件

在settings中配置	MEDIA_ROOTMEDIA_ROOT = os.path.join(BASE_DIR, "media")

二、文件上传

单文件上传

文件上传要求form表单存在enctype="multipart/form-data"属性,并且提交方法是post。<form enctype="multipart/form-data" action="/uploadFile/" method="post"><input type="file"name="myfile" /><br/><input type="submit" value="upload"/></form>最简单的文件上传:
def file_upload(request):if request.method =='POST':# 获取上传的文件,如果没有文件,则默认为NonemyFile = request.FILES.get( 'myfile'None)if not myFile:return HttpResponse("no files for upload")file_path = os.path.join(settings.MEDIA_ROOT, '1.jpg')with open(file_path, 'ab') as fp:for part in myFile.chunks():fp.write(part)return HttpResponse("上传成功!")else:return render(request,'index.html')

实践

在settings中配置 MEDIA_ROOT

# 媒体文件
MEDIA_ROOT = BASE_DIR / 'static/upload'

在这里插入图片描述

templates\upload1.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><h2>单文件上传</h2><form action="" enctype="multipart/form-data" method="post">{% csrf_token %}用户名:<input type="text" name="username"><br>头像:<input type="file"name="icon" /><br/><button>上传图片</button></form>
</body>
</html>

App\models.py

from django.db import models# 用户
class UserModel(models.Model):# 名字name = models.CharField(max_length=30, unique=True)# 头像icon = models.CharField(max_length=255)

写完之后记得做迁移

生成迁移文件: python manage.py makemigrations
执行迁移: python manage.py migrate

App\views.py

import os
import uuidfrom django.conf import settingsfrom django.shortcuts import render# 上传文件:媒体文件
# 单文件上传
from App.models import UserModeldef upload1(request):if request.method == 'GET':return render(request, 'upload1.html')elif request.method == 'POST':# 单文件上传username = request.POST.get('username')icon = request.FILES.get('icon')  # 只有一个文件用get()print(icon, type(icon))  # 文件对象# picture3.jpg   <class 'django.core.files.uploadedfile.TemporaryUploadedFile'>print(icon.name)  # picture3.jpg# 1. 将上传的图片存储到后端对应的媒体文件夹中# file_name = icon.name  # 图片名称尽量不要使用原图名称# file_name = gen_uuid_name() + icon.name[icon.name.rfind('.'):]  # icon.name.rfind('.') 获得最后一个.的下标, 拿到的是 .jpgfile_name = gen_uuid_name() + os.path.splitext(icon.name)[-1]  # os.path.splitext得到的是一个数组,取最后一个, 拿到的是 .jpg# 后面可以加个时间戳file_path = os.path.join(settings.MEDIA_ROOT, file_name)  # settings.py 设置的文件路径 MEDIA_ROOTprint('file_path', file_path)  # D:\xxx\pythonCode\Django学习\code\Day06DjangoPro01\static\upload\picture3.jpg# 分段写入文件with open(file_path, 'ab') as fp:  # ab 追加写的方式for part in icon.chunks():  # icon.chunks()方法 会一段一段的取,直到你取完为止,考虑到上传视频很大的话,一次性取会占很大一块内存,所以分段取fp.write(part)fp.flush()  # 写一段,清空一次缓存# 如果要把用户的图片存起来,不是直接把图片的二进制存起来,虽然可以存二进制,但是我们一般不存二进制# 2. 存到本地。将该媒体文件的路径 存入到数据库中。因为图片视频的二进制都比较大,如果存二进制到数据库会很大user = UserModel()user.name = usernameuser.icon = 'upload/' + file_nameuser.save()  # 保存return render(request, 'upload1.html')# 得到一个图片名称(通过uuid来得到唯一的图片名称)
def gen_uuid_name():return str(uuid.uuid4())  # 它会根据我们的时间还有随机数之类的东西去生成唯一的字符串

urls.py

# 上传文件
path('upload1/', upload1),

浏览器http://127.0.0.1:8000/upload1/
在这里插入图片描述
在这里插入图片描述
可以看到上传成功啦!!!

多文件上传

App\models.py

# 相册
class PhotoModel(models.Model):img = models.CharField(max_length=255)  # 图片地址# 图片所属用户user = models.ForeignKey(UserModel, on_delete=models.PROTECT)  # 每一个照片只属于一个用户,一对多关系

写完之后记得做迁移

生成迁移文件: python manage.py makemigrations
执行迁移: python manage.py migrate

templates\upload2.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<h2>多文件上传</h2>{#  enctype="multipart/form-data"  : 支持文件上传  #}{#  multiple: 支持文件多选  #}<form action="" enctype="multipart/form-data" method="post">{% csrf_token %}用户id<input type="text" name="userid"><br>请选择要上传的照片:<input type="file" name="imgs" multiple /><br/><button>上传图片</button></form>
</body>
</html>

App\views.py

import os
import uuidfrom django.conf import settingsfrom django.shortcuts import render
from App.models import *# 多文件上传
def upload2(request):if request.method == 'GET':return render(request, 'upload2.html')elif request.method == 'POST':userid = request.POST.get('userid')imgs = request.FILES.getlist('imgs')print('imgs: ', imgs)#  [<TemporaryUploadedFile: picture2.jpg (image/jpeg)>,#  <TemporaryUploadedFile: picture3.jpg (image/jpeg)>,...]for img in imgs:# 1. 把图片存储到uploads中file_name = gen_uuid_name() + os.path.splitext(img.name)[-1]file_path = os.path.join(settings.MEDIA_ROOT, file_name)  # 得到一个绝对文件路径with open(file_path, 'ab') as fp:for part in img.chunks():fp.write(part)fp.flush()#  2. 将图片路径存入到数据库中photo = PhotoModel()photo.img = 'uploads/' + file_namephoto.user_id = userid  # photo.user = UserModel.objects.filter(pk=userid).first()# 没查到就是None,暂时不考虑其他问题Nonephoto.save()return render(request, 'upload2.html')

urls.py

path('upload2/', upload2),  # 多文件上传

浏览器 http://127.0.0.1:8000/upload2/

在这里插入图片描述

在这里插入图片描述

可以看到,图片保存成功啦,数据也存到数据库啦

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

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

相关文章

【Locomotor运动模块】瞬移

文章目录 一、原理二、两种类型1、Instant(立刻)2、Dash&#xff08;猛冲&#xff09; 三、瞬移区域、瞬移点1、瞬移区域2、瞬移点 一、原理 抛物线指针选择好目标位置&#xff0c;然后告诉瞬移预设体&#xff1a;你想法把游戏区域弄到目标位置来 解释&#xff1a;抛物线指针选…

JS中的new操作符

文章目录 JS中的new操作符一、什么是new&#xff1f;二、new经历了什么过程&#xff1f;三、new的过程分析四、总结 JS中的new操作符 参考&#xff1a;https://www.cnblogs.com/buildnewhomeland/p/12797537.html 一、什么是new&#xff1f; 在JS中&#xff0c;new的作用是通过…

React笔记(八)Redux

一、安装和配置 React 官方并没有提供对应的状态机插件&#xff0c;因此&#xff0c;我们需要下载第三方的状态机插件 —— Redux。 1、下载Redux 在终端中定位到项目根目录&#xff0c;然后执行以下命令下载 Redux npm i redux 2、创建配置文件 在 React 中&#xff0c;…

FreeRTOS的信号量和互斥量之间的区别和联系

文章目录 信号量信号量简介信号量特征 互斥量互斥量的上锁机制互斥量的优先级继承机制 二值信号量和互斥量的作用二值信号量的作用互斥量的作用 二值信号量和互斥锁关系相同点不同点 如何根据场景选择回答信号量和互斥锁之间的区别&#xff1a; 信号量 信号量简介 队列(queue)…

大集合按照指定长度进行分割成多个小集合,用于批量多次处理数据

&#x1f4da;目录 拆分案例拆分的核心代码 通常我们对集合的更新或者保存都需要用集合来承载通过插入的效率&#xff0c;但是这个会遇到一个问题就是你不知道那天那个集合的数量可能就超了&#xff0c;虽然我们连接数据库进行批量提交会在配置上配置allowMultiQueriestrue,但是…

类和对象(下)

&#x1f493;博主个人主页:不是笨小孩&#x1f440; ⏩专栏分类:数据结构与算法&#x1f440; C&#x1f440; 刷题专栏&#x1f440; C语言&#x1f440; &#x1f69a;代码仓库:笨小孩的代码库&#x1f440; ⏩社区&#xff1a;不是笨小孩&#x1f440; &#x1f339;欢迎大…

【uniapp】 实现公共弹窗的封装以及调用

图例&#xff1a;红框区域为 “ 内容区域 ” 一、组件 <!-- 弹窗组件 --> <template> <view class"add_popup" v-if"person.isShowPopup"><view class"popup_cont" :style"{width:props.width&&props.width&…

mybatis源码学习-1-调试环境

写在前面,这里会有很多借鉴的内容,有以下三个原因 本博客只是作为本人学习记录并用以分享,并不是专业的技术型博客笔者是位刚刚开始尝试阅读源码的人,对源码的阅读流程乃至整体架构并不熟悉,观看他人博客可以帮助我快速入门如果只是笔者自己观看,难免会有很多弄不懂乃至理解错误…

Spring源码解析-总览

1、前言 Spring源码一直贯穿我们Java的开发中&#xff0c;只要你是一个Java开发人员就一定知道Spring全家桶。Spring全家桶为我们一共一站式服务&#xff0c;IOC、AOP更是Spring显著特性。但是Spring到底怎么为我们提供容器&#xff0c;管理资源的呢&#xff1f;下来&#xff0…

Ubuntu学习---跟着绍发学linux课程记录(第二部分)

文章目录 7 文件权限7.1 文件的权限7.2 修改文件权限7.3 修改文件的属主 8、可执行脚本8.2Shell脚本8.3python脚本的创建 9Shell9.1Shell中的变量9.2 环境变量9.3用户环境变量 学习链接: Ubuntu 21.04乌班图 Linux使用教程_60集Linux课程 所有资料在 http://afanihao.cn/java …

学生管理系统VueAjax版本

学生管理系统VueAjax版本 使用Vue和Ajax对原有学生管理系统进行优化 1.准备工作 创建AjaxResult类&#xff0c;对Ajax回传的信息封装在对象中 package com.grg.Result;/*** Author Grg* Date 2023/8/30 8:51* PackageName:com.grg.Result* ClassName: AjaxResult* Descript…

Java抛出异常

当某个方法抛出了异常时&#xff0c;如果当前方法没有捕获异常&#xff0c;异常就会被抛到上层调用方法&#xff0c;直到遇到某个try ... catch被捕获为止 调用printStackTrace()可以打印异常的传播栈&#xff0c;对于调试非常有用&#xff1b;捕获异常并再次抛出新的异常时&am…

项目-IM

tim-server tim-server启动类实现CommandLineRunner接口&#xff0c;重写run()方法 run()方法开启一个线程&#xff0c;创建zk持久父节点&#xff0c;创建临时顺序子节点&#xff0c;将netty-server信息写入 1.1 用户登录 1.2 gateway向认证授权中心请求token 1.3 从zookee…

在windows上安装Cmake软件

Cmake是一个跨语言、跨平台、开源的编译工具&#xff0c;可以编译C、C、Note.js、JavaScript、C#、Java、Python、Php、Object-C、Ruby等工程&#xff0c;需要设置对应的src源码目录、ext第三方依赖目录、CMakeList.txt构建列表&#xff0c;再使用cmake命令即可。     2023年…

程序员自由创业周记#2:前期准备

感恩 上次公开了创业的决定后&#xff0c;得到了很多亲朋好友和陌生朋友的鼓励或支持&#xff0c;以不同的形式&#xff0c;感动之情溢于言表。这些都会记在心里&#xff0c;大恩不言谢~ 创业方向 笔者是一名资质平平的iOS开发程序猿&#xff0c;创业项目也就是开发App卖&am…

Jmeter(二十九):Jmeter常用场景梳理

一、每秒钟固定调用次数 如果想控制每秒发送请求数量,仅仅通过线程数与循环次数是不够的,因为这只能控制发送总数,而要控制每秒发送数量,需要线程数与常数吞吐量控制器的搭配使用,这种场景在性能测试中使用不多。 例如每秒钟调用30次接口,那么把线程数设置为30,将常数…

Netty-ChannelPipeline

EventLoop可以说是 Netty 的调度中心&#xff0c;负责监听多种事件类型&#xff1a;I/O 事件、信号事件、定时事件等&#xff0c;然而实际的业务处理逻辑则是由 ChannelPipeline 中所定义的 ChannelHandler 完成的&#xff0c;ChannelPipeline 和 ChannelHandler应用开发的过程…

C语言(第三十三天)

3.1.2 画图推演 3.2 举例2&#xff1a;顺序打印一个整数的每一位 输入一个整数m&#xff0c;打印这个按照顺序打印整数的每一位。 比如&#xff1a; 输入&#xff1a;1234 输出&#xff1a;1 2 3 4 输入&#xff1a;520 输出&#xff1a;5 2 0 3.2.1 分析和代码实现 这个题目&a…

数据结构--队列与循环队列

队列 队列是什么&#xff0c;先联想一下队&#xff0c;排队先来的人排前面先出&#xff0c;后来的人排后面后出&#xff1b;队列的性质也一样&#xff0c;先进队列的数据先出&#xff0c;后进队列的后出&#xff1b;就像图一的样子&#xff1a; 图1 如图1&#xff0c;1号元素是…

本地开机启动jar

1&#xff1a;首先有个可运行的jar包 本地以ruiyi代码为例打包 2&#xff1a;编写bat命令---命名为.bat即可 echo off java -jar D:\everyDay\test\RuoYi\target\RuoYi.jar 3&#xff1a;设置为开机自启动启动 快捷键winr----输入shell:startup---打开启动文档夹 把bat文件复…