Cześć,

chciałbym pobrać w JS dane z API podzielonego na "n-podstron" (całkowita liczba podstron nieznana/zmienna) tak żeby pokazać wszystko w jednej tabeli.

Myślałem żeby wywołać

fetch('https://api.github.com/orgs/someOrgs/repos?page=0')

w pętli do...while i podstawiać zmienną do ?page=pageCount

i łączyć tablice ale z tego co wiem nie da się w pętli (synchroniczna) wywoływać zapytań asynchronicznych.

Szukałem jakiegoś rozwiązania (Google/Stack) ale jakiegoś konkretnego nie znalazłem. Wywnioskowałem że można użyć Promise.all.

Macie może jakąś podpowiedź/linka?

Pozdrawiam

Zapytania w pętli wykonają się po kolei, ale odpowiedzi możesz uzyskać w różnej kolejności.
Otrzymując wynik danej podstrony wstawiaj go po prostu w blok przypisany do niego. Kolejność wtedy nie będzie mieć znaczenia.

Hej,

zakodowałem coś takiego. Kod działa i spełnia swoją funkcję ale nie jestem w stanie stwierdzić czy to co on robi jest zaprogramowane w poprawny (optymalny) sposób. Wydaje mi się że nie i trzeba w ogóle inaczej podejść do tego zagadnienia tzn. iterowania po podstronach API JSON.

Moglibyście coś napisać o tym kodzie/podejściu?

[HTML] pobierz, plaintext 
componentDidMount() {
    var dataUrl = 'https://api.github.com/orgs/angular/members';    
    fetch(dataUrl)
    .then(response => response.headers.get('Link'))
    .then(pagesData => {
      var parsedPages = parse(pagesData);
      var pageIterations = parseInt(parsedPages.last.page, 10);
 
      //pętla podstron JSON
 
      var allMembersData = [];
      for (var i=1; i <= pageIterations; i++) {
        var membersUrl = 'https://api.github.com/orgs/angular/members?page='+i;
        fetch(membersUrl)
        .then(response => response.json())
        .then(membersData => {
          allMembersData = allMembersData.concat(membersData);
          this.setState({
            data: allMembersData
          });
        })
 
      } //koniec pętla podstron JSON
    })
  }
[HTML] pobierz, plaintext