前端实现

  1. 在前端中,需要填入一个form标签,然后在这个form标签中指定enctype="multipart/form-data",不然就不能上传文件。
  2. form标签中添加一个input标签,然后指定input标签的name,以及type="file"

以上两步的示例代码如下:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <form action="" method="post" enctype="multipart/form-data">
  9. <input type="file" name="uploadFile">
  10. <input type="submit" name="提交">
  11. </form>
  12. </body>
  13. </html>

后端实现

后端的主要工作是接收文件。然后存储文件。接收文件的方式跟接收POST的方式是一样的,只不过是通过FILES来实现。

  1. from django.shortcuts import render
  2. from django.http import HttpResponse
  3. from django.views.generic import View
  4. class IndexView(View):
  5. def get(self, request):
  6. return render(request, "index.html")
  7. def post(self, request):
  8. file = request.FILES.get("uploadFile")
  9. with open("save.txt", "wb") as fp:
  10. for chunk in file.chunks():
  11. fp.write(chunk)
  12. return HttpResponse("success")

以上代码通过request.FILES接收到文件后,再写入到指定的地方。这样就可以完成一个文件的上传功能了。

使用模型来处理上传的文件

在定义模型的时候,可以给存储文件的字段指定为FileField,这个Field可以传递一个upload_to参数,用来指定上传上来的文件保存到哪里。

比如将其保存到当前项目的files文件夹下

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <form action="" method="post" enctype="multipart/form-data">
  9. <input type="text" name="title">
  10. <input type="text" name="content">
  11. <input type="file" name="uploadFile">
  12. <input type="submit" name="提交">
  13. </form>
  14. </body>
  15. </html>
  1. # models.py
  2. class Article(models.Model):
  3. title = models.CharField(max_length=100)
  4. content = models.TextField()
  5. thumbnail = models.FileField(upload_to="files")
  6. # 指定上传的位置,和setting.py的MEDIA_ROOT有关,如果MEDIA_ROOT没有设置,为当前项目的指定目录
  7. # views.py
  8. def index(request):
  9. if request.method == 'GET':
  10. return render(request,'index.html')
  11. else:
  12. title = request.POST.get('title')
  13. content = request.POST.get('content')
  14. thumbnail = request.FILES.get('thumbnail')
  15. article = Article(title=title, content=content, thumbnail=thumbnail)
  16. article.save()
  17. return HttpResponse('success')

调用完article.save()方法,就会把文件保存到files下面,并且会将这个文件的路径存储到数据库中。

指定MEDIA_ROOTMEDIA_URL来指定上传文件存储的路径

上面表单的字段是使用了upload_to来指定上传的文件的目录。

也可以指定MEDIA_ROOT,就不需要在FielField中指定upload_to,他会自动的将文件上传到MEDIA_ROOT的目录下。

  1. MEDIA_ROOT = os.path.join(BASE_DIR,'media') # 当前项目的media文件
  2. # 类似static, 127.0.0.0.1/media/ 访问
  3. MEDIA_URL = '/media/'

然后可以在urls.py中添加MEDIA_ROOT目录下的访问路径。

  1. from django.urls import path
  2. from front import views
  3. from django.conf.urls.static import static
  4. from django.conf import settings
  5. urlpatterns = [
  6. path('', views.index),
  7. ] + static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)

如果同时指定MEDIA_ROOTupload_to,那么会将文件上传到MEDIA_ROOT下的upload_to文件夹中。

  1. class Article(models.Model):
  2. title = models.CharField(max_length=100)
  3. content = models.TextField()
  4. thumbnail = models.FileField(upload_to="%Y/%m/%d/")

限制上传的文件拓展名

如果想要限制上传的文件的拓展名,那么我们就需要用到表单来进行限制。我们可以使用普通的Form表单,也可以使用ModelForm,直接从模型中读取字段。

必须注意表单里的字段名是模型的字段,更是模板的input标签的name

  1. # models.py
  2. class Article(models.Model):
  3. title = models.CharField(max_length=100)
  4. content = models.TextField()
  5. thumbnial = models.FileField(upload_to='%Y/%m/%d/',validators=[validators.FileExtensionValidator(['txt','pdf'])]) # 添加一个过滤器
  6. # forms.py
  7. class ArticleForm(forms.ModelForm):
  8. class Meta:
  9. model = Article
  10. fields = "__all__"
  11. # views.py
  12. from django.shortcuts import render
  13. from django.http import HttpResponse
  14. from django.views.generic import View
  15. from .forms import ImageForm
  16. from .models import Article
  17. # Create your views here.
  18. class IndexView(View):
  19. def get(self, request):
  20. return render(request, "index.html")
  21. def post(self, request):
  22. form = ImageForm(request.POST, request.FILES) #注意写法
  23. if form.is_valid():
  24. form.save()
  25. return HttpResponse("success")
  26. else:
  27. print(form.errors.get_json_data())
  28. return HttpResponse("failure")

上传图片

注意:使用ImageField,必须要先安装Pillow库:pip install Pillow

上传图片跟上传普通文件是一样的。只不过是上传图片的时候Django会判断上传的文件是否是图片的格式(除了判断后缀名,还会判断是否是可用的图片)。如果不是,那么就会验证失败。
必须注意表单里的字段名是模型的字段,更是模板的input标签的name
定义一个包含ImageField的模型。

  1. class Article(models.Model):
  2. title = models.CharField(max_length=100)
  3. content = models.TextField()
  4. thumbnail = models.ImageField(upload_to="%Y/%m/%d/")

因为要验证是否是合格的图片,需要用一个表单来进行验证。表单直接就使用ModelForm就可以了。

  1. class MyForm(forms.ModelForm):
  2. class Meta:
  3. model = Article
  4. fields = "__all__"