我需要以同步方式进行三次HTTP调用,如何将数据从一个调用传递到另一个调用?

function first()
{
   ajax()
}

function second()
{
   ajax()
}

function third()
{
   ajax()
}


function main()
{
    first().then(second).then(third)
}

我试图将延迟用于两个函数,我想出了一个部分解决方案。 我可以将它扩展为三个功能吗?

function first() {
    var deferred = $.Deferred();
     $.ajax({

             "success": function (resp)
             {

                 deferred.resolve(resp);
             },

         });
    return deferred.promise();
}

function second(foo) {
     $.ajax({
            "success": function (resp)
            {
            },
            "error": function (resp)
            {
            }
        });
}


first().then(function(foo){second(foo)})

===============>>#1 票数:80

在每种情况下,返回$.ajax()返回的jqXHR对象。

这些对象是Promise兼容的,因此可以与.then() / .done() / .fail() / .always()

在这种情况下, .then()就是你想要的那个,就像在问题中一样。

function first() {
   return $.ajax(...);
}

function second(data, textStatus, jqXHR) {
   return $.ajax(...);
}

function third(data, textStatus, jqXHR) {
   return $.ajax(...);
}

function main() {
    first().then(second).then(third);
}

参数datatextStatusjqXHR来自前一个函数中的$.ajax()调用,即。 first() feed second()second() feed third()

DEMO (用$.when('foo')代替$.ajax(...)来兑现履行承诺。

===============>>#2 票数:35

在使用jQuery的promises时,实际上有一种更简单的方法。 看看以下内容:

$.when(
    $.ajax("/first/call"),
    $.ajax("/second/call"),
    $.ajax("/third/call")
    )
    .done(function(first_call, second_call, third_call){
        //do something
    })
    .fail(function(){
        //handle errors
    });

只需将所有调用链接到$ .when(...)调用并处理.done(...)调用中的返回值。

如果您愿意,可以参考以下内容: http//collaboradev.com/2014/01/27/understanding-javascript-promises-in-jquery/

===============>>#3 票数:23

很晚回复,但我猜答案缺少一些直接的链接代码。 链接事件非常简单,在jquery中有promise支持。 我使用以下链接:

$.ajax()
.then(function(){
   return $.ajax() //second ajax call
})
.then(function(){
   return $.ajax() //third ajax call
})
.done(function(resp){
   //handle final response here
 })

它很简单,没有复杂的for循环或多个嵌套的回调。

===============>>#4 票数:14

它比那简单得多。

$.ajax已经返回一个promise(Deferred对象),所以你可以简单地写

function first() {
    return $.ajax(...);
}

===============>>#5 票数:6

你可以用更实用的方式编写它:

[function() { return ajax(...)}, function(data) { return ajax(...)}]
.reduce(function(chain, callback) { 
  if(chain) { 
    return chain.then(function(data) { return callback(data); });
  } else {
    return callback();
  }
}, null)

===============>>#6 票数:4

我在这里找到了一个好看的解决方案: 如何在jQuery 1.8.x中链接一系列延迟函数?

这是我自己的类似方法的实现,有点难看,但可能工作。 它将每个方法的结果作为返回的promise对象的“progress update”进行广播。

  $.chain = function() {
      var defer = $.Deferred();
      var funcs = arguments;
      var left = funcs.length;
      function next(lastResult) {
          if(left == 0) {
              defer.resolve();
              return;
          }
          var func = funcs[funcs.length - left]; // current func
          var prom = func(lastResult).promise(); // for promise will return itself,
                                       // for jquery ojbect will return promise.
          // these handlers will be launched in order we specify them
          prom.always(function() {
              left--;
          }).done(function(ret) {
              defer.notify({
                  idx: funcs.length-left,
                  left: left,
                  result: ret,
                  success: true,
              });
          }).fail(function(ret) {
              defer.notify({
                  idx: funcs.length-left,
                  left: left,
                  result: ret,
                  success: false,
              });
          }).always(function(ret) {
              next(ret);
          });
      }
      next();
      return defer.promise();
  };

如何使用它适合您的情况? 也许不漂亮,但它应该工作:

function first() {
    return ajax(...);
}

var id;

funciton second() {
    return ajax(id, ...);
}

function third() {
    return ajax(id, ...);
}

$.chain(first, second, third).progress(function(p) {
    if(p.func == first)
        id = p.result.identifier;
}).then(function() {
    alert('everything is done');
});

或者您可以从first函数中分配该id变量。

或者,如果您只需要上一个函数的结果,则可以使用以下方法:

function first() {
    return ajax(...);
}
function second(first_ret) {
    return ajax(first_ret.id, ...);
}
function third(second_ret) {
    return ajax(second_ret.something, ...);
}

===============>>#7 票数:1

以下似乎工作,并允许功能列表是动态的:

 <html> <head> <title>demo chained synchronous calls</title> </head> <body> <script src="http://code.jquery.com/jquery-2.2.4.min.js"></script> <script type="text/javascript"> function one(parms) { console.log('func one ' + parms); return 1; } function two(parms) { console.log('func two ' + parms); return 2; } function three(parms) { console.log('func three ' + parms); return 3; } function four(parms) { console.log('func four ' + parms); return 4; } var funcs = ['one', 'two', 'three', 'four']; var rvals = [0]; function call_next_func() { if (funcs.length == 0) { console.log('done'); } else { var funcname = funcs.shift(); console.log(funcname); rvals.push(window[funcname](rvals)); call_next_func(); } } $(document).ready(function($){ call_next_func(); }); </script> </body> </html> 

===============>>#8 票数:1

最好的方法是为此创建一个可重用的函数。 这甚至可以使用reduce只使用一行代码来完成:

function chainPromises(list) {
    return list.reduce((chain, func) => chain ? chain.then(func) : func(), null);
}

此函数接受一个返回promise对象的回调数组,就像你的三个函数一样。

用法示例:

chainPromises([first, second, third]).then(function (result) {
    console.log('All done! ', result);
});

这样的结果first也将自动的参数second ,所以基本上会发生什么情况是这样的:

first().then(function(res1) { return second(res1) })
       .then(function(res2) { return third(res2)  })
       .then(function(result) { console.log('All done! ', result) });

当然,您可以根据需要向阵列添加任意数量的函数。

===============>>#9 票数:-1

链接jquery ajax调用我做了:

function A(){
     return $.ajax({
      url: url,
      type: type,
      data: data,
      datatype: datatype,
      success: function(data)
      {
        code here
      }
    });
   }

   function B(){
     return $.ajax({
      url: url,
      type: type,
      data: data,
      datatype: datatype,
      success: function(data)
      {
        code here
      }
    });
   }

   function C(){
     return $.ajax({
      url: url,
      type: type,
      data: data,
      datatype: datatype,
      success: function(data)
      {
        code here
      }
    });
   }

   A().done(function(data){
     B().done(function(data){
        C();
     })
   });

===============>>#10 票数:-3

我只是遇到了同样的问题,链接了ajax调用。 经过几天的尝试,我终于做了$.ajax({ async: false,...完全按照我想要的方式做了什么。我只是没有想到这一点。它可能会帮助别人......

  ask by John Mcdock translate from so

未解决问题?本站智能推荐: