Is is possible to have fetch wait for a redirect?

user_8827205 0
Viewed 574

I'm currently working on dynamically scraping a webpage from a web extension and am using the following code:

let url = "https://lykdat.com/search-result/?image_url=https://anf.scene7.com/is/image/anf/KIC_330-2455-0904-476_prod1?$product-hol-v1$&wid=800&hei=1000";

fetch(url,{redirect: 'follow'}).then(r => r.text()).then(result => {
  console.log(result);
  var el = document.createElement( 'html' );
  el.innerHTML = result;
  // console.log(typeof(tempPage));
  console.log(el);
  tempImgs = el.getElementsByTagName('img');
  console.log(tempImgs);
})

I want to be able to change any text that comes after the "image_url=" in order to change which image is being plugged into the website. Unfortunately, the page that I am trying to pull information from comes after a brief loading period so using the "fetch" function only pulls information from the loading screen, and not the actual page that I want. The redirect is not instantaneous and can take anywhere between 3-30 seconds and I was wondering if there was any way to force fetch to wait for that redirect before scraping data. Thanks so much for any help you can offer!

google-chrome-extension fetch javascript
1 Answers

Use await, you need your function to be an async one for this to work.

async function YourFunctionName (){
  let url = "https://lykdat.com/search-result/?image_url=https://anf.scene7.com/is/image/anf/KIC_330-2455-0904-476_prod1?$product-hol-v1$&wid=800&hei=1000";

  var promise = await fetch(url,{redirect: 'follow'}).then(r => r.text()).then(result => {
  console.log(result);
  var el = document.createElement( 'html' );
  el.innerHTML = result;
  // console.log(typeof(tempPage));
  console.log(el);
  tempImgs = el.getElementsByTagName('img');
  console.log(tempImgs);
})
}

YourFunctionName();
user_126205410
Related