1

Всем привет! Я изучаю бэкенд Django и я пишу React Native мобильное приложение, которое распознает текст с изображения с использованием Django. Как оно работает: С мобильного приложения я отправляю изображение через POST-запрос, оно попадает на сервер, и далее там начинает срабатывать функция распознавания текста. Результат функции сохраняется внутри локального массива этой функции и выводится пока что в консоле Django. Но я пока не могу понять, как мне передать этот результат обратно на мобильное приложение.

Возможно мне нужно создавать еще один класс в модели Django, либо есть способ его внутри функции отправить на мобилку, если кто-то разбирается, то можете объяснить как это сделать:)

Django-Сервер:

models.py:

from django.db import models

# Create your models here.

class Ocr(models.Model):
    title = models.CharField(max_length=100, blank=False, null=False)
    image = models.ImageField(upload_to='images/', null=True, blank=True)

    def __str__(self):
        return self.title

serializers.py:

from rest_framework import serializers
from .models import Ocr

class PostSerializer(serializers.ModelSerializer):
    class Meta:
        model = Ocr
        fields = '__all__'

views.py:

from .serializers import PostSerializer
from .models import Ocr
from rest_framework.views import APIView
from rest_framework.parsers import MultiPartParser, FormParser
from rest_framework.response import Response
from rest_framework import status
# Create your views here.

from django.http.response import JsonResponse
# Create your views here.

# import pytesseract to convert text in image to string
import pytesseract
# import summarize to summarize the ocred text

from .forms import ImageUpload
import os

# import Image from PIL to read image
from PIL import Image

from django.conf import settings

# Create your views here.

class PostView(APIView):
    parser_classes = (MultiPartParser, FormParser)

    def get(self, request, *args, **kwargs):
        posts = Ocr.objects.all()
        serializer = PostSerializer(posts, many=True)
        print(serializer.data)
        return Response(serializer.data)

    def post(self, request, *args, **kwargs):
        posts_serializer = PostSerializer(data=request.data)
        if posts_serializer.is_valid():
            text = ""
            message = ""
            posts_serializer.save()
            try:
                posts_serializer.save()
                image = request.FILES['image']
                image = image.name
                path = settings.MEDIA_ROOT
                pathz = path + "/images/" + image

                text = pytesseract.image_to_string(Image.open(pathz), lang='rus+eng')

                os.remove(pathz)
            except Exception:
                message = "check your filename and ensure it doesn't have any space or check if it has any text"
            context = {
                    'text': text,
                    'message': message
            }
            print(context)
            return Response(posts_serializer.data, status=status.HTTP_201_CREATED)
        else:
            return Response(posts_serializer.errors, status=status.HTTP_400_BAD_REQUEST)

React-Native:

CameraScreen.js:

const postToServer = (img) => {
    const formData = new FormData();
    
    formData.append('image', {
                uri: img.uri,
                type: 'image/jpeg', 
                name: 'test.jpg',
            })
    formData.append('title', 'title');
        
        fetch('http://192.168.0.149:8000/api/textocr/', {
          method: 'POST',
          body: formData,
          // If you add this, upload won't work
          headers: {
            'Accept': 'application/json',
            'Content-Type': 'multipart/form-data',
          }
        });
  }

2 ответа 2

1

За отправку с сервера в Django отвечает return Response( )

Для получения на клиенте вам надо правильно использовать fetch - либо два await, либо два then.

Это простейший пример, должен использоваться внутри асинхронной функции:

let response = await fetch(url);

let data = await response.json();

Подробнее про fetch

Если понимаете, что данные приходят не те или в неправильном формате, смотрите, что передаёте в Response в django.

Про Response

1
  • Да, спасибо большое, я разобрался
    – bigbwoi
    5 мая 2022 в 18:24
1

Вот, что я использовал со стороны React Native:

const postToServer = async (img) => {
    const formData = new FormData();
    
    formData.append('image', {
                uri: img.uri,
                type: 'image/jpeg', 
                name: 'test.jpg',
            })
    formData.append('title', 'title');
        
        let res = await fetch('http://192.168.0.149:8000/api/textocr/', {
          method: 'POST',
          body: formData,
          headers: {
            'Accept': 'application/json',
            'Content-Type': 'multipart/form-data',
          },
        });
        let json = await res.json();
        console.log(json);
  }

Ну и соответственно, я отправляю картину на сервер, и с сервера он возвращается в в консоле react native:

Object {
  "result": "Но тут интервью вышло с министром
образования, он говорит что с лета
скорее всего будут рассматривать
заявления ene
",
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.