0

I am trying to upload a file on the frontend in React and pass that image file to the backend in django to run some code on the image. Right now, the data from React is being passed as a bytes array but when I reconstruct the image in the Django backend the image data is completely corrupt. I dont know what I am doing wrong here. The image is in the form of a InMemoryUploadedFile object in Django.

HTML:

<label onChange = {handleFileUpload} className = "custom-file-upload">
        <input type = "file" name = "image" />
         Upload Image
</label>

AJAX call to Django: I can confirm the correct data is being passed from the frontend to the backend

const data = new FormData();
data.append('image', files[0])
fetch('/api/itot/', {
  method: 'POST',
  body:data
})
  .then(response => response.json())
  .then(data => console.log(data["text"]))

Django View:

       img = request.FILES["image"]
       # img is InMemoryUploadedFile object
       # I have tried .open() and .read() but that does not seem to work

I dont know why the file is being corrupted.

pluto
  • 1
  • Does this answer your question? [Displaying uploaded images in the template - Django](https://stackoverflow.com/questions/32947795/displaying-uploaded-images-in-the-template-django) – Maifee Ul Asad Jul 28 '20 at 20:41
  • No unfortunately it does not. My problem is im somehow passing the image file the wrong way and the image data is being corrupted. – pluto Jul 29 '20 at 00:04

0 Answers0