Можно ли использую Promise в then вкладывать повторное обращения к URL?

Question

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

request(url)
      .then( data => {
         const ingredient = data.ingredients[0]
         ingredientDescription.innerHTML = ingredient.strDescription;
         const name = ingredient.strIngredient;
         console.log(name)
         const url = `https://www.thecocktaildb.com/api/json/v1/1/filter.php?i=${name}`;
         
         `request(url)
            .then( data => {
               console.log(data)
            })`
      })

У меня есть функция request которая возвращает промис, далее мне нужно сделать запрос на url, для того чтобы получить некоторую информацию информация выводится в модальное окно. Далее на основе этой информации мне нужно взять определенные данные и уже по ним вывести доп.информацию в то же модальное окно.

Вопрос можно ли делать вот такую вложенность как у меня сейчас? То есть вызывать функцию request внутри then.

Answer 1

const api_ingredient_url = 'https://www.thecocktaildb.com/api/json/v1/1/lookup.php?iid=552';
const api_ingredient_info_url = 'https://www.thecocktaildb.com/api/json/v1/1/filter.php?';

const request = fetch;
        
(async () => {
    try {
        const response_ingredient = await request(api_ingredient_url);
        const data = await response_ingredient.json();

        const ingredient = data.ingredients[0];        
        //ingredientDescription.innerHTML = ingredient.strDescription;

        const name = ingredient.strIngredient;
        console.log(name)

        const params = new URLSearchParams({ i: name });
        const response_ingredient_info = await request(api_ingredient_info_url + params.toString());
        const ingredients = await response_ingredient_info.json();
        
        console.log(ingredients);
    } catch (e) {
        console.log(e.message);
    }
})();

Answer 2

Коллбэк переданный в .then может возвращать Promise, поэтому указанный вызов request внутри then вполне допустим, однако, не обязательно делать вложенный then, его вполне можно добавить в цепочку:

request(url)
  .then( data => {
     const ingredient = data.ingredients[0]
     ingredientDescription.innerHTML = ingredient.strDescription;
     const name = ingredient.strIngredient;
     const url = `https://www.thecocktaildb.com/api/json/v1/1/filter.php?i=${name}`;
     return url;
  }).then ( request )
    .then( data => {
       console.log(data);
    })

БЛОГ НА HUSL

Можно ли использую Promise в then вкладывать повторное обращения к URL?

Ответы (2 шт):