jQuery各ループを約束します

Question

ユーザーフォトギャラリーにURLのリストを生成するUserScriptを作成しています。ユーザーギャラリーには複数のページがあり、各ページにはフルサイズの画像URLを含むページへのリンクを持つ複数のサムネイルがあります。

jQueryを使用してページをリクエストしていますが、ユーザーギャラリーに1ページしか含まれていない場合でも、希望の結果が得られません。ユーザーギャラリーに複数のページが含まれているときに結果が得られますが、1ページ分の結果しか得られません。

var userID = 0; 

function getUserID() { 
    var query = window.location.search; 
    var regex = /UserID=(\d+)/; 
    var regexResult = query.match(regex); 
    if (regexResult !== null) { 
     return regexResult[0].replace('UserID=', ''); 
    } else { 
     return 0; 
    } 
} 

function getGallery(userID) { 
    function getGalleryPage(userID, page, gallery) { 
     var data = {}; 
     if(page > 0) { 
      data = { btnNext: ">", PageNo: page }; 
     } 

     var url = 'http://www.domain.com/' + userID; 

     return $.ajax({ 
      method: 'POST', 
      url: url, 
      data: data, 
      dataType: 'html' 
     }).then(function(result){ 
      $result = $(result); 
      $result.find('form[name="frmGallery"]').find('img').each(function() { 
       var url = '' 
       // Do stuff to get url 

       getGalleryImage(url).done(function(imageLink) { 
        gallery.push(imageLink); 
       }); 
      }); 

      $btnNext = $result.find('input[name="btnNext"]'); 
      if($btnNext.length > 0) { 
       page += 1; 
       return getGalleryPage(userID, page, gallery); 
      } else { 
       return(gallery); 
      } 
     }); 
    } 
    return getGalleryPage(userID, 0, []); 
} 

function getGalleryImage(url) { 
    return $.ajax({ 
     method: 'GET', 
     url: url, 
     dataType: 'html' 
    }).then(function(result){ 
     var imageUrl = ''; 
     // Do stuff to get full sized image url 
     return imageUrl; 
    }); 
} 

jQuery(document).ready(function($) { 
    userID = getUserID(); 
    if(userID === 0) 
     return; 

    getGallery(userID).done(function(gallery) { 
     $.each(gallery, function(index, value) { 
      console.log(value); 
     }); 
    }); 
}); 

私は私のスクリプトのこの部分が正しくないと思う：

$result.find('form[name="frmGallery"]').find('img').each(function() { 
       var url = '' 
       // Do stuff to get url 

       getGalleryImage(url).done(function(imageLink) { 
        gallery.push(imageLink); 
       }); 
      }); 

Answer 1

書かれたとおり、getGalleryImage()によって返されたインナー約束を集約する試みはありません。

配信されたimg要素を約束の配列にマップし、それらをjQuery.when()で集約する必要があります。

jQuery(function($) { 
    var userID; 

    function getUserID() { 
     var query = window.location.search; 
     var regex = /UserID=(\d+)/; 
     var regexResult = query.match(regex); 
     if (regexResult !== null) { 
      return regexResult[0].replace('UserID=', ''); 
     } else { 
      return 0; 
     } 
    } 

    function getGallery(userID) { 
     var gallery = []; 
     var page = 0; 
     var url = 'http://www.domain.com/' + userID; 
     function getGalleryPage() { 
      var data = (page > 0) ? { btnNext: ">", PageNo: page } : {}; 
      return $.ajax({ 
       method: 'POST', 
       url: url, 
       data: data, 
       dataType: 'html' 
      }).then(function(result) { 
       $result = $(result); 

       //map jQuery collection of img elements to Array of promises 
       var promises = $result.find('form[name="frmGallery"]').find('img').map(function(imgElement, i) { 
        var url = '' 
        // Do stuff to get url 
        return getGalleryImage(url); 
       }).get();// .get() is necessary to unwrap jQuery and return Array 

       //aggregate promises 
       return $.when.apply(null, promises).then(function() { 
        //accumulate results 
        gallery = gallery.concat(Array.prototype.slice.call(arguments)); 
        // recurse/terminate 
        if($result.find('input[name="btnNext"]').length > 0) { 
         page += 1; 
         return getGalleryPage(); 
        } else { 
         return gallery; 
        } 
       }); 
      }); 
     } 
     return getGalleryPage(); 
    } 

    function getGalleryImage(url) { 
     return $.ajax({ 
      method: 'GET', 
      url: url, 
      dataType: 'html' 
     }).then(function(result) { 
      var imageUrl = ''; 
      // Do stuff to get full sized image url 
      return imageUrl; 
     }); 
    } 

    userID = getUserID(); 
    if(userID !== 0) { 
     getGallery(userID).then(function(gallery) { 
      $.each(gallery, function(index, value) { 
       console.log(value); 
      }); 
     }); 
    } 
}); 

あなたはまた、念のいくつかのユーザーIDは、数千ページを生成する一日で、再帰の数に制限を課す必要があります。

私はそれをこのような何かを書くでしょう。