当一个 ajax 是 SUCCESS 加载下一个答案

【问题标题】：When one ajax is SUCCESS load next当一个 ajax 是 SUCCESS 加载下一个
【发布时间】：2015-02-25 12:35:50
【问题描述】：

我一直在研究一个 jQuery Ajax 队列系统。我有一个逐步生成器。它生成一个pdf，然后一旦生成pdf，就会创建一个图像。一旦这两个过程完成，我就会发送一封电子邮件确认。还必须灵活地添加额外的步骤。

但是，我还没有找到一个有效的例子。他们都使用'COMPLETE'而不是'success'，所以如果我通过json返回错误，那么它会被忽略。它移动到队列中的下一个

有什么想法吗？

编辑

发生的事情相当复杂。

我的插件（从另一个插件复制）

        $.AjaxQueue = function() {
          this.reqs = [];
          this.requesting = false;
        };
        $.AjaxQueue.prototype = {
          add: function(req) {
            this.reqs.push(req);
            this.next();
          },
          next: function() {
            if (this.reqs.length == 0)
              return;

            if (this.requesting == true)
              return;

            var req = this.reqs.splice(0, 1)[0];
            var complete = req.complete;
            var self = this;
            if (req._run)
              req._run(req);
            req.complete = function() {
              if (complete)
                complete.apply(this, arguments);
              self.requesting = false;
              self.next();
            }

            this.requesting = true;
            $.ajax(req);
          }
    };

我还写了一个函数来加速我的代码

function createQueue(file, inputid, step, params) {

        var queue   = new $.AjaxQueue();
            queue.add({
                url: file,
                type: 'POST',
                dataType: "json",
                data: params,
                  complete : function(data, status) {
                      $('li#step' + step + ' .loading').remove();
                      // DO SOMETHING. CANT CHECK FOR ERRORS
                  },
                  success : function(data, status) {
                      // DOES NOT WORK 
                  },
                  error: function(xhr, desc, err) {
                    console.log(xhr);
                    console.log("Details: " + desc + "\nError:" + err);
                  },
                  _run: function(req) {
                    //special pre-processor to alter the request just before it is finally executed in the queue
                    //req.url = 'changed_url'
                    $('li#step' + step).append('<span class="loading"></span>');
                  }
            });

    }

第 1 步。我正在使用 mpdf 生成 pdf。现在这需要几秒钟来实际构建，具体取决于主题、使用的图像等。所以我称之为：

createQueue('post_pdf.php', id, 1, { 'filename': filename + '.pdf', 'id': id, 'crop': crop } );

第 2 步 - 生成一些图像

createQueue('ajax_image.php', id, 2, { 'filename': filename + '.pdf' } );

第 3 步 - （例如发送电子邮件摘要）

createQueue('mail.php', id, 3, { 'from': 'newfilename', 'to': 'emavle@pb.com', 'subject': 'This is a subject', 'body': 'Body Copy' } );

如果它在第 1 步失败，我可以在控制台中看到它，但它没有返回

【问题讨论】：

好奇为什么您需要多个 ajax 请求而不能发出一个请求并让服务器管理其他步骤？请显示给您带来问题的代码
您好，您能否发布一个示例代码，以便您轻松了解您到底想做什么以及您目前在做什么。

标签： javascript php jquery ajax queue

【解决方案1】：

正如@charlietfl 所建议的，将PHP 中的每一步都放在服务器端。 AJAX 调用完成后，您可以获得来自服务器的响应并以此为基础继续。示例：

// make AJAX request to file.php and send 'data'
var request = $.ajax({
  url: "file.php",
  type: "POST",
  data: { data }
});

// when PHP is done, receive the output and act accordingly
request.done(function( msg ) {
  if (msg == "A") {
    // plan A
  } else if (msg == "B") {
    // plan B
  }
});

【讨论】：