javascript - 使用 Axios 克服 Pending Promise 并在 Node.js 中完成 JSON 构建

Question

我正在尝试构建一个 JSON通过连续制作文件 HTTP requests与 Axios :

1. 获取对象(项目)数组
2. 在名为任务的每个项目中创建一个数组属性
3. 获取每个项目的任务
4. 将每个项目的任务推送到其任务属性中(即在每个项目对象中填充该数组)
5. 创建 JSON从修改后的项目数组中提取文件

代码:

let getProjects = function() {
  try {
    return axios.get('https://app.asana.com/api/1.0/projects/').then(response => { return response } )
  } catch (error) {
    console.error(error)
  }
}

let getTasks = function(project) {
  try {
    return axios.get('https://app.asana.com/api/1.0/projects/'+project+'/tasks').then(response => { return response } )
  } catch (error) {
    console.error(error)
  }
}

function getAsanaData() {
  return getProjects()
    .then(function(result) {
      let projects = []
      for(let project of result.data.data){
        project.tasks = []
        project.tasks.push(getTasks(project.gid))
        projects.push(project)
      }
      return projects;
    })
}

Promise.try(() => {    
    return getAsanaData();
}).then((result) => {
    console.log(util.inspect(result, {showHidden: false, depth: null}))
    var asanaData = JSON.stringify(result);
    fs.writeFile("thing.json", asanaData);
});

日志结果是这样的:

[ { id: 35534235917762,
    gid: '35534235917762',
    name: 'History+',
    resource_type: 'project',
    tasks: [ Promise { <pending> } ] },
  { id: 35583453238038,
    gid: '35583453238038',
    name: 'NRG - AccountingSeed Phase 2',
    resource_type: 'project',
    tasks: [ Promise { <pending> } ] },
]

注意 Promise { <pending> } 的持久性.

JSON 是这样的:

[
  {
    "id": 35534235917762,
    "gid": "35534235917762",
    "name": "History+",
    "resource_type": "project",
    "tasks": [
      {}
    ]
  },
  {
    "id": 35583453238038,
    "gid": "35583453238038",
    "name": "NRG - AccountingSeed Phase 2",
    "resource_type": "project",
    "tasks": [
      {}
    ]
  }
]

注意空任务属性。

看来我非常接近实现一个完整的 JSON ，但我花了很多时间试图通过未决的 promise最后添加缺失的数据。

我需要做什么？

Answer 1

问题是 getTasks是异步的，所以只需调用 getTasks在for loop 不会等待 Promises 解决。要等待所有这些都解决，请使用 Promise.all在这些 Promise 的数组上，然后当 that 解析时，您可以将结果分配给 project.tasks :

function getAsanaData() {
  return getProjects()
    .then((result) => {
      const projects = result.data.data;
      const taskPromises = projects.map((project) => {
        return getTasks(project.gid)
          .then((task) => {
            project.tasks = [task];
          });
      });
      return Promise.all(taskPromises)
        .then(() => projects);
  });
}

另请注意，一个被拒绝的 Promise不会被困在 try 中/catch block :

try {
  new Promise((_, reject) => setTimeout(reject, 1000))
} catch(e) {
  console.log('error caught');
}

而不是 try/catch , 正确的捕捉方法 Promise错误(当您不使用 await 时)是链接 .catch Promise 末尾的处理程序链:

const getProjects = function() {
  return axios.get('https://app.asana.com/api/1.0/projects/')
    .catch((error) => console.error(error));
}

但是.catch结果为 Promise chain resolving，而不是 rejecting，这意味着当函数被调用时，结果 Promise将 解析为一个值 ( undefined ) 而不是拒绝，这可能不是您想要的 - 如果您在 caller< 中发现错误，您可能会发现控制流更容易处理/em> 函数的替代:

return Promise.all(taskPromises)
  .then(() => projects);
  .catch((err) => {
    console.log(err);
  });

还有一点需要注意的是 .then比如

.then(response => { return response } )

完全多余 - 现有的 Promise已经解析为 response .链接另一个 Promise进入接收输入并再次输出的末端没有做任何有用的事情 - 随意完全离开它。