Render jade page after long node process

Question

I am collecting data from Stripe API and I have a lot of products in my product list (10,000+ products)

I am trying to do some simple data collection and present my product ID's using a jade template only once all the ID's have been collected and stored in an array.

Heres my server-side code:

router.get('/getall', asyncHandler(async(req,res,next) => {
  var allIds = [];
  var id = ''
  var count = 0;
  for await (const product of stripe.products.list( {type: 'service'} )) {
      count++;
      id = product.id
      allIds.push(quotedText);
      console.log(id);
      console.log(count);
  }
  res.render('list.jade', { title: 'Express', data: allIds });

}));

list.jade

block content
  h1= title
  p Welcome to #{title}
  ul
    each id in data
        li= id

Once all of the Id's have been retrieved, the jade template isn't sent. All I see on my browser is "This page isn’t working localhost didn’t send any data."

I was wondering if this was a result of the process taking too long? How do I go about making sure that it waits until I am done collecting the IDs to and reload the data?

Answer 1

Check in development tools (network tab) and see if the request is timing out?

You can change the node http server timeout by using

app.post('/getall', function (req, res) {
   req.setTimeout(5*60*1000); 
});

In this situation, I highly recommend rendering the page without the data, and then using an AJAX (XMLHttpRequest) to fetch the data after the page has loaded. (it provides a better user experience because the user knows it is loading something long if you make the ui say so, too)