Unable to store result value from a tesseract function to a global variable inside an asynchronous function

Question

I'm using tesseract JS to convert an image into text format. The conversion is successful and I'm able to print it out in the console. But I am unable to get this text outside the scope of the function.

I have tried assigning the text to a global variable and then printing it but nothing happens.

(async () => {

tesseract.process('new.png', (err, text) => {
    if(err){return console.log("An error occured: ", err); }
    console.log("Recognized text:",text);
    });

})();

Need to be able to get the value of text outside the function and use it again in another asynchronous call.

Aritra Chakraborty · Accepted Answer · 2019-07-19T11:56:46.567

0

If you use asynchronous operations, like Promise, callback, async-await you cannot use synchronous flow anymore.

Think it like this, Asynchronous functions are operations that will be completed in future, you want some value out of it then you CANNOT get the value untill the first asynchronous function is completed.

That being said, you CAN use Promises (seem) like synchronous functions if you use aysnc-await, IF you don't want to use Promise chain. So you need to promisify the tesseract.process function:

const utils = require('util');

(async () => {
  const tessProcess = utils.promisify(tesseract.process);
  try {
    const text = await tessProcess('new.png');
    console.log("Recognized text:", text);
  } catch (err) {
    console.log("An error occured: ", err);
  }
})();

EDIT: After checking the code snippet:

const utils = require('util');
(async () => {
  const browser = await puppeteer.launch({headless: false})
  const page = await browser.newPage()
  const tessProcess = utils.promisify(tesseract.process);
  await page.setViewport(viewPort)
  await page.goto('example.com')
  await page.screenshot(options)
  const text = await tessProcess('new.png');
  //YOU CAN USE text HERE/////////////
  await page.$eval('input[id=companyID]', (el, value) => el.value = value, text);//here too

  await browser.close()
})()

edited Jul 19 '19 at 11:56

answered Jul 19 '19 at 10:03

Aritra Chakraborty

9,464
3
18
26

so is it not possible to store this text value in another variable and use it again in another function? – Sayyam Kapoor Jul 19 '19 at 10:24
Yes only after the first function is completely executed. Otherwise it will be null. You should check out resources about asynchronous functions. – Aritra Chakraborty Jul 19 '19 at 10:30
But if you can specify in the question how exactly do you want to use the text in the function then i may able to help. – Aritra Chakraborty Jul 19 '19 at 10:32
here is a code snippet, where I take a screenshot of a captcha with puppeteer and proceed to solve it with tesseract. Now I want to use this processed text to enter in the captcha input field again to submit the form. https://jsfiddle.net/df7bnk2h/2/ – Sayyam Kapoor Jul 19 '19 at 10:38
Edited the answer, you can use `text` in the `page.$eval` function – Aritra Chakraborty Jul 19 '19 at 10:51
I'm sorry, I'm new to puppeteer, I used this await page.$eval('input[id=userEnteredCaptcha]', el => el.value = text); to type the text but now it says that text is undefined. Is the syntax wrong here? – Sayyam Kapoor Jul 19 '19 at 11:00
can you console log the `text` before page.$eval and check if text is coming or not? – Aritra Chakraborty Jul 19 '19 at 11:06
It is coming up – Sayyam Kapoor Jul 19 '19 at 11:08
It is correct, but you can use `await page.$eval('input[id=companyID]', (el, value) => el.value = value, text)` to check – Aritra Chakraborty Jul 19 '19 at 11:14

Unable to store result value from a tesseract function to a global variable inside an asynchronous function

1 Answers1