环境

python 3.5

django 1.10.6

步骤

  1. 创建名为 testupload的项目
django-admin startproject testupload
  1. 在项目testupload中创建名为uploadpic的app
cd testupload
python manage.py startapp uploadpic
  1. 把uploadpic加入到settings.py中的INSTALLED_APPS中
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'uploadpic',
)
  1. 在文件夹uploadpic下,编辑models.py,创建IMG类.创建这个类是为了使用django的ImageField,使上传不用直接操作文件,简化上传的代码逻辑.
from __future__ import unicode_literals
from django.db import models
class IMG(models.Model):
img = models.ImageField(upload_to='upload')
  1. 在数据库里生成django一些元数据表.执行下面命令.
python manage.py migrate
  1. 生成模块.执行下面命令.
python manage.py makemigrations uploadpic
  1. 再在数据库里生成IMG的数据表.执行下面命令
python manage.py migrate
  1. 在文件夹uploadpic下,编辑views.py,创建图片上传与显示函数.
from django.shortcuts import render
from uploadpic.models import IMG
def upload(request):
return render(request, 'uploadpic/upload.html')
def show(request):
new_img = IMG(img=request.FILES.get('img'))
new_img.save()
content = {
'aaa': new_img,
}
return render(request, 'uploadpic/show.html', content)
  1. 在testupload文件夹下,编辑urls.py文件
from django.conf.urls import include, url
from django.contrib import admin
from django.conf.urls.static import static
from django.conf import settings
from showpic.views import show
from showpic.views import upload
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'^upload', upload),
url(r'^show', show),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  1. 编辑testupload文件夹下的setting.py文件,添加如下代码:
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media').replace('\\', '/')
  1. 在uploadpic文件夹下创建templates文件夹,再在templates文件夹下创建uploadpic文件夹,再在新创建的uploadpic文件夹下创建upload.html文件,内容如下:
<form method="POST" enctype="multipart/form-data"
action="./../show">
{% csrf_token %}
<input type="file" name="img">
<button type="submit">上传</button>
</form>
  1. 在upload.html同目录下创建show.html文件,内容如下:
<img src='{{ aaa.img.url }}' />
  1. 运行django程序
python manage.py runserver

打开浏览器,输入localhost:8000/upload,进入图片上传页面,上传后会显示图片.

参考资料

  1. Django上传并显示图片, 2016
  2. Django官方文档

django上传并显示图片的更多相关文章

  1. input上传文件显示图片缩略图

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. PHP AJAXFORM提交图片上传并显示图片源代码

    PHP dofile.php 文件上传源代码 <? php $file_upload = "upload/"; $file_allow_ext='gif|jpg|jpeg|p ...

  3. django后台处理前端上传和显示图片

      1:项目根目录存放图片的目录 2:settings.py  添加 MEDIA_ROOT = os.path.join(BASE_DIR, "media") 3:url.py 添 ...

  4. html5 图片上传,支持图片预览、压缩、及进度显示,兼容IE6+及标准浏览器

    以前写过上传组件,见 打造 html5 文件上传组件,实现进度显示及拖拽上传,兼容IE6+及其它标准浏览器,对付一般的上传没有问题,不过如果是上传图片,且需要预览的话,就力有不逮了,趁着闲暇时间,给上 ...

  5. ruby on rails爬坑(三):图片上传及显示

    一,问题及思路 最近在用rails + react + mysql基本框架写一个cms + client的项目,里面涉及到了图片的上传及显示,下面简单说说思路,至于这个项目的配置部署,应该会在寒假结束 ...

  6. 图片上传即时显示javascript代码

    这是基于javascript的一种图片上传即时显示方法,测试结果IE6和火狐浏览器可以正常使用.google浏览器不兼容. 这种方法兼容性比较差,仅供参考,建议使用ajax方法来即时显示图片. 1.首 ...

  7. 图片上传并显示(兼容ie),图片大小判断

    图片上传并显示(兼容ie),图片大小判断 HTML <div id="swf" style="margin: 0 auto;text-align: center;& ...

  8. struts中用kindeditor实现的图片上传并且显示在页面上

    做公司网站的时候由于需要在内容属性中加入图片,所以就有了这个问题,本来一开始找几篇文章看都是讲修改kindeditor/jsp/file_manager_json.jsp和upload_json.js ...

  9. Slog71_选取、上传和显示本地图片GET !(微信小程序之云开发-全栈时代3)

    ArthurSlog SLog-71 Year·1 Guangzhou·China Sep 12th 2018 ArthurSlog Page GitHub NPM Package Page 掘金主页 ...

随机推荐

  1. 最近的项目系列1——core整合SPA

    1.前言 当前,前后端分离大行其道,我本人之前不少项目也是纯前后端分离,但总有些场景,春前后端分离整起来比较痛苦,比如我手头这个公众号项目吧,它涉及到第三方鉴权,第三方凭证,以及微信凭证这些,都不适合 ...

  2. 轻松实现C/C++各种常见进制相互转换

    其它进制转为十进制 在实现这个需求之前,先简单介绍一个c标准库中的一个函数: long strtol( const char *str, char **str_end, int base); 参数详细 ...

  3. Elasticsearch系列---常见搜索方式与聚合分析

    概要 本篇主要介绍常见的6种搜索方式.聚合分析语法,基本是上机实战,可以和关系型数据库作对比,如果之前了解关系型数据库,那本篇只需要了解搜索和聚合的语法规则就可以了. 搜索响应报文 以上篇建立的mus ...

  4. django_5:表单1

    CSRF( Cross Site Request Forgery)跨站点请求欺骗 方法一. {% csrf_token %} 方法二.在setting.py中注释掉MIDDLEWARE中的'djang ...

  5. i7-9700也能安装Windows7

    商家说,i7-8700以上不支持Win7,只能安装Win10.我在手机网上也看过同样的说明,是微软与Intel联合行动,意在强迫用户升级到Win10.文章后面有,并不是不能装win7,是没有提供win ...

  6. RALM: 实时 Look-alike 算法在微信看一看中的应用

    嘉宾:刘雨丹 腾讯 高级研究员 整理:Jane Zhang 来源:DataFunTalk 出品:DataFun 注:欢迎关注DataFunTalk同名公众号,收看第一手原创技术文章. 导读:本次分享是 ...

  7. beta 2/2 阶段中间产物提交

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2019fall/homework/9961 一.小组情况 队名:扛把子 组长:孙晓宇 组员:宋晓丽 梁梦瑶 韩 ...

  8. (四)OpenStack---M版---双节点搭建---Glance安装和配置

    ↓↓↓↓↓↓↓↓视频已上线B站↓↓↓↓↓↓↓↓ >>>>>>传送门 1.创建glance数据库 2.获得 admin 凭证来获取只有管理员能执行的命令的访问权限 3 ...

  9. 23种GoF设计模式概述

    23种GoF设计模式概述 在前面,我们对 GoF 的 23 种设计模式进行了分类,这里先对各个设计模式的功能进行简要介绍,以便有个大概了解.后面的章节再进行详细介绍. 创建型模式 关注于怎么创建对象的 ...

  10. 有效的减少代码中太多的if、else?-策略模式

    写这篇文章的目的和上一篇单例模式一样,策略模式也是一种常用的设计模式,太多的if-else不仅看着不太美观而且不好维护,对于自己来说也等于复习了一遍策略模式.先说一下策略 模式的定义: 策略模式封装了 ...