首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

上传的图片未在Django中保存和显示

在Django中,要实现上传图片并在网页中保存和显示,可以按照以下步骤进行操作:

  1. 在Django项目中的settings.py文件中,确保已经配置了正确的静态文件和媒体文件路径。例如:
代码语言:txt
复制
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
  1. 在Django的urls.py文件中,添加对媒体文件的URL映射。例如:
代码语言:txt
复制
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # 其他URL配置
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  1. 在Django的models.py文件中,创建一个模型来存储上传的图片。例如:
代码语言:txt
复制
from django.db import models

class MyImage(models.Model):
    image = models.ImageField(upload_to='images/')
  1. 运行Django的数据库迁移命令,创建该模型对应的数据库表:
代码语言:txt
复制
python manage.py makemigrations
python manage.py migrate
  1. 在Django的forms.py文件中,创建一个表单用于上传图片。例如:
代码语言:txt
复制
from django import forms
from .models import MyImage

class MyImageForm(forms.ModelForm):
    class Meta:
        model = MyImage
        fields = ('image',)
  1. 在Django的views.py文件中,编写处理图片上传和显示的视图函数。例如:
代码语言:txt
复制
from django.shortcuts import render, redirect
from .forms import MyImageForm

def upload_image(request):
    if request.method == 'POST':
        form = MyImageForm(request.POST, request.FILES)
        if form.is_valid():
            form.save()
            return redirect('image_list')
    else:
        form = MyImageForm()
    return render(request, 'upload_image.html', {'form': form})

def image_list(request):
    images = MyImage.objects.all()
    return render(request, 'image_list.html', {'images': images})
  1. 在Django的templates文件夹中,创建upload_image.html和image_list.html两个模板文件,分别用于显示图片上传表单和图片列表。

upload_image.html模板文件示例:

代码语言:txt
复制
<form method="post" enctype="multipart/form-data">
  {% csrf_token %}
  {{ form.as_p }}
  <button type="submit">上传图片</button>
</form>

image_list.html模板文件示例:

代码语言:txt
复制
{% for image in images %}
  <img src="{{ image.image.url }}" alt="Image">
{% endfor %}

通过以上步骤,你可以在Django中实现上传图片并在网页中保存和显示。在这个过程中,使用了Django的模型、表单、视图函数和模板等功能来处理图片的上传和展示。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Django 中图片的上传及显示

在 Django 中,上传文件不同于普通服务器的上传方法,在普通服务器中只需要使用一个 Controller 来控制文件的上传即可完成,但是在 Django 中,则需要额外使用数据库资源来存储文件。...本文将说明如何使用 Django 接收、保存并且返回图片。...,而是 Django 将会自动将文件上传到你设置的位置,并且把上传之后的图片 path 存入数据库,这样你只需要访问数据库中的 path 即可访问到图片。.../media/img 文件夹中,在上传完成之后,img 将会保存图片的 path。...path('file/image_upload', views.file__image_upload) ] 上传图片和访问图片 完成这些后,你只需要在前端需要上传图片的地方将 url 指向这个地址,就能将图片成功上传

