Django и React return obj.decode() UnicodeDecodeError: 'utf-8' кодек не может декодировать байт 0xff в позиции 0: недопустимый начальный байт

Получаем ошибку декодирования при попытке отправить запрос изображения из React в Django, я думаю, что Django не может интерпретировать запрос, поэтому появляется ошибка :

class ImageModel(models.Model):
      image = models.ImageField(upload_to='media')

views.py

class ImgView(viewsets.ModelViewSet)
      data = serializer.ImgSerializer(data=request.data)
      if data.is_valid():
         img = request.FILES['img']
         imgmodel = ImageModel.objects.create(image=img)
         return Response("Success")
      return Response("fail")

serializer.py

class ImgSerializer(serializers.Serializer):
      class Meta:
          fields = '__all__'
          model = models.ImageModel

на стороне фронтенда:

function ComponentImage(){
        let [img,setImg] = useState('')
        let handleChange = (key,content)=>{
                  setImg({
                      ...img,
                      [key]:content
}
)
}
       let submitChange = (e)=>{
           e.preventDefault()
           let formData = new FormData()
           formData.append('img',img)
           axios.post('http://127.0.0.1:8000/',formData)
}

return(
<div>
     <form method='submit' onSubmit = (e)=>submitChange(e) encType='multipart/form-data'>
     <div class='divlbl'><label for="upload" className='imglbl'>Upload An Image</label></div>
    <input id='upload' required type='file' name='img'  accept="image/*" onChange ={(e)=>handleChange(e.target.name,e.target.files[0])}></input>
    <div>
</form>
</div>
  )
        
        
}

Вам необходимо указать multipart заголовка типа содержимого, чтобы вы могли отправить файл на ваш сервер.
изменить :

 axios.post('http://127.0.0.1:8000/',formData)

к :

axios.post('http://127.0.0.1:8000/', formData, {
      headers: {
       'content-type': 'multipart/form-data' // do not forget this 
      }})
Вернуться на верх