Python 无法使用react js将文件上载到django rest框架

Python 无法使用react js将文件上载到django rest框架,python,django,reactjs,Python,Django,Reactjs,我使用react Js将图像上传到django restframework。 这里我使用fetchapi发送post请求 Eapp.jsx import React, { Component } from 'react'; class Eapp extends Component { constructor(props){ super(props); this.state = { profilePic: null, }; this.inpuEle

我使用react Js将图像上传到django restframework。 这里我使用fetchapi发送post请求

Eapp.jsx

import React, { Component } from 'react';

class Eapp extends Component {
  constructor(props){
    super(props);
    this.state = {
      profilePic: null,
    };
    this.inpuElement = null;
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }
  handleChange(e){
    this.setState({profilePic: e.target.files[0]});
  }
  handleSubmit(){
    let formData = new FormData();
    formData.append('profile_pic',this.state.profilePic);
    fetch('http://10.42.0.1:8000/auth/profile-pic/', {
      method: 'POST',
      headers: {
        Accept: 'application/json, text/plain, */*',
        'content-type': 'multipart/form-data',
      },
      body:formData,
    }).then(res => res.json())
      .then((data) => {
        console.log(data);
      })
      .catch(err => console.log(err));
  }

  render(){
      return(
        <div>
          <input
            type="file"
            multiple={false}
            ref={(input) => { this.inpuElement = input; }}
            accept=".jpg,.jpeg,.png"
            onChange={this.handleChange}
          />
          <button onClick={this.handleSubmit}>submit</button>
      </div>
    );
  }
}
export default Eapp;
德扬戈

 views.py
    class ProfilePictureView(generics.CreateAPIView):
        permission_classes = (permissions.AllowAny,)
        serializer_class = ProfilePictureSerializer
        parser_classes = (parsers.FormParser,parsers.MultiPartParser, parsers.FileUploadParser, )

        def perform_create(self, serializer):
            print(self.request.FILES['profile_pic'])
            serializer.save(user=User.objects.get(pk=2))


models.py

class Person(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    profile_pic = models.ImageField(null=True, upload_to='media')
    face_encodings = models.BinaryField(null=True)
    def __str__(self):
        return str(self.user.first_name)


serializers.py

class ProfilePictureSerializer(serializers.ModelSerializer):
    class Meta:
        model = Person
        fields = ['profile_pic','user']
        read_only_fields = ('user',)

class ProfilePictureSerializer(serializers.ModelSerializer):
    class Meta:
        model = Person
        fields = ['profile_pic','user']
        read_only_fields = ('user',)

class ProfilePictureSerializer(serializers.ModelSerializer):
    class Meta:
        model = Person
        fields = ['profile_pic','user']
        read_only_fields = ('user',)


raise MultiPartParserError('Invalid boundary in multipart: %s' % boundary.decode())
AttributeError: 'NoneType' object has no attribute 'decode'
我已经包括了django cors头,除了这个,其他所有api路由都在工作。我尝试了不同的post请求方法,但仍然出现错误。 似乎无法访问服务器,因为其他所有路由都在工作。
我在django中尝试了多部分解析器fileUpload解析器,但仍然得到错误状态400500。

尝试在标头中不使用内容类型,这肯定会有帮助。

尝试使用

"Content-Type":"multipart/form-data"

在handleSubmit函数中

嗨,欢迎来到SO!这个问题已经得到了回答,并得到了接受。如果您认为您的答案确实为所述问题增添了更多内容,请详细说明为什么此解决方案优于已接受的解决方案。否则,它可能不会吸引太多的赞赏。请尝试使用filepond的现成解决方案:
"Content-Type":"multipart/form-data"