Django 实现图片上传和显示过程详解
作者:大牙啊 发布时间:2022-06-13 22:22:27
标签:django,图片,上传,显示
第1章 新建工程和创建app
新建工程和创建app就不用贴出来了,我这里是测试图片上传的功能能否实现,所以项目都是新的,正常在以有的app下就可以
第2章 模型层:
2.1创建数据库
from django.dbimport models
# Create your models here.
class User(models.Model):
name= models.CharField(max_length=50)
# upload_to 指定上传文件位置
# 这里指定存放在img/ 目录下
headimg = models.FileField(upload_to="img/")
# 返回名称
def__str__(self):
returnself.name
2.2初始化数据库:
(mypy3) ➜ BBS python manage.py makemigrations
Migrations for 'app01':
app01/migrations/0001_initial.py
- Create model User
(mypy3) ➜ BBS python manage.py migrate
Operations to perform:
Apply all migrations: admin, app01, auth, contenttypes, sessions
第3章 修改配置文件
3.1settings中增加如下配置:
MEDIA_ROOT= os.path.join(BASE_DIR, 'media').replace("\\", "/")
MEDIA_URL = '/media/'
3.2工程的urls文件:
from django.conf.urlsimport url
from django.contrib import admin
from django.urls import path, include
from django.conf.urls.static import static
from django.conf import settings
urlpatterns = [
url(r'^admin/', admin.site.urls),
# url(r'^regsiter/', views.regsiter),
# url(r'', TemplateView.as_view(template_name="app01/index.html")),
path('app01/', include('app01.urls'))
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
3.3app:
from django.urlsimport path
from . import views
app_name = 'app01'
urlpatterns = [
path('add/', views.add, name='add'),
# path('index/', views.index, name='index'),
]
3.4修改模版配置:
TEMPLATES= [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')],
'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',
],
},
},
]
第4章 数据校验模块:
数据需要校验的情况下,如果你不想校验,这个可以忽略
4.1在app下创建forms文件:
from django import forms
# 表单类用以生成表单
class AddForm(forms.Form):
name = forms.CharField()
headimg = forms.FileField()
第5章 视图层:
5.1编写图片处理逻辑
from django.shortcutsimport render
from .models import User
from .forms import AddForm
# Create your views here.
def add(request):
# 判断是否为post 方法提交
ifrequest.method == "POST":
af = AddForm(request.POST, request.FILES)
# 判断表单值是否和法
ifaf.is_valid():
name = af.cleaned_data['name']
headimg = af.cleaned_data['headimg']
user = User(name=name, headimg=headimg)
user.save()
returnrender(request, 'app01/index.html', context={"user":user})
else:
af = AddForm()
returnrender(request, 'app01/add.html', context={"af":af})
第6章 模版层:
上传的html
<!-- templates/users/add.html -->
<!doctype html>
<html>
<head>
<title>Add</title>
<meta charset="utf-8">
</head>
<body>
<h1>Add!</h1>
<form method="post" enctype="multipart/form-data" action="{% url'app01:add' %}">
{%csrf_token %}
{{ af.as_p }}
<inputtype="submit" value="OK"/>
</form>
</body>
</html>
查看的html
<!-- templates/users/index.html -->
<!doctype html>
<html>
<head>
<title>Detail</title>
<meta charset="utf-8">
</head>
<body>
<p>{{user.name}}</p>
<img width="50%" height="50%"src="/media/{{ user.headimg }}">
</body>
</html>
来源:https://blog.51cto.com/13520772/2411189


猜你喜欢
- 直接通过element-ui自带的上传组件结合js即可,代码如下:HTML: &l
- 目录项目介绍已有功能环境安装Windows用看这里ubuntu用户看这里使用方式:主要代码项目地址项目介绍可以下载doc,ppt,pdf.对
- 如果我们在标识列中插入值,例如:insert member(id,username) values(10,'admin')
- 实例如下:# -*- coding: utf-8 -*-"""Spyder EditorThis tempor
- Set objTextStream=FileSystemObject.CreateTextFile(Filename,[Overwrite]
- 图像梯度图像梯度计算的是图像变化的速度。对于图像的边缘部分,其灰度值变化较大,梯度值也较大;相反,对于图像中比较平滑的部分,其灰度值变化较小
- 1. 主要内容从本节开始介绍windows开发实现记事本程序的逻辑实现部分。本节的主要内容有以下3点:1. 主窗口定义 —— 主要介绍记事本
- 看了两天 go 语言,是时候练练手了。go 的 routine(例程) 和 chan(通道) 简直是神器,实现多线程(在 go 里准确的来说
- 1.了解oracle外部表 外部表定义:结构被存放在数据字典,而表数据被放在OS文件中的表 作用:在数据库中查询OS文件的数据,还可以将OS
- 适配器设计模式是懒得改动某些代码,或者某些接口不方便改动的时候,使用一个特定的封装,一些特定的编写办法,使不同的接口可以使用同种调用方式使用
- “点睛”的广告代码,很牛B,本想从中找出在FireFox下如何实现findText及pasteHTML类似效果的,我看了大半天,楞是没有看出
- 背景背景是这样的, 我的家里台式机常年 休眠, 并配置了 Wake On Lan (WOL) 方便远程唤醒并使用.但是我发现, 偶尔台式机会
- 1、打开一个记事本,将需要安装的第三方python依赖包写入文件,比如:需要安装urllib3、flask、bs4三个python库(替换成
- 本次薯片会讨论了关于分类与类型的问题。怎么找一个item?页面导航一般分类为主,在具体的分类展示下选择类型:典型例子:炫铃(QQ客户端)当只
- 在之前文章给大家分享后不久,就有位小伙伴跟小编说在用scrapy搭建python爬虫中出现错误了。一开始的时候小编也没有看出哪里有问题,好在
- 本文实例为大家分享了js实现微信聊天效果的具体代码,供大家参考,具体内容如下<!DOCTYPE html><html la
- 最近项目中需要与管易云erp做对接,看了他的接口文档,php的示例代码,于是用python仿写。其中传的参数data中前面几个json数据是
- 本文实例为大家分享了js实现幸运抽奖九宫格大转盘效果,供大家参考,具体内容如下实现代码:<!DOCTYPE html><h
- 小的本身是一个平面设计人员,前一阵儿有一些空闲的时间,便在各个站长网上发布了贴子,大意是免费制作logo,以换取网站连接(相信很多人都看过)
- 我们都知道有很多的非常著名的注册服务器,例如: Consul、ZooKeeper、etcd,甚至借助于redis完成服务注册发现。但是本篇文