Currently using Chrome and a server set up using node.
Below is the HTML code:
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/async/3.2.0/async.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js" type="text/javascript"></script>
<script src='https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="17637264647265767463397d6457612539263927">[email protected]</a>/dist/tesseract.min.js'></script>
<script src="js/canvas-to-blob.min.js"></script>
<title>Slicer</title>
<script type="module" src="sketch.js"></script>
</head>
<body></body>
Javascript code (taken from github.com/naptha/tesseract.js/blob/master/docs/examples.md):
const { createWorker } = require('tesseract.js');
const worker = createWorker();
const rectangle = { left: 0, top: 0, width: 500, height: 250 };
(async () => {
await worker.load();
await worker.loadLanguage('eng');
await worker.initialize('eng');
const { data: { text } } = await worker.recognize(imageURL, { rectangle });
console.log(text);
await worker.terminate();
})();
Encountered error:
Uncaught DOMException: Failed to execute 'toBlob' on 'HTMLCanvasElement': Tainted canvases may not be exported.
Attempted solutions:
- Added crossOrigin = "Anonymous", but no change
- Downloaded blueimp-canvas-to-blob
- Tried running the code on terminal (received "RuntimeError: abort(TypeError: Failed to parse URL from /path_to_project/node_modules/tesseract.js-core/tesseract-core.wasm)")
- Downloaded and used canvas-to-blob
Any suggestions on fixing this issue?