Как безопасно распознавать текст на изображениях с помощью Cloud Vision, Firebase Auth и функций на платформах Apple

Чтобы вызывать Google Cloud API из приложения, вам нужно создать промежуточный REST API, который будет обрабатывать авторизацию и защищать секретные значения, например ключи API. Затем вам нужно будет написать код в мобильном приложении, чтобы аутентифицироваться в этом промежуточном сервисе и взаимодействовать с ним.

Один из способов создать такой REST API – использовать аутентификацию и функции Firebase. Это управляемый бессерверный шлюз к API Google Cloud, который обрабатывает аутентификацию и может вызываться из мобильного приложения с помощью готовых SDK.

В этом руководстве показано, как использовать этот метод для вызова Cloud Vision API из приложения. Этот метод позволит всем аутентифицированным пользователям получить доступ к платным сервисам Cloud Vision через ваш облачный проект, поэтому перед тем, как продолжить, убедитесь, что этот механизм аутентификации подходит для вашего варианта использования.

Подготовка

Как настроить проект

Для установки зависимостей Firebase и управления ими используйте Swift Package Manager.

1. Откройте проект приложения в Xcode и перейдите в меню File (Файл) > Add Packages (Добавить пакеты).
2. Когда появится запрос, добавьте хранилище Firebase SDK для платформ Apple:

  https://github.com/firebase/firebase-ios-sdk.git

3. Выберите библиотеку Firebase ML.
4. Добавьте флаг -ObjC в раздел Other Linker Flags (Другие флаги компоновщика) в настройках сборки целевого объекта.
5. После этого Xcode автоматически начнет распознавать и скачивать зависимости в фоновом режиме.

Затем выполните настройку в приложении:

1. Импортируйте Firebase в приложение:

   Swift

   import FirebaseMLModelDownloader

   Objective-C

   @import FirebaseMLModelDownloader;

Осталось выполнить несколько шагов:

1. Если вы ещё не включили облачные API для своего проекта, сделайте это сейчас:

   1. Откройте Firebase ML страницу API в консоли Firebase.

   2. Если вы ещё не перешли на тарифный план Blaze с оплатой по мере использования, нажмите Перейти. (Предложение перейти на этот тарифный план появится, только если вы ещё не сделали этого.)

      Использовать облачные API могут только проекты с тарифным планом Blaze.

   3. Если облачные API ещё не включены, нажмите Включить облачные API.
2. Настройте существующие ключи Firebase API, чтобы запретить доступ к Cloud Vision API:
   1. Откройте страницу Credentials (Учетные данные) в Cloud Console.
   2. Для каждого ключа API в списке откройте режим редактирования и в разделе "Ограничения ключа" добавьте в список все доступные API, кроме Cloud Vision API.

Как развернуть вызываемую функцию

Затем разверните функцию Cloud Functions, которая будет использоваться для связи вашего приложения и Cloud Vision API. В репозитории functions-samples есть пример, который можно использовать.

По умолчанию доступ к Cloud Vision API через эту функцию будет разрешен только авторизованным пользователям вашего приложения. Вы можете изменить функцию в соответствии с вашими потребностями.

Чтобы развернуть функцию:

1. Клонируйте или скачайте репозиторий с примерами функций и перейдите в каталог Node-1st-gen/vision-annotate-image:

   git clone https://github.com/firebase/functions-samples
   cd Node-1st-gen/vision-annotate-image
   

2. Установите зависимости:

   cd functions
   npm install
   cd ..

3. Если у вас нет интерфейса командной строки Firebase, установите его.
4. Инициализируйте проект Firebase в каталоге vision-annotate-image. Когда появится запрос, выберите проект в списке.

   firebase init

5. Чтобы развернуть функцию:

   firebase deploy --only functions:annotateImage

Как добавить Firebase Auth в приложение

Развернутая выше вызываемая функция будет отклонять любые запросы от неаутентифицированных пользователей вашего приложения. Если вы ещё этого не сделали, вам нужно добавить Firebase Auth в приложение.

Добавьте в приложение необходимые зависимости

Для установки библиотеки Cloud Functions for Firebase используйте Swift Package Manager.

Теперь вы можете распознавать текст на изображениях.

1. Как подготовить входное изображение

guard let imageData = uiImage.jpegData(compressionQuality: 1.0) else { return }
let base64encodedImage = imageData.base64EncodedString()

NSData *imageData = UIImageJPEGRepresentation(uiImage, 1.0f);
NSString *base64encodedImage =
  [imageData base64EncodedStringWithOptions:NSDataBase64Encoding76CharacterLineLength];

2. Вызов функции для распознавания текста

1. Сначала инициализируйте экземпляр Cloud Functions:

   Swift

   lazy var functions = Functions.functions()
   

   Objective-C

   @property(strong, nonatomic) FIRFunctions *functions;
   

2. Создайте запрос. Cloud Vision API поддерживает два типа распознавания текста: TEXT_DETECTION и DOCUMENT_TEXT_DETECTION. Ознакомьтесь с документацией по OCR в Cloud Vision, чтобы узнать больше о различиях между этими двумя вариантами использования.

   Swift

   let requestData = [
     "image": ["content": base64encodedImage],
     "features": ["type": "TEXT_DETECTION"],
     "imageContext": ["languageHints": ["en"]]
   ]
   

   Objective-C

   NSDictionary *requestData = @{
     @"image": @{@"content": base64encodedImage},
     @"features": @{@"type": @"TEXT_DETECTION"},
     @"imageContext": @{@"languageHints": @[@"en"]}
   };
   

