1つの呼び出しで複数のajax呼び出し関数を実行する方法

Question

ただAjax呼び出しが不思議であるため、異なるUrl endpointsを呼び出す複数のajax呼び出し関数がありますが、ある呼び出しが失敗し、他の呼び出しが成功することがあります。

私はこれらの機能を持っていて、両方の呼び出しがコンソールログになっていることを知っていますが、私はこれらの呼び出しがページが読み込まれるとトリガーされます。私は、これらの機能をトリガーと私は、このファイルを呼び出す方法

function xs() { 
$.ajax({ 
    url: 'api/endpoint1?loc="space"', 
    method: 'GET' 
    ... 
}) 
} 
function xd() { 
$.ajax({ 
    url: 'api/endpoint2?name="x"', 
    method: 'GET' 
    ... 
}) 
} 

は私のhtmlでcalls.jsを言うと、これは、AJAX呼び出しを起動します。しかし、時にはそれらのうちの1つだけが成功を得るか、時には両方を得ることがあります。

function init() { 
xs(); 
xd(); 
} 
init(); 

複数を処理するより良い方法があるかどうだからAJAXあなたは以上の2

Answer 1

2番目のリクエストを実行する場合はかかわらず最初（またはが失敗、成功）の結果、jqXHRのdoneを経由して、それを呼び出すの：Promise.all()を使用して約束に見て、そうでない場合

function xs() { 
$.ajax({ 
    url: 'api/endpoint1?loc="space"', 
    method: 'GET' 
    ... 
}).done(function(){ 
    $.ajax({ 
     url: 'api/endpoint2?name="x"', 
     method: 'GET' 
     ... 
    }); 
    }); 
}); 

：

あなたはより多くを読むことができます

約束に入るhere

Answer 2

が成功の内側に最初の/完全な機能をお使いのセカンドajax電話を入れている場合は、特別に呼び出し、それが実行されます不思議それはあなたのフロントエンドでやChromeのインスペクタとバックエンドで問題だ場合

Answer 3

var i = 0; 
function xs() { 
$.ajax({ 
url: 'api/endpoint1?loc="space"', 
method: 'GET', 
success: function(data){ 
if(i == 0){ 
    i++; 
    xd(); 
} 

} 
}); 
} 

function xd() { 
$.ajax({ 
url: 'api/endpoint2?name="x"', 
method: 'GET', 
success: function(data){ 
if(i == 0){ 
    i++; 
    xs(); 
} 
} 
}); 
} 

Answer 4

function xs() { 
    $.ajax({ 
     url: 'api/endpoint1?loc="space"', 
     method: 'GET' 
     ... 
     success: function() { 
      $.ajax({ 
       url: 'api/endpoint2?name="x"', 
       method: 'GET' 
       ... 
      }) 
     } 
    }) 
} 

function init() { 
xs(); 
} 
init(); 

Answer 5

確かにあなたは見ることができます。 [Network]タブの[XHR]でフィルタリングします。両方の呼び出しが表示されない場合は、フロントエンドの問題です。そうでなければ、おそらく応答に問題があります。

他の手では、コールを開始するタイミングを制御できます。たとえば、次の文書準備ができて使用して

：

$(function(){ 
 
\t //jQuery code here 
 
})

か、その両方を実行し、あなたがpromise.allを（使用してデータを受信するまで待つことができる約束を使用）

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

Answer 6

を使用する0であれば、私が正しく理解していれば、いくつかの非同期呼び出しを並行して起動し、すべての呼び出しが完了したらアクションを実行するという、記述した内容を達成することができます。

ちょうどそのためにforkJoinという名前の機能があります。ここではサンプルです（活字体で書かれてはいますが、アイデアを得る）：このコードで

/** 
    * Get some Lists of Values. 
    */ 
    public getLovs(codes: string[], lang: string) { 
    return Observable.forkJoin(
     codes.map(code => { return this.getLov(code, lang); }) 
    ); 
    } 

は、getLov（進化の約束のいくつかの種類である）観測を返します。 getLovs関数は、すべての非同期呼び出しが実行されたときにObservableを返します。結果のObservableは、個々の非同期呼び出しの結果で構成される配列です。非常に便利。