fetch an array of urls and get data [duplicate]

Question

i have an array of urls and i'm trying to get and display the status for every specific website inside a list. Any ideas for the best approach in react?

const URL = [
  {
    name: 'site1',
    url: 'https://something'
  },
  {
    name: 'site2',
    url: 'https://something'
  },
  {
    name: 'site3',
    url: 'https://something'
  }

]

Welcome to Stack Overflow! Please read through the help center, in particular How do I ask a good question? Your best bet here is to do your research, search for related topics on SO, and give it a go. If you get stuck and can't get unstuck after doing more research and searching, post a minimal reproducible example of your attempt and say specifically where you're stuck. People will be glad to help. — T.J. Crowder
– T.J. Crowder, Commented Sep 27, 2019 at 10:08
"i'm trying to get and display the status for every specific website inside a list" Note that unless all of those websites allow you to query them cross-origin via CORS (unlikely, but if you control them, possible), you can't do this purely client-side. You'll need to make the request to your server, which can query those sites, then send you the response. More: SOP. — T.J. Crowder
– T.J. Crowder, Commented Sep 27, 2019 at 10:10
Hi T.j, thanks for the feedback. in this case i can control them. — sleepwalker127
– sleepwalker127, Commented Sep 27, 2019 at 10:20

nitinsingh9x · Accepted Answer · 2019-09-27 10:18:43Z

-1

You just need to do loop over list with map operator, below is the stackbliz example which may help you. https://stackblitz.com/edit/array-map-bjaytm?file=index.js

answered Sep 27, 2019 at 10:18

nitinsingh9x

7067 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

sleepwalker127 Over a year ago

thanks for that. i want something like this. but i want to retrieve the status that's inside the object of the webpage response. {"status":"UP"}. that's where i'm blocked...

nitinsingh9x Over a year ago

you should fetch the result before you show that on UI

Kiren Paul · Accepted Answer · 2019-09-27 10:34:31Z

-1

Please use the Promises.all.The Promise.all() method returns a single Promise that resolves when all of the promises passed as an iterable have resolved or when the iterable contains no promises

 const urls = [{ name: 'site1', url: 'https://something' },
{ name: 'site2', url: 'https://something' },
{ name: 'site3', url: 'https://something' }];

Promise.all(urls.map(item => fetch(item.url)
.then(res => res.json()).catch((ex) => ex)))
.then((values) => console.log(values));

edited Sep 27, 2019 at 10:34

answered Sep 27, 2019 at 10:18

Kiren Paul

911 silver badge12 bronze badges

Collectives™ on Stack Overflow

fetch an array of urls and get data [duplicate]

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related