将异步 axios API 调用的值返回给变量 [重复]

Question

对于之前已经回答了很多次的看似愚蠢的问题，我确实提前道歉，但是我只是无法确切地了解如何完成我正在尝试做的事情，我一直兜兜转转几个小时现在一遍又一遍地重写相同的代码。

我是任何类型的编程的初学者（除了一些 SQL 争吵和一些狡猾的 VBA 东西）并且发现如果没有我想要解决的特定问题很难学习。我已经完成了一些基本的 javascript 课程，所以我知道基本语法。

我想要做的是使用 axios 发出 GET 请求以从 api 获取一些数据，并使用它响应的数据来设置我随后用于在屏幕上显示的变量的值。

基本上我想要做的是（在 nodejs .js 脚本中）：

• 从 GET api 调用中获取数据
• 从该数据中获取一个值以进行第二次 GET API 调用
• 使用第二次调用的数据放入我可以在函数中使用的变量

目前我被困在第一个障碍，这是我到目前为止所拥有的（有效）：

const queryData = '123456';

const getLink = async () => {
  try {
    const resp = await axios.get(`https://www.apisite.com/${queryData}`);
    return resp.data;
  } catch (err) {
    console.error(err);
  }
};

getLink().then(console.log);

这确实做了一些事情，控制台填充了 API 返回的对象

我很困惑的是如何将这些数据放入我的变量中以在屏幕上使用。 基本上我想在这里做的是

let myObject = getLink();

然后我想使用该对象的其余部分，这样我就可以拥有：

let title = myObject.title;
let desc = myObject.description;
let user = myObject.user;

等等

这就是我被卡住的地方，因为我似乎无法找到一种方法来“获取数据”可以这么说。我已经尝试过有关添加新异步函数、将其包装为 IIFE 的建议，但我无法弄清楚答案是什么。

任何帮助（尽可能使用基本概念）将不胜感激。

@Bergi - 我要调用的函数在这里。但是我实际上并没有使用此功能进行测试，我只是从一个空项目中进行此操作，以查看是否可以使基础知识正常工作，因此我不必担心其他事情会混淆问题。我目前正在尝试在任何功能之外对其进行测试，只是想确切地了解如何获取数据以实现它。如果我能让它工作，下面是我会尝试的虚构版本，但它很可能充满了错误，因为我实际上并没有尝试运行它，我这样做纯粹是为了展示我正在尝试的内容要做的事：

testing = function(tokens, idx, options, env, self) {
  const token = tokens[idx];
  if (token.info !== 'isbn') return defaultRender(tokens, idx, options, env, self); //checks for 'isbn' code fence token

  const elementId = 'isbn_target_' + Math.random() + '_' + Date.now();
  const element = document.createElement('div');

  let html = '';

  try {
    element.setAttribute('id', elementId);
    element.style.display = 'none';
    document.body.appendChild(element);

    //let queryData = token.content.trim(); 

    const queryData = '123456';

    const getLink = async () => {
      try {
        const resp = await axios.get(`https://www.apisite.com/${queryData}`);
        return resp.data;
    } catch (err) {
      console.error(err);
    }
  };

  let queryResponse = getLink();
  let title = queryResponse.title;

    html = '<div style="background-color: white;">' + title + '</div>';
  } catch (error) {
    console.error(error);
    return '<div style="border: 1px solid red; padding: 10px;">Could not render preview: ' + htmlentities(error.message) + '</div>';
  } finally {
    document.body.removeChild(element);
  }

  return html;
};

Answer 1

因为getLink() 是async，所以它返回一个Promise。

在 Node v14.18.0 及更高版本中，您可以简单地 await 它：

let myObject = await getLink();

如果您运行的是先前版本的 Node，您可以将代码包装在匿名 async 函数中：

(async () => {
    let myObject = await getLink();
    let title = myObject.title;
    let desc = myObject.description;
    let user = myObject.user;
})();

虽然超出了您在此处提出的问题范围，但您也可以考虑通过使用 Destructuring assignment 来分配您的值来减少代码的详细程度：

let myObject = await getLink();
let {title, 'description': desc, user} = myObject;