Попытка выполнить внешний вызов API, затем вставить данные в базу данных mongo и затем отобразить полученную запись в шаблоне.

Question

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

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

Код запускает вызов API, возвращает данные и даже вставляет в БД, но не будет отображать шаблон после (у меня изначально был его рендеринг с ответом API, но я хочу, чтобы при рендеринге был присоединен идентификатор БДк шаблону).Я уверен, что это как-то связано с обещаниями.Я попытался с обратными вызовами безуспешно, поэтому попытался с функциями асинхронного / ожидания, и это, похоже, тоже не работает.Опять же, у меня все еще есть проблемы с несколькими обратными вызовами, поэтому я пытался что-то еще.

async function getRecipeData(param) {
  let res = await axios.get("https://api.edamam.com/search?q=" + param + "&app_id=0abb0580&app_key=bc931d03c51359082244df2fa414c487");
  var dataArray = res.data.hits
  return (dataArray);
}

async function insertSearchedRecipes(resArray) {
  let response = await
  Recipe.create({
    name: resArray[i].recipe.label,
    image: resArray[i].recipe.image,
    url: resArray[i].recipe.url
  });
  return response;
};


router.get('/getRecipes/:ingredient', function (req, res) {
  res.redirect("/");
  var params = req.params.ingredient;
  console.log(params);

  let recipeFind = getRecipeData(params);

  recipeFind.then(function (result) {
    console.log(result[0]);
    for (i = 0; i < result.length; i++) {
      var recipeFindCreate = insertSearchedRecipes(result);
    };

    recipeFindCreate.then(function (results) {
      console.log("HELLO")
      // console.log(results);
      res.render("recipeResults", {
        data: results
      });
    });
  });
});

Answer 1

Стандартная ловушка async / await. Значения, возвращаемые функцией, определенной как async ВСЕГДА, вы должны получить по await / then.

Позвонив по номеру recipeFindCreate, вы ждете только последнего, остальные становятся асинхронными.

let _ = [];
for (i = 0; i < result.length; i++) {
   _.push(insertSearchedRecipes(result));
};
let results = await Promise.all(_);

Выполняя рефакторизацию кода, убедитесь, что каждая переменная объявлена ​​в функции.

async function insertSearchedRecipes(resArray) {
  let response = await
  Recipe.create({
    name: resArray.recipe.label, //NOT: `resArray[i]`
    image: resArray.recipe.image,
    url: resArray.recipe.url
  });
  return response;
};
//and:
var recipeFindCreate = insertSearchedRecipes(result[i]); // not `result`

Кроме того, обратите внимание на тему «Массовая вставка / вставка ванны» - добавление ряда данных, выполненного за 1 операцию.

Кстати: попробуйте не использовать var (глобальная область). Лучше использовать let / const