Как получить окончательный объект JSON из ответа с помощью promise.all? - PullRequest
1 голос
/ 10 ноября 2019

Я использую обещание. Все, чтобы пойти и получить три конечные точки.

Обещание: обещание возвращает мне массив ответов, который выглядит следующим образом:

0: Response {type: "basic", url: "https://cdpn.io/boomboom/v2/af3910a6-429f-4c74-9ad5-dfe1c4aa04f2", redirected: false, status: 403, ok: false, …}
1: Response {type: "basic", url: "https://cdpn.io/boomboom/v2/6bc92fdd-b0f4-4286-ad71-1f99fb4a0d1e", redirected: false, status: 403, ok: false, …}
2: Response {type: "basic", url: "https://cdpn.io/boomboom/v2/f25fa661-3073-414d-968a-ab062e3065f7", redirected: false, status: 403, ok: false, …}

Но я не могуполучить действительный JSON этих конечных точек, я всегда в конечном итоге с массивом больше обещаний.

Часть кода, где у меня возникла проблема, находится в нижней части функции, а массив ответов сохраняется впеременная с именем: linksToSpecieResponses

Я попытался отобразить массив ответов и использовать .json (), а также их после этого, например:

linksToSpecieResponses.forEach( response => response.json().then( x => results.push(x) ))

Но это не работает.

Любые идеи, что мне нужно сделать, чтобы получить фактический JSON этих ответов?

Вот код в codepen: https://codepen.io/giorgiomartini/pen/OJJzKoM?editors=0010

И это код:

const TITLE = 'Princess Mononoke'
const SPECIE = 'God'
const SOECIES_URL = 'htps://ghibliapi.herokuapp.com/species/b5a92d0e-5fb4-43d4-ba60-c012135958e4'

async function getMoro(url) {
  const moviesResponse = await fetch(url)
  const movies = await moviesResponse.json()
  const movie = movies.find(movie => movie.title === TITLE)

  const speciesOfMoviePromises = movie.species.map(async url => await fetch(url))
  const speciesOfMovieResponses = await Promise.all(speciesOfMoviePromises)

  let speciesLinks = []
  for(let i = 0 ; i<speciesOfMovieResponses.length ; i++){
   speciesLinks.push( await speciesOfMovieResponses[i].json() )
  }

  const linksToSpecie = speciesLinks.map(async x =>  await fetch(x.id))
  const linksToSpecieResponses = await Promise.all(linksToSpecie)
  // What should i do with this array of promises?
  console.log('linksToSpecieResponses: ', linksToSpecieResponses)

  return await linksToSpecieResponses
}

getMoro('https://ghibliapi.herokuapp.com/films')
...