2

私はhttps://github.com/cwilso/AudioRecorderを使用していますが、ブロブを取得してサーバーに送信する以外はすべて正常に動作します。フォームデータをサーバーに送信する次のものがあります。基本的に、クライアント側で wav ファイルが生成され、それが blob に保存されます。その blob の内容を取得する方法を見つけたいと思います。

$('#submit').click(function(){
var formData = new FormData($('#add_slide').get(0));
var jContent = $( "#main_container" );
//console.log(formData);

if($('#audio_file').val().length==0)
{

   var blob_url = $('#blob_url').val();
    if($('#blob_url').val().length==0)
   {
       alert('Recording Could not be found. Please try again');
       return false;
   }else{
       console.log(formData);
   }
   //return false;
}else{
    var ext = $('#audio_file').val().split('.').pop().toLowerCase();
    if(ext!== 'wav') {
        alert('Invalid File. Please use a file with extension WAV!');
        return false;
    }
}

$.ajax({
    url: 'lec_add_slide.php',  //server script to process data
    type: 'POST',
    xhr: function() {  // custom xhr
        myXhr = $.ajaxSettings.xhr();
        if(myXhr.upload){ // check if upload property exists
            myXhr.upload.addEventListener('progress',progressHandlingFunction, false);     // for handling the progress of the upload
            //console.log('OK');
        }else{
            //console.log('NOT');
        }
        return myXhr;
    },
    //Ajax events
    beforeSend: function (){
        $('#loadingModal').modal('show');
    },
    success: function (data) {
        jContent.html( data );
        $('#loadingModal').modal('hide');
    },
    error: function (){
        console.log('error');
    },
    // Form data
    data: formData,
    //Options to tell JQuery not to process data or worry about content-type
    cache: false,
    contentType: false,
    processData: false
});
});
function progressHandlingFunction(e){
    if(e.lengthComputable){
    $('#bar-progress-mp3').css('width',((e.loaded/e.total)*100)+'%');
}
}

通常のファイル入力を使用して通常のファイルを送信すると、すべてが完全に機能します。非表示の入力フィールドに BLOB の URL を入力し、blob.slice() も試しましたが、サーバーに到達するのはオブジェクト Blob だけです。blob URL のコンテンツを取得してサーバーに送信する方法を知っている人はいますか?

どんな助けでも感謝します。

4

1 に答える 1

3

FormData次のように、にブロブを追加できますformData.append('thename', theblob);

于 2013-03-28T22:30:48.043 に答える