tesseract.js: Cannot read property 'arrayBuffer' of undefined (Electron & React)

Describe the bug I’ve spent a few hours tonight trying to get tesseract.js working with an application I’ve been building. The stack is Electron & React and I can’t seem to get it to work, I’ve pulled both the Electron & React example applications and they seem to work fine, but with my application, I’m bundling React inside Electron–which I think might be causing this issue.

At first, my application wasn’t loading the languages with the default setup, so I went ahead and moved to the offline tesseract. To do this, I used Webpack to copy the files from the node_modules to my build folder using copy-webpack-plugin, this works fine, so then I went ahead and created the worker like so:

const worker = createWorker({
  cacheMethod: 'none',
  langPath: `http://localhost:3000/static/vendor/lang-data/eng.traineddata`,
  workerPath: `http://localhost:3000/static/vendor/worker.min.js`,
  corePath: `http://localhost:3000/static/vendor/tesseract-core.wasm.js`,
  logger: (m) => console.log(m),
});

Note: If I remove http://localhost:3000/ - I get Uncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The URL '/static/vendor/worker.min.js' is invalid.

After running the application with the steps below, I get the following error: Uncaught (in promise) TypeError: Cannot read property 'arrayBuffer' of undefined - I’ve spent a few hours trying to debug this, but to no avail. The langPath, workerPath, corePath all seem correct, and I can access these directly in the browser.

I’m kind of stumped at this point, any help would be appreciated.

To Reproduce Steps to reproduce the behavior:

  1. Go to ‘https://github.com/karlhadwen/notes’ - pull the repo
  2. yarn install & yarn dev
  3. Click the [+] button on the bottom left (with console open)
  4. See error (Cannot read property ‘arrayBuffer’ of undefined)

Expected behavior To read the data from the image in ‘http://localhost:3000/note.png’ - which is the example image.

Screenshots Screenshot 2020-05-18 at 22 22 41

App.js: https://github.com/karlhadwen/notes/blob/master/src/App.js electron.js: https://github.com/karlhadwen/notes/blob/master/public/electron.js .webpack.config.js: https://github.com/karlhadwen/notes/blob/master/.webpack.config.js

Desktop (please complete the following information):

  • OS: OS X (10.15.4)
  • Electron & Chrome - both do not work
  • Version: ^2.1.1

Additional context Repo where this is happening: https://github.com/karlhadwen/notes/

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 20 (3 by maintainers)

Most upvoted comments

I think everyone is having a similar problem, I spent hours on it but got nowhere. Maybe one of the authors can help?

Did you resolve it? I have same problem with electron+vue