code shows error await can only be declared inside async function although there is async function

Question

The code below fetches a url and article_id from the database. It crawls the url page, takes the snaps of images present in the url and saves it in my remote server.

PS: Noob at javascript!

(async () => {
client.query("SELECT DISTINCT url,article_id FROM public.content_paraarticle",(err,res,fields)=>{
if (err)  throw err;
// console.log(res)
for(var i=0;i<res.rows.length;i++)
{

// Set up browser and page.
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    page.setViewport({ width: 1280, height: 926 });
    var str1='.png';


    // arr.push(res[i])
    var id=(res.rows[i].article_id);
    var str=id+str1;
    console.log(str);
    var url=(res.rows[i].url);

    console.log('taken');
    await Promise.race([
    await page.goto('https://www.thehindu.com/news/cities/kozhikode/skilled-entrepreneurs-centres-in-35-panchayats-in-kozhikode/article29434054.ece?utm_source=udmprecommendation_other-states&utm_medium=sticky_footer&transactionId=5abd798d30a44245b32a3fde2925c44d', {waitUntil: 'load'}),
    new Promise(x => setTimeout(x, 60000)),
    ]);

    const Image = await page.$('body > div.container-main > div.jscroll > div > div > div > section > div > div > div > div:nth-child(2) > div.lead-img-cont > div > picture > img');
    console.log('screenshot started to get taken');
    const shot=await Image.screenshot({
    path: str,
    omitBackground: true,
    });
    console.log('screenshot taken');
    await browser.close();



}
client.end()
});

})();

Answer 1

You have passed a function to client.query and your await calls are in that function, so you need to make that function async.

 client.query("SELECT DISTINCT url,article_id FROM public.content_paraarticle", 
               async (err,res,fields) => {
               // your await calls 
              }