Отправка изображения с фронт-энда (JavaScript) на бэкэнд (Django)

У меня есть изображение на передней стороне, и я хочу отправить его на заднюю сторону. У меня есть простой JavaScript на передней стороне и Django-python на задней стороне. Я перепробовал десятки различных методов и потратил недели, но так и не смог разобраться с этим. Можете ли вы, ребята, подсказать, как я могу добиться этого на фронт-энде (отправляющая часть) и бэк-энде (принимающая часть). Кусочек кода с советом был бы очень признателен. Я использую представления на основе функций на бэкенде. Может ли кто-нибудь помочь мне с кодом бэкэнда (если код фронтэнда правильный) для обработки входящих данных с фронтэнда. Потому что я сначала преобразовал файл изображения в поток base 64, чтобы отправить его на backend через fetch api.

Код переднего плана:

   const { snippet, transform } = anno.getImageSnippetById(annotation.id) //this function returns a DOM canvas element in snippet variable
       const base64Canvas = snippet.toDataURL("image/jpeg").split(';base64,')[1]; //converting into a base64 stream
       fetch(url1,{
                 method:'POST',
                 headers:{
                   'Content-type':'application/json',
                   'X-CSRFToken':csrftoken,
                 },
                 body: {'snippet':base64Canvas}
               })

Код бэкенда:

def snippetCreate(request):
   serializer = Annotated_SnippetsSerializer(data=request['snippet'])
   image = base64_to_image(base64_string=serializer.data)
   img = Annotated_Snippets(asnippet=image)
   img.save()
   return Response({'success':'success'}) ```

base64_to_image:
```def base64_to_image(base64_string):
   format, imgstr = base64_string.split(';base64,') 
   ext = format.split('/')[-1]
   return ContentFile(base64.b64decode(imgstr), name=uuid.uuid4().hex + "." + ext) ```

Вернуться на верх