3. Наконец, вызовите функцию:

   Swift

   do {
     let result = try await functions.httpsCallable("annotateImage").call(requestData)
     print(result)
   } catch {
     if let error = error as NSError? {
       if error.domain == FunctionsErrorDomain {
         let code = FunctionsErrorCode(rawValue: error.code)
         let message = error.localizedDescription
         let details = error.userInfo[FunctionsErrorDetailsKey]
       }
       // ...
     }
   }
   

   Objective-C

   [[_functions HTTPSCallableWithName:@"annotateImage"]
                             callWithObject:requestData
                                 completion:^(FIRHTTPSCallableResult * _Nullable result, NSError * _Nullable error) {
           if (error) {
             if ([error.domain isEqualToString:@"com.firebase.functions"]) {
               FIRFunctionsErrorCode code = error.code;
               NSString *message = error.localizedDescription;
               NSObject *details = error.userInfo[@"details"];
             }
             // ...
           }
           // Function completed succesfully
           // Get information about labeled objects
   
         }];
   

3. Извлечение текста из блоков распознанного текста

Если операция распознавания текста выполнена успешно, в результате задачи будет возвращен ответ JSON типа BatchAnnotateImagesResponse. Текстовые аннотации можно найти в объекте fullTextAnnotation.

Распознанный текст можно получить в виде строки в поле text. Пример:

let annotation = result.flatMap { $0.data as? [String: Any] }
    .flatMap { $0["fullTextAnnotation"] }
    .flatMap { $0 as? [String: Any] }
guard let annotation = annotation else { return }

if let text = annotation["text"] as? String {
  print("Complete annotation: \(text)")
}

NSDictionary *annotation = result.data[@"fullTextAnnotation"];
if (!annotation) { return; }
NSLog(@"\nComplete annotation:");
NSLog(@"\n%@", annotation[@"text"]);

Также можно получить информацию об отдельных областях изображения. Для каждого из типов block, paragraph, word и symbol можно получить текст, распознанный в регионе, и координаты границ этого региона. Пример:

guard let pages = annotation["pages"] as? [[String: Any]] else { return }
for page in pages {
  var pageText = ""
  guard let blocks = page["blocks"] as? [[String: Any]] else { continue }
  for block in blocks {
    var blockText = ""
    guard let paragraphs = block["paragraphs"] as? [[String: Any]] else { continue }
    for paragraph in paragraphs {
      var paragraphText = ""
      guard let words = paragraph["words"] as? [[String: Any]] else { continue }
      for word in words {
        var wordText = ""
        guard let symbols = word["symbols"] as? [[String: Any]] else { continue }
        for symbol in symbols {
          let text = symbol["text"] as? String ?? ""
          let confidence = symbol["confidence"] as? Float ?? 0.0
          wordText += text
          print("Symbol text: \(text) (confidence: \(confidence)%n")
        }
        let confidence = word["confidence"] as? Float ?? 0.0
        print("Word text: \(wordText) (confidence: \(confidence)%n%n")
        let boundingBox = word["boundingBox"] as? [Float] ?? [0.0, 0.0, 0.0, 0.0]
        print("Word bounding box: \(boundingBox.description)%n")
        paragraphText += wordText
      }
      print("%nParagraph: %n\(paragraphText)%n")
      let boundingBox = paragraph["boundingBox"] as? [Float] ?? [0.0, 0.0, 0.0, 0.0]
      print("Paragraph bounding box: \(boundingBox)%n")
      let confidence = paragraph["confidence"] as? Float ?? 0.0
      print("Paragraph Confidence: \(confidence)%n")
      blockText += paragraphText
    }
    pageText += blockText
  }
}

for (NSDictionary *page in annotation[@"pages"]) {
  NSMutableString *pageText = [NSMutableString new];
  for (NSDictionary *block in page[@"blocks"]) {
    NSMutableString *blockText = [NSMutableString new];
    for (NSDictionary *paragraph in block[@"paragraphs"]) {
      NSMutableString *paragraphText = [NSMutableString new];
      for (NSDictionary *word in paragraph[@"words"]) {
        NSMutableString *wordText = [NSMutableString new];
        for (NSDictionary *symbol in word[@"symbols"]) {
          NSString *text = symbol[@"text"];
          [wordText appendString:text];
          NSLog(@"Symbol text: %@ (confidence: %@\n", text, symbol[@"confidence"]);
        }
        NSLog(@"Word text: %@ (confidence: %@\n\n", wordText, word[@"confidence"]);
        NSLog(@"Word bounding box: %@\n", word[@"boundingBox"]);
        [paragraphText appendString:wordText];
      }
      NSLog(@"\nParagraph: \n%@\n", paragraphText);
      NSLog(@"Paragraph bounding box: %@\n", paragraph[@"boundingBox"]);
      NSLog(@"Paragraph Confidence: %@\n", paragraph[@"confidence"]);
      [blockText appendString:paragraphText];
    }
    [pageText appendString:blockText];
  }
}