DRF加载从React应用程序发送的二进制文件

Question

我为下载文件到awss3制作了一个标准API。使用标准DRF接口，文件被正确地加载到存储库中

型号.py

class Documents(models.Model):

    author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    upload = models.FileField(storage=PrivateMediaStorage())
    filename = models.CharField(_('documents name'), max_length=64)
    datafile = models.FileField()
    created = models.DateTimeField(auto_now_add=True)
    type = models.ForeignKey(Doctype, on_delete=models.CASCADE, blank=True)

视图.py

class DocumentsListView(AwsUrlMixin, viewsets.ViewSetMixin, generics.ListCreateAPIView):
    queryset = Documents.objects.all()
    serializer_class = DocumentsSerializer
    permission_classes = (IsAuthenticated, LifeLinePermissions)
    pagination_class = None

    def perform_create(self, serializer):
        serializer.save(author=self.request.user)

当通过用户界面完成下载并使用React传输文件时，问题就开始了

django控制台中发生错误

HTTP POST /api/v1/files/ 400 [0.02, 127.0.0.1:33916]

在浏览器调试器中

升级版 \ 反应代码（使用库uppy）

 componentDidMount() {
    const token = localStorage.getItem(localStorageNames.token);

    const uppy = Uppy({
      meta: { type: 'avatar' },
      restrictions: { maxNumberOfFiles: 1 },
      autoProceed: false
    });

    uppy.use(XHRUpload, {
      endpoint: 'http://localhost:8000/api/v1/files/',
      fieldName: 'filedata',
      headers: {
        Authorization: `JWT ${token}`
      }
    });

    this.setState({ uppy });
  }



  componentWillUnmount() {
    this.state.uppy.close();
  }

  clickHandler = () => {
    this.state.uppy.setMeta({
      filename: this.state.form.filename,
      filetype: this.state.form.filetype
    });

    this.state.uppy.upload();
  };