Django实现图片上传功能步骤解析

(编辑:jimmy 日期: 2025/10/2 浏览:2)

1.首先是html页面的form表单的三大属性,action是提交到哪,method是提交方式,enctype只要有图片上传就要加这个属性

Django框架自带csrf_token ,所以需要在前端页面也生成csrf_token字符串,来验证真实客户

    <form action="/pic_upload/" method="POST" enctype="multipart/form-data">
      {% csrf_token %}
      <input type="file" name="file">
      <input type="submit" value="提交">
     </form>

2.如下是上传图片的接口:

def pic_upload(request):
  if request.method == "GET":
    return render(request,"helloapp/pic_upload.html",locals())
  if request.method == "POST":
    error = ""
    fp = request.FILES.get("file")
    # fp 获取到的上传文件对象
    if fp:
      path = os.path.join(STATICFILES_DIRS[0],'image/' + fp.name)  # 上传文件本地保存路径, image是static文件夹下专门存放图片的文件夹
      # fp.name #文件名
      #yield = fp.chunks() # 流式获取文件内容
      # fp.read() # 直接读取文件内容
      if fp.multiple_chunks():  # 判断上传文件大于2.5MB的大文件
        # 为真
        file_yield = fp.chunks()  # 迭代写入文件
        with open(path,'wb') as f:
          for buf in file_yield:   # for情况执行无误才执行 else
            f.write(buf)
          else:
            print("大文件上传完毕")
      else:
        with open(path,'wb') as f:
          f.write(fp.read())
        print("小文件上传完毕")
      models.ImgPath.objects.create(path=('image/' + fp.name))   # image是static文件夹下专门存放图片的文件夹
    else:
      error = "文件上传为空"
      return render(request,"helloapp/pic_upload.html",locals())
    return redirect("helloapp/pic_index/") # 重定向到首页

3.做个图片展示的页面,对图片展示对应的接口传过来的参数加以判断

   {% for img in imgs %}
   <img src="/UploadFiles/2021-04-08/{% static img.path %}">

4.图片展示的接口:

def pic_index(request):
  imgs = models.ImgPath.objects.all()
  return render(request,'helloapp/pic_index.html',locals())

至此,Django中一个简单的图片上传到展示就做好了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

一句话新闻
高通与谷歌联手!首款骁龙PC优化Chrome浏览器发布
高通和谷歌日前宣布,推出首次面向搭载骁龙的Windows PC的优化版Chrome浏览器。
在对骁龙X Elite参考设计的初步测试中,全新的Chrome浏览器在Speedometer 2.1基准测试中实现了显著的性能提升。
预计在2024年年中之前,搭载骁龙X Elite计算平台的PC将面世。该浏览器的提前问世,有助于骁龙PC问世就获得满血表现。
谷歌高级副总裁Hiroshi Lockheimer表示,此次与高通的合作将有助于确保Chrome用户在当前ARM兼容的PC上获得最佳的浏览体验。