javascript - Convert an Array of Images png to Base64 -

i'm trying convert png images, lot of them base64 , send them on post request server-side application.

i have looked , found function author has done http://jsfiddle.net/handtrix/yvq5y/ here, want:

function convertimgtobase64url(url, callback, outputformat){ var img = new image(); img.crossorigin = 'anonymous'; img.onload = function(){     var canvas = document.createelement('canvas'),     ctx = canvas.getcontext('2d'), dataurl;     canvas.height = this.height;     canvas.width = this.width;     ctx.drawimage(this, 0, 0);     dataurl = canvas.todataurl(outputformat);     callback(dataurl);     canvas = null;  }; img.src = url;} 

i'm using way:

convertimgtobase64url(model.cells[i].attrs.image["xlink:href"], function(base64img){             // base64dataurl             console.log(base64img)         }); 

as can see each cells contains image, need convert base64 before sending on post request, question how can convert array of png images base64 , wait them finish , send array, know ajax request , can't synchronously it's not natural javascript, can't seem find solution. how done properly?

the question boils down to: how can wait set of asynchronous callback functions

since plain javascript code, waiting part bit complicated implement (there examples in answer well), pretty easy use option answer suggesting using async.js.

another possibility use promise library , wrap function callback in promise , wait fulfilled (usually libraries have support such utility function)