1

1 回の呼び出しで実行できない 2 つの ajax 呼び出しがあります。最初の ajax 呼び出しが開始されると、2 番目の ajax 呼び出しがすぐに開始されるか、ユーザーが送信ボタンを押すたびに開始されます。2 番目の ajax 呼び出しが開始された場合、最初の ajax 呼び出しからのデータが必要なため、最初の ajax 呼び出しの応答を待たなければなりません。

最初のajax呼び出しの応答が到着した後にのみ、2番目のajax呼び出しが彼の要求を送信するようにするにはどうすればよいですか?

  • setTimeout 以外の方法はありますか?
  • どうにかして ajax call 1 で ajax call 2 のリスナーを登録できますか?

私のコードは次のようになります。

var xhrUploadComplete = false;

// ajax call 1
$.ajax({
url: url,
type: "POST",
data: formdata,
processData: false,
contentType: false,
complete: function(response) {
    var returnedResponse = JSON.parse(response.responseText);
    xhrUploadComplete = true;
}
});

// ajax call 2
if (xhrUploadComplete) {
  $.ajax({
  url: url2,
  type: "POST",
  data: formdata2,
  processData: false,
  contentType: false,
  complete: function(response) {
    ...
  }
  });
}

編集: 最終フォームを送信するユーザーの選択に依存するため、最初の呼び出しの done() または complete() に 2 番目の ajax 呼び出しを投稿することはできません。この 2 段階のプロセスの目的は、ユーザーが画像を入力 type=file に挿入した直後に画像をサーバーに送信することです。

編集：これは非同期呼び出しであるため、if（..）を実行できないことを知っています。やるべきことを明確にするために書きました。Javaの未来のようなものが必要だと思います。

4

1 に答える 1

6

xhrUploadCompletetrue非同期に（将来、リクエストが終了したときに）設定されるため、 if-condition（リクエストが開始された直後に評価される）が満たされることはありません。returnajax 呼び出しから値を単純に (または設定) することはできません。代わりに、結果を待機するコードを、変数を設定/返すハンドラーに移動します。

$.ajax({
    url: url,
    type: "POST",
    data: formdata,
    processData: false,
    contentType: false,
    complete: function(response) {
        var returnedResponse = JSON.parse(response.responseText);
        $.ajax({
            url: url2,
            type: "POST",
            data: formdata2,
            processData: false,
            contentType: false,
            complete: function(response) {
                …
            }
        });
    }
});

Promise パターンを使用すると、これらをさらにエレガントに構成できます。

$.ajax({
    url: url,
    type: "POST",
    data: formdata,
    processData: false,
    contentType: false
}).then(function(response) {
    var returnedResponse = JSON.parse(response.responseText);
    return $.ajax({
        url: url2,
        type: "POST",
        data: formdata2,
        processData: false,
        contentType: false
    });
}).done(function(response) {
    // result of the last request
    …
}, function(error) {
   // either of them failed
});

たぶん、これも必要です：

var ajax1 = $.ajax({
    url: url, …
}).then(function(response) {
    return JSON.parse(response.responseText);
});
$(user).on("decision", function(e) { // whatever :-)
    // as soon as ajax1 will be or has already finished
    ajax1.then(function(response1) {
        // schedule ajax2
        return $.ajax({
             url: url2, …
        })
    }).done(function(response) {
        // result of the last request
        …
    }, function(error) {
        // either of them failed
    });
});
于 2013-10-01T20:53:44.587 に答える