2016-10-21 16 views
0

私はajaxで読みたい画像がたくさんあります。 各画像のURLを知っていれば、どのようにして3つの画像のAjaxリクエストを同時に行うことができますか?同時に複数のajaxリクエストを受け取ります

これは、あなたがtrueにasyncを設定した場合、あなたは同時に複数を発射することができます一つの画像

var image_url = images[i]; 
    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function(){ 
    if(xhr.readyState == 4 && xhr.status == 200){ 
     console.log(xhr.response, typeof xhr.response); 

    } 
    } 

    xhr.open('GET', image_url); 
    xhr.responseType = 'blob'; 
    xhr.send(); 
+0

3つの同時リクエストに制限する理由はありますか? –

+0

サーバーに過負荷をかけないでください – yomamma

+0

あなたは[Promise.all](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all)を探しています。以下のソリューションはJQueryを利用していますが、これはvanilla JS – lux

答えて

2

のための私のAjaxの機能です。ブラウザは、使用されているものに応じて、一度にいくつの数に制限されます。あなたが思うだろうかと反対のAjax作品と

$.ajax({ 
    type: "GET", 
    async: false, 
    url: "foo2.php" 
    }); 

async

0

各画像のURLを配列に入れる必要があります。 jQueryで苦情がない場合は、$ .getを使用してください。この場合、多くの処理に役立ちます。その後、再帰関数内で呼び出します。これは疑似コードですが、私はそれをテストしていません。

var imageUrls = [];//populate with your URLs 
getImage(0); 
getImage(1); 
getImage(2); 


var getImage = function(iteration){ 
    $.get(imageUrls[iteration], function(data){ 
    //handle the image 
    //call the function again with the next index 
    getImage(iteration+3); 
    }); 

} 
関連する問題