异步等待无法正常运行

Question

所以我在我的客户端应用程序中显示 instagram 帖子。 Instagram 不允许在浏览器中运行的客户端应用程序直接查询其 API。 所以我设置了一个 node.js 服务器来获取图像 url，将它们转换为 base64 编码格式并将这个 output 传递给我的客户端应用程序。

这是我的服务器代码。 您可以看到我获取了与指定主题标签变量值匹配的所有 instagram 帖子。 我知道这个查询运行成功。 在响应的正文中，每个帖子（我按照 Instagram 的 API 约定将这些“边缘”称为）都包含一个名为 thumbnail_src 的嵌套参数。 这是指向图像的 url。 In my map function, I pass this url into a second function called convertURLToBase64 that should do what the name of the function indicates.

但是，我的回答是空的。 到底是怎么回事？ 我该如何解决？ async/await 和 promise 很棘手。 谢谢

async function getHashTaggedPosts(hashtag) {
  url = "https://www.instagram.com/explore/tags/" + hashtag + "/?__a=1";
  return await axios.get(url, { headers: { Authorization: AuthStr } }).then(
    async (response) => {
      let edges = response.data.graphql.hashtag.edge_hashtag_to_media.edges;
      updatedEdges = edges.map(async (edge) => {
        edge.imageBase64 = await convertURLToBase64(edge.node.thumbnail_src);
        return edge;
      })
      console.log('updatedEdges: ' + updatedEdges);
      return updatedEdges;
    },
    (error) => {
      console.log("error: " + error.message);
    }
  );
}

async function convertURLToBase64(url) {
  console.log('converting URL ' + url + ' to base64');
  await request.get(url, async function (error, response, body) {
    if (!error && response.statusCode == 200) {
      console.log('there was no error receiving image');
      data = "data:" + response.headers["content-type"] + ";base64," + Buffer.from(body).toString('base64');
      // console.log(data);
      return data;
    }
  });
}

Answer 1

使用回调，承诺 ansyc/await 您正在混合三种不同的技术来处理 asyc 代码，这始终不是一个好主意。

正如已经指出的那样，在getHashTaggedPosts中，您将await和.then混合在一个语句中，我将对其进行重写以坚持一种单一的语法。

此外，您正在使用带有异步回调的数组.map function ，这意味着它将返回承诺而不是您期望的实际值。 这里你也需要重写这部分。 如果你想坚持.map function，你可以使用Promise.all 。

然后在convertURLToBase64中，您正在等待request.get方法，该方法似乎使用回调，因此它不会返回您可以等待的 promise。 相反，您从带有return data; 但这不会在任何地方收到。 根据经验，永远不要从回调中返回任何内容。

我无法测试您的代码，但请尝试类似这样的操作：

    async function getHashTaggedPosts(hashtag) {
      try {
        url = "https://www.instagram.com/explore/tags/" + hashtag + "/?__a=1";
        const response = await axios.get(url, {
          headers: { Authorization: AuthStr },
        });
        const edges = response.data.graphql.hashtag.edge_hashtag_to_media.edges;
        const updatedEdges = await Promise.all(
          edges.map(async (edge) => {
            edge.imageBase64 = await convertURLToBase64(edge.node.thumbnail_src);
            return edge;
          })
        );
        console.log("updatedEdges: " + updatedEdges);
        return updatedEdges;
      } catch (error) {
        console.log("error: " + error.message);
      }
    }
    
    function convertURLToBase64(url) {
      console.log("converting URL " + url + " to base64");
      return new Promise((res, rej) => {
        request.get(url, function (error, response, body) {
          if (error || response.statusCode != 200) {
            rej("Ups!");
            return;
          }
          console.log("there was no error receiving image");
          data =
            "data:" +
            response.headers["content-type"] +
            ";base64," +
            Buffer.from(body).toString("base64");
          // console.log(data);
          res(data);
        });
      });
    }