FileUploadParser

Django REST framework 提供了 parsers.FileUploadParser 类，可以用来处理原始格式的文件内容的上传。后端获取到的 request.data 为字典结构，其中包含的 'file' 键对应的值即为上传的文件对象。
如果 FileUploadParser 类被包含 filename 参数的 URL 调用，则该参数会作为文件保存到服务端后的文件名。若 URL 中不包含 filename 参数，则客户端发起的请求必须包含 Content-Disposition 请求头及 filename 参数。如 Content-Disposition: attachment; filename=upload.jpg。

示例代码
  1. # views.py
  2. from rest_framework.views import APIView
  3. from rest_framework.response import Response
  4. from rest_framework.parsers import FileUploadParser
  5. class FileUploadView(APIView):
  6.     parser_classes = [FileUploadParser, ]
  7.     def put(self, request, filename, format=None):
  8.         file_obj = request.data['file']
  9.         with open(filename, 'wb') as f:
  10.             for chunk in file_obj.chunks():
  11.                 f.write(chunk)
  12.         return Response(f'{filename} uploaded',status=204)
  1. # urls.py
  2. from django.urls import re_path
  3. urlpatterns = [
  4.     re_path(r'^files/(?P<filename>[^/]+)$', views.FileUploadView.as_view()),
  5. ]

上传接口的 URL 为 [http://xx.xx.xx.xx/files/<filename>](http://xx.xx.xx.xx/files/%3Cfilename%3E) ，其中 <filenmae> 用于指定上传成功后在服务器端的文件名。客户端使用 PUT 请求上传文件。
使用 postman 测试文件上传，截图如下：
无标题 - 图1
postman
前端上传代码示例如下（使用 jQuery，有可能出现跨域问题，可参考网上资料解决）：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>文件上传</title>
  6. </head>
  7. <body>
  8.     <form>
  9.         <p>上传文件： <input type="file" name="files" id='files' /></p>
  10.         <input type="button" value="上传" onclick="doUpload()" />
  11.     </form>
  12.     <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
  13.     <script type="text/javascript">
  14.         function doUpload() {
  15.             $.ajax({
  16.                 url: 'http://xx.xx.xx.xx:8000/files/test.jpg',
  17.                 type: 'PUT',
  18.                 data: $('#files')[0].files[0],
  19.                 cache: false,
  20.                 processData: false,
  21.                 contentType: false,
  22.                 async: false
  23.             }).done(function (res) {
  24.                 alert("上传成功")
  25.             }).fail(function (res) {
  26.                 alert("上传失败：" + res)
  27.             });
  28.         }
  29.     </script>
  30. </body>
  31. </html>

作者：rollingstarky
链接：https://www.jianshu.com/p/82cb876bb426
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。