Bir blob bir formda nasıl saklayabilirim ve tıklamalar Ajax olmadan gönderildiğinde sunucuya nasıl gönderilir?

Question

Bu benim fonksiyondur:

FileCropped.prototype.change = function() { 
    var obj = $(this).data("plugin.file-cropped"); 

    var files = obj.$element[0].files; 
    var file; 

    var URL = window.URL || window.webkitURL; 
    var blobURL; 

    if (files && files.length) { 
     file = files[0]; 
     console.log("I have files"); 

     if (/^image\/\w+$/.test(file.type)) { 
      blobURL = URL.createObjectURL(file); 
      obj.$element.val(''); 
      obj.$hidden[0].value = blobURL; 
      //URL.revokeObjectURL(blobURL); 
     } else { 
      window.alert('Please choose an image file.'); 
     } 
    } else 
    { 
     console.log("No files?"); 
    } 
} 

Ben varolan formu girişine damla eklemek şu anda çalışıyorum ama çalışmıyor. Chrome hata ayıklayıcısını kullanarak yöntemin iyi çalıştığını ve beklenen yolu izlediğini görüyorum, ancak gönderim sırasında sunucu hiçbir şey alamıyor.

Herhangi bir ipucu?

Düzenleme: tabiki fonksiyonun şu anda bir değeri yoktur. Normal dosya girişini kullanabilirim. Amaç blobunu forma eklemeden önce manipüle edebilmektir.

Answer 1

Veri URL olarak dosyayı okumak için FileReader kullanabilirsiniz

var fileReader = new FileReader(); 
fileReader.addEventListener('load', function() { 
    blobURL = fileReader.result; 
    obj.$hidden[0].value = blobURL; 
}); 
fileReader.readAsDataURL(file);