Несколько запросов к API с помощью axios / Vue.js, советы, как делать вещи умнее

Во-первых: я новичок в Vue.js / API, поэтому надеюсь, что мой вопрос не слишком глуп (возможно, я не вижу очевидного) :)

Итак, используя Vue.js, я подключаюсь к этому API и хочу отслеживать история каждой криптовалюты (нет проблем с получением данных из API). Информация о валютах доступна по URL-адресу: https://api.coinranking.com/v2/coins А история доступна с помощью другого: https://api.coinranking.com/v2/coin/ID_OF_THE_COIN/history

Как видите, для второго URL-адреса требуется идентификатор конкретной валюты, доступной в первом.

Я хотел бы найти способ сделать только 1 запрос на получение для всех валют и их истории, вместо того, чтобы делать столько запросов, сколько есть доступных валют (около 50 в этом API), я пробовал несколько вещей, но ни один из них не работал пока (например, используя URL-адрес монеты и сохраняя идентификаторы валют в таблице, затем используя URL-адрес истории и изменяя его идентификаторами таблицы, но упираясь в стену).

Вот запрос на получение axios, который у меня есть на данный момент для одной валюты:

const proxyurl = "https://cors-anywhere.herokuapp.com/"
const coins_url = "https://api.coinranking.com/v2/coins"
const history_url = "https://api.coinranking.com/v2/coin/Qwsogvtv82FCd/history"

//COINS DATA
       axios
       .get(proxyurl + coins_url, { 
           reqHeaders
       })
       .then((reponseCoins) => {
           // console.log(reponseCoins.data)
           this.crypto = reponseCoins.data.data.coins;
       })
       .catch((error) => {
           console.error(error)
       })

//GET ALL COINS UUIDs
       axios
       .get(proxyurl + coins_url, { 
           reqHeaders
       })
       .then((reponseUuid) => {
           this.cryptoUuidList = reponseUuid.data.data.coins;
           //access to each crypto uuid:
           this.cryptoUuidList.forEach(coinUuid => {
               console.log("id is: " + coinUuid.uuid)
               //adding uuids to table:
               this.coinsUuids.push(coinUuid.uuid);
           });
       })
       .catch((error) => {
           console.error(error)
       })

// COIN HISTORY/EVOLUTION COMPARISON
       axios
       .get(proxyurl + history_url, { 
           reqHeaders
       })
       .then((reponseHistory) => {
           //get data from last element
           const history = reponseHistory.data.data.history
           this.lastItem = history[history.length-1]
           // console.log(this.lastItem)
           this.lastEvol = this.lastItem.price
           // console.log(this.lastEvol)

           //get data from previous element:
           this.previousItem = history[history.length-2]
           this.previousEvol = this.previousItem.price
       })
       .catch((error) => {
           console.error(error)
       })

Я, наверное, забыл дать некоторую информацию, так что дайте мне знать и с радостью поделюсь, если смогу

ваше здоровье,


person jerephens    schedule 02.12.2020    source источник


Ответы (1)


Я взглянул на API, они, похоже, не дают вам возможности получить все, что вам нужно, в одном запросе, поэтому вам придется получать историю каждой монеты отдельно.

Тем не менее, я вижу ключ sparkline в возвращаемых данных с некоторыми из последних цен.

Я не знаю особенностей ваших проектов, но, возможно, вы могли бы использовать это для своего начального экрана (например, списка монет) и получать полную историю из API только тогда, когда кто-то щелкает, чтобы увидеть детали монеты.

person anpel    schedule 03.12.2020
comment
Спасибо, что подтвердили то, чего я опасался ... Собственно, я к этому и собираюсь, я проверю данные, о которых вы говорите. Спасибо ! - person jerephens; 03.12.2020
comment
@jerephens Если вы собираетесь это сделать, я думаю, вам подойдет только один запрос. Пожалуйста, подумайте о том, чтобы проголосовать за и / или принять этот ответ, если он вам поможет! - person anpel; 03.12.2020
comment
У меня менее 15 репутации, поэтому я не могу голосовать ни за, ни за. Также, если окажется, что это решение, я, конечно, приму ответ;) - person jerephens; 03.12.2020
comment
Кстати, вы можете объяснить, что вы подразумеваете под ключом спарклайна в возвращаемых данных? Где ты это видел? ваше здоровье, - person jerephens; 03.12.2020
comment
В /v2/coins для каждой монеты есть ключ sparkline. Отметьте data.coins[0].sparkline. - person anpel; 04.12.2020
comment
Да, я пошел проверить и действительно увидел, я буду использовать это, и он должен работать нормально. Просто полностью пропустил. Спасибо! - person jerephens; 05.12.2020
comment
@jerephens Рад помочь! - person anpel; 06.12.2020