javascript – 需要先前调用响应的多个AJAX API调用的最佳实践？

我正在开发一个内部页面,允许用户上传包含资源和日期的CSV,并让页面将这些资源的所有计划信息添加到我们的管理软件中.有一个相当不错的API来做这个,我有一个工作模型,但它似乎… cludgy.

对于每个资源,我必须开始一个新会话,然后创建一个新的预订,然后添加资源,然后确认预订没有被阻止,然后提交预订.大多数调用都会返回我在下一步中需要的变量,因此每个调用都依赖于之前的ajax调用.

目前我通过嵌套的ajax调用这样做：

$.ajax('startnewsession').then($.ajax('createreservation').then('etcetc'))

虽然这是有效的,但我觉得必须有一种更简单,或更“适当”的方式来做到这一点,无论是为了更清晰的代码还是为了适应性.

解决方法

假设您无法更改正在与之通信的API,那么您所做的是正确的.

如果您需要前一个响应数据用于下一个响应数据,那么实际上无法绕过必须进行某种嵌套的ajax调用.然而,承诺(.then)使得它比回调更加漂亮.

正确的解决方案(如果可能的话)当然是以这样的方式实现您的API,即从客户端到服务器需要更少的往返.考虑到在创建预留的协商过程中,每个步骤之间没有用户输入,您的API应该能够完成整个流程以创建预留,而无需联系客户端,直到需要来自用户的更多输入.

只需记住在每个ajax调用之间进行一些错误处理,以防它们发生故障 – 您不希望开始使用先前失败的请求中的损坏数据创建后续API调用.

var baseApiUrl = 'https://jsonplaceholder.typicode.com';
$.ajax(baseApiUrl + '/posts/1')
  .then(function(post) {
    $.ajax(baseApiUrl + '/users/' + post.userId)
      .then(function(user) {
        console.log('got name: ' + user.name);
      },function(error) {
        console.log('error when calling /users/',error)
      });
  },function(error) {
    console.log('error when calling /posts/',error)
  });