Uploading image via django from react is showing error of UnicodeDecodeError: 'utf-8'

I am building a Blog App in React and Django and I am trying to upload an image from react in django But It is showing

UnicodeDecodeError: 'utf-8' codec can't decode byte 0xff in position 136: invalid start byte

views.py

class BlogCreateView(APIView):
    serializer_class = BlogSerializer

    def post(self, request, *args, **kwargs):

        print(request.body)
        data = json.loads(request.body)
        print(data)

        return Response({"status": "SUCCESS"})

serializers.py

class BlogSerializer(serializers.ModelSerializer):

    class Meta:
        model = Blog
        fields = ("id", "image")

App.js

function BlogCreate() {
    const [image, setImage] = useState(null);

    const saveBlog = () => {
       let form_data = new FormData();

       form_data.append("image", image, image.name)

       const headers = {
         "Content-Type": "multipart/form-data",
         Accept: "application/json",
        }

       axios.post("http://127.0.0.1:8000/blog_create/", form_data, 
                                      {headers:headers}).then((res) => {
         console.log(res)
       })

     return (
         <> 
          <input type="file" onInput={(e) => setImage(e.target.files[0])} 
          />

          <button type='button' onClick={saveBlog}>Save</button>

 

         </>
       )
     }
   }
}

When I use for loop like :-

        for data in request.data:
            json_accep = data.replace("'", "\"")
            get = json.loads(json_accep)
            print(get)

then It is showing json.decoder.JSONDecodeError: Expecting value: line 1 column 1 (char 0)

I have tried many times but it is still not working.

Back to Top