возвращая пустой JSON, даже если он не пустой

Question

Я пытаюсь вернуть json моему клиенту реагирования со списком песен (объектов). Но он возвращает пустой массив как json. Вот как я получаю данные.

let songs = [];
  fetch("https://api.spotify.com/v1/me/tracks", {
    method: "GET",
    headers: {
      Authorization: "Bearer " + req.user.accessToken
    },
    json: true
  })
    .then(res => res.json())
    .then(apiResponse => {
      let limit = apiResponse.limit;
      for (let i = 0; i < limit; i++) {
        Song.findOrCreate({
          where: {
            name: apiResponse.items[i].track.name,
            song_spotify_id: apiResponse.items[i].track.id,
            album: apiResponse.items[i].track.album.name,
            popularity: apiResponse.items[i].track.popularity,
            track_number: apiResponse.items[i].track.track_number,
            uri: apiResponse.items[i].track.uri
          }
        }).then(song => {
          songs.push(song);
        });
      }
    })
    .catch(function(error) {
      return {
        type: "ERROR ON FETCH",
        api_response: { success: false }
      };
    });

  console.log("songs: *********************" + songs);
  res.status(200).json(songs);
});

Это моя реакция api fetch:

const requestMySongs = async () => {
  const data = await fetch("/mysongs").catch();
  console.log(data);
  const jsoned = await data.json();
  console.log(jsoned);
  let five = [];
  // only 5 songs
  for (let i = 0; i < 5; i++) {
    five.push(jsoned[i]);
  }
  console.log(five);
  return five;
};

Когда я консольный журнал jsoned, появляется следующее:

[]

Что странно, у меня было две версии. Одна версия - эта, которая запрашивает API Sittify только для 20 песен. Моя другая версия почти точно такая же, только она зацикливается и запрашивает весь список песен (получает 50, сохраняет 50, запрашивает spotify для еще 50 и т. Д.), И эта другая версия работает. Код точно такой же, но проблема была в том, что он долго загружался, поэтому я попытался упростить его, но он не работает.

Я ценю любую предоставленную помощь.

Answer 1

Это потому, что вам нужно подождать все обещания, прежде чем отправлять свой ответ.

На самом деле вы отправляете ответ, но процесс запроса внутри вашей базы данных еще не запущен.

let songs = [];
  fetch("https://api.spotify.com/v1/me/tracks", {
    method: "GET",
    headers: {
      Authorization: "Bearer " + req.user.accessToken
    },
    json: true
  })
    .then(results => results.json())
    .then(apiResponse => {
      let limit = apiResponse.limit;
      let promises = [];

      for (let i = 0; i < limit; i++) {
        const myPromise = new Promise((resolve, reject) => {
        Song.findOrCreate({
          where: {
            name: apiResponse.items[i].track.name,
            song_spotify_id: apiResponse.items[i].track.id,
            album: apiResponse.items[i].track.album.name,
            popularity: apiResponse.items[i].track.popularity,
            track_number: apiResponse.items[i].track.track_number,
            uri: apiResponse.items[i].track.uri
          }
        }).then(song => {
          songs.push(song);
          resolve(true)
        });
        });

        promises.push(myPromise);
      }

      Promise.all(promises)
      .then(() => {
          console.log("songs: *********************" + songs);
          res.status(200).json(songs);
      });

    })
    .catch(function(error) {
      return {
        type: "ERROR ON FETCH",
        api_response: { success: false }
      };
    });

});