Ionic 4 с Tesseract в автономном режиме получает «Uncaught DOMException: не удалось выполнить importScripts» на «WorkerGlobalScope» » - PullRequest
Новая
       10

Ionic 4 с Tesseract в автономном режиме получает «Uncaught DOMException: не удалось выполнить importScripts» на «WorkerGlobalScope» »

0 голосов
/ 13 апреля 2019

Я пытаюсь использовать Tesseract в режиме офлайн в моем приложении Ionic 4. Чтобы сделать это, я основал свой код на том, что объясняется в этом примере , хотя это делается с Ionic 3 и на том, что Tesseract GitHub объясняет относительно автономного режима .

Сначала я поместил файлы Tesseract в каталог src\assets\lib следующим образом (префикс tesseract- для файлов был добавлен мной):

Assets directory

Затем я создал сервис, который в основном создает экземпляр автономного режима Tesseract, как указано в вышеупомянутых ссылках: 

  const path = this.webview.convertFileSrc(this.file.applicationDirectory + 'www/assets/lib/');

  this.tesseract = await Tesseract.create({
    langPath: path + 'tesseract-', 
    corePath: path + 'tesseract-index.js',
    workerPath: path + 'tesseract-worker.js',
  });

Некоторые примечания по коду:

  • this.file - это File от '@ionic-native/file/ngx'.
  • Призыв к convertFileSrc состоит в том, чтобы избежать ошибки unable to load resource, которая появляется при попытке загрузить файлы Javascript напрямую.
  • Если я регистрируюсь с this.file.listDir содержимым this.file.applicationDirectory + 'www/assets/lib/', я вижу Tesseract файлы.

Теперь, когда я внедряю это в Android emulator (Pixel 2 API 28) и пытаюсь вызвать функцию, в которой находится этот код, я получаю следующую ошибку согласно отладчику Chrome:

importScripts error

FWIW, это моя среда: 

Ionic:

   ionic (Ionic CLI)             : 4.12.0 (C:\Users\guillem.vicens\AppData\Roaming\nvm\v10.15.3\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.1.2
   @angular-devkit/build-angular : 0.13.6
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.3.6
   @ionic/angular-toolkit        : 1.4.1

Cordova:

   cordova (Cordova CLI) : not installed
   Cordova Platforms     : android 8.0.0
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 6 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\myUser\AppData\Local\Android\Sdk)
   NodeJS            : v10.15.3 (C:\Program Files\nodejs\node.exe)
   npm               : 6.4.1
   OS                : Windows 10

Чего мне не хватает? Как правильно получить доступ к папке assets?

1 Ответ

0 голосов
/ 16 апреля 2019

Мне, наконец, удалось решить мою проблему с помощью неисчисляемой базы URL.

Я заметил, что файл tesseract-tesseract-js загружается со следующего URL: 

http://localhost/assets/lib/tesseract-tesseract.js

Но ни один из остальных не был загружен. Это заставило меня подумать, что проблема как-то связана с внутренним использованием в Tesseract.js относительных путей, которые вступали в противоречие с политиками безопасности веб-просмотра.

Изменение кода для выполнения следующих действий: 

  this.tesseract = await Tesseract.create({
    langPath: 'http://localhost/assets/lib/tesseract-', 
    corePath: 'http://localhost/assets/lib/tesseract-index.js',
    workerPath: 'http://localhost/assets/lib/tesseract-worker.js',
  });

Мне нужно будет проверить это на реальных мобильных телефонах и на iOS, но это ответит на мой оригинальный вопрос.

...