jQuery Ajax: set dataUrl beforeSend

Question

Этот запрос AJAX не возвращает 64-Value-String в обработчике beforeSend, как он должен. Но как alert в функции он делает! Я не знаю, как это сделать. В чем проблема?

$imageMaps[0] = '1.jpeg'; 
$imageMaps[1] = '2.jpeg'; 

for (var k in $imageMaps) { 
    $file = $imageMaps[k]; 
    $.ajax({ 
     type: "POST", 
     async: 0, 
     beforeSend: function (xhr, settings) { 
      $base64 = convertImgToBase64($file); 
      alert($base64) 
      settings.data.img = $base64; 
      settings.data.url = $file; 
     }, 
     url: '/request.php?imagePost=1', 
     data: { 
      img: '', 
      url: $file 
     }, 
     success: function() {} 
    }); 
} 

function convertImgToBase64(url) { 
    var img = new Image(); 
    img.src = url; 
    img.onload = function() { 
     var canvas = document.createElement("canvas"); 
     canvas.width = this.width; 
     canvas.height = this.height; 
     var ctx = canvas.getContext("2d"); 
     ctx.drawImage(this, 0, 0); 
     dataurl = canvas.toDataURL("image/png"); 
     alert(dataurl) 
     return dataurl; 
    } 
} 

Answer 1

Вы фактически ничего не возвращаете от этой функции. Попробуйте сделать так:

function convertImgToBase64(url) { 
    var img = new Image(); 
    img.src = url; 
    return img.onload = function() { 
     var canvas = document.createElement("canvas"); 
     canvas.width = this.width; 
     canvas.height = this.height; 
     var ctx = canvas.getContext("2d"); 
     ctx.drawImage(this, 0, 0); 
     dataurl = canvas.toDataURL("image/png"); 
     alert(dataurl) 
     return dataurl; 
    } 
} 

Возможно, я ошибаюсь, поэтому, если это не работает, сделайте комментарий.

Answer 2

Вот решение:

$imageMaps[0] = '1.jpeg'; 
    $imageMaps[1] = '2.jpeg'; 

    for (var k in $imageMaps) { 
     $file=$imageMaps[k]; 
     convertImgToBase64($url, function($base64Img,$url2){ 
        $.ajax({ 
         type: "POST", 
         async : 1, 
         url: '/request.php?imagePost=1', 
         data: {img:$base64Img,url:$url2}, 
         xhr: function() {}, 
         success: function(){} 
         }); 
      }) 
    } 

function convertImgToBase64(url, callback, outputFormat){ 
var img = new Image(); 
img.crossOrigin = 'Anonymous'; 
img.onload = function(){ 
    var canvas = document.createElement('CANVAS'); 
    var ctx = canvas.getContext('2d'); 
    canvas.height = this.height; 
    canvas.width = this.width; 
    ctx.drawImage(this,0,0); 
    var dataURL = canvas.toDataURL(outputFormat || 'image/png'); 
    callback(dataURL,url); 
    canvas = null; 
}; 
img.src = url; 

}