JS 节点获取无法从获取承诺中获取数据

问题描述

我想通过 node-fetch 从维基百科 api 中获取数据。不幸的是，我无法在我的 fetch-Promise-Chain 之外设置一个变量。我想将此变量传递给渲染页面以填写表单。如果我 consle.log 在 fetch() 内部，一切都会按我预期的那样工作。

我对此很陌生，我承认我不了解 Promise 是如何工作的，也不了解如何在此主题上进行练习。

    const fetch = require('node-fetch');

exports.search = (req,res) =>{
  console.log('going to search...' + req.query.eventSearchbar);
  
  let searchterm = req.query.eventSearchbar;
  let wikiDescription = 'Test';
  
  const wikiAPI = "https://en.wikipedia.org/w/api.PHP";
  let searchURL = new URL(wikiAPI)
  searchURL += "?origin=*&action=query&list=search&srlimit=1&format=json&srprop=snippet&srsearch=";
  searchURL += encodeURIComponent(req.query.eventSearchbar);
  console.log(searchURL);

  fetch(searchURL)
    .then(res => res.json())
    .then(json => json.query.search)
    .then(array => array[0].snippet)
    .then(snippet => {
      wikiDescription  = snippet;
    })
    .catch(err => console.log(err))

  res.render('search',{searchterm: searchterm,wikiDescription: wikiDescription });
}

解决方法

您需要等待提取才能使其按预期工作。

当您的 JS 代码通过网络执行 Ajax 请求以从服务器获取数据时，您需要在函数中设置响应代码（也称为回调）。 JS 引擎基本上告诉托管环境他暂时将暂停执行，当网络响应返回时，请通知我并执行该回调函数。

因此，在您的示例中，您正在通过 fetch 发出异步请求。响应将在您完成后的某个时间得到，但如果您不等待该电话，

res.render('search',{searchterm: searchterm,wikiDescription: wikiDescription });

肯定会在你得到结果之前发生。

最终结果：

exports.search = async (req,res) =>{
  console.log('going to search...' + req.query.eventSearchbar);
  /**
   * let's build our search query for basic pageinformation
   */
  let searchterm = req.query.eventSearchbar;
  let wikiDescription = 'Test';
  // where we are going to look...
  const wikiAPI = "https://en.wikipedia.org/w/api.php";
  // let's build aóur search url
  let searchURL = new URL(wikiAPI)
  searchURL += "?origin=*&action=query&list=search&srlimit=1&format=json&srprop=snippet&srsearch=";
  searchURL += encodeURIComponent(req.query.eventSearchbar);
  console.log(searchURL);
  //fetch some data from wikipedia
  await fetch(searchURL)
    .then(res => res.json())
    .then(json => json.query.search)
    .then(array => array[0].snippet)
    .then(snippet => {
      wikiDescription  = snippet;
    })
    .catch(err => console.log(err))

  res.render('search',wikiDescription: wikiDescription });
}

javascript node-fetch