3.4K20
  • Django实现图片上传并前端页面显示

    Django实现图片上传和图片显示 ---- 开始之前我们先确认环境中已经安装了Pillow,如果没有安装,可以通过pip install Pillow来安装,这个是python的图像处理库 数据库设置...', 'django.contrib.messages', 'django.contrib.staticfiles', 'app01', ] 数据库中建立保存图片的表 from...是指定图片存储的文件夹名称,上传文件之后会自动创建 执行命令做数据迁移,在执行迁移文件在数据库中创建表。...只需要在最后的静态文件区加上下面两行代码 TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates...验证前端图片访问 我们先去数据库表看一下对应的url路径 3333 ? 我们可以先用IP:Port/static/icon路径访问看下能不能直接加载图片 ? ?

    2.6K50

    Django 2.1.7 自定义form表单中上传图片、显示图片

    Django 2.1.7 Admin管理后台文章 Django 2.1.7 Admin管理后台 - 注册模型、自定义显示列表字段 Django 2.1.7 Admin - 列表页选项 Django...2.1.7 Admin - 编辑页选项 Django 2.1.7 Admin - 重写模板,自定义后台 Django 2.1.7 上传图片 - Admin后台管理 自定义form表单中上传图片 上一篇章...Django 2.1.7 上传图片 - Admin后台管理说明了使用admin后台上传图片,本篇继续来看看如何自定义上传图片。...在模板中定义上传表单,要求如下: form的属性enctype="multipart/form-data" form的method为post input的类型为file 图片上传目录如下图: 这里只是完成图片上传的代码,如果需要保存数据到表中需要创建PicTest对象完成保存。

    2.7K20

    Django 上传图片和Admin站点5.2

    上传图片 当Django在处理文件上传的时候,文件数据被保存在request.FILES FILES中的每个键为中的name 注意:FILES只有在请求的方法为...注意:如果属性类型为ImageField需要安装包Pilow pip install Pillow==3.4.1 图片存储路径 在项目根目录下创建media文件夹 图片上传后,会被保存到“/static...,默认Admin被启用 1.创建管理员的用户名和密码 python manage.py createsuperuser 然后按提示填写用户名、邮箱、密码 2.在应用内admin.py文件完成注册,就可以在后台管理中维护模型的数据...项中加入django.contrib.admin,Django就会自动搜索每个应用的admin模块并将其导入 ModelAdmin对象 ModelAdmin类是模型在Admin界面中的表示形式 定义:定义一个类...True actions_on_bottom = True list_display 出现列表中显示的字段 列表类型 在列表中,可以是字段名称,也可以是方法名称,但是方法名称默认不能排序 在方法中可以使用

    47930

    实现简单的分片上传和图片处理,解决了大图片上传和显示问题

    实现简单的分片上传和图片处理,解决了大图片上传和显示问题 一、概述 当图片较小时,上传时间很快,而且可以直接显示原像素。...如果我们的图片达到几兆时,我就不说几个G了,我是为了模拟分片上传,并顺便解决我的垃圾服务器的上传速度慢问题。...每次执行完前端进度和后端返回进度只要大于99.9%就算完成,调用后端的结束接口,完成上传并校验。 2.1 表与实体 我用一张表来存储上传的图片记录,并配合实现分片上传,也可以用配置文件这种形式。...在这里插入图片描述 点击上传,弹出modalUploadProcess窗口,是这样的: ? 在这里插入图片描述 分开上传完成有返回图片的地址,可以将图片显示在任意位置。...300 * 400的像素显示出来,缓冲区大小为10M,如果设置太小,就会出现无法加载图片的情况,默认是1M.

    2.6K70

    数据的异步加载和图片保存

    把从网络获取的图片数据保存在SD卡上, 先把权限都加上 网络权限 android.permission.INTERNET SD卡读写权限 android.permission.MOUNT_UNMOUNT_FILESYSTEMS...重写getCount()方法,return数据的条数 重写getItem()方法,返回 根据索引得到的集合中的数据,List对象的get()方法,参数:索引 重写getItemId()方法,一般返回数据的索引...如果直接加载容易anr,所以要异步加载图片 异步加载并保存图片 开启线程执行加载图片的代码 在ContactService业务类里实现getImage()方法,通过get方式读取图片,得到Uri对象,参数...:图片路径, 获取本地文件File对象,通过new FIle(),参数:缓存目录对象,图片文件名称 图片的文件名称是通过md5()保存的,获取文件后缀,从最后一个点开始截取,path.substring...判断文件存在就直接返回该文件的Uri对象,调用Uri.fromFile(),参数:File对象 get获取网络数据,得到输入流,循环读取保存 读取输入流写到文件输出流中 返回Uri对象 在子线程中无法更新

    1.1K20
    领券