将博客URL转换为数据URL并将其发送到数据库进行存储

With the following code I have down below. I would like to modify it so that it will convert the blob url variable(url) below into a data url. Javascript Filereader should get the job done, but I would also like to send it to database for storage using ajax call.

使用以下代码,我在下面。我想修改它,以便它将下面的blob url变量(url)转换为数据url。 Javascript Filereader应该完成工作,但我还想使用ajax调用将其发送到数据库进行存储。

Recorder.diplayRecord = function(blob, filename) {
    var url = (window.URL || window.webkitURL).createObjectURL(blob);
    var displayRecord = document.getElementById("displayRecord");
    //link.href = url;
    var li = document.createElement('li');
    var au = document.createElement('audio');
    var hf = document.createElement('a');

    var xhr = new XMLHttpRequest;

    au.controls = true;
    au.src = url;
    hf.href = url;
    hf.download = 'audio_recording_' + new Date().getTime() + '.wav';
    hf.innerHTML = hf.download;
    while (displayRecord.lastChild) displayRecord.removeChild(displayRecord.lastChild);
    li.appendChild(au);
    li.appendChild(hf);
    displayRecord.appendChild(li);

1 个解决方案

#1

Try

Recorder.diplayRecord = function(blob, filename) {
    var url = (window.URL || window.webkitURL).createObjectURL(blob);
    var displayRecord = document.getElementById("displayRecord");
    //link.href = url;
    var li = document.createElement('li');
    var au = document.createElement('audio');
    var hf = document.createElement('a');

    var reader = new FileReader();       
    reader.onload = function(e) {
      if (e.target.readyState === 2) {
        var _data = e.target.result;
        // `POST` `data-uri`
        $.post("database/url/", {"data": _data})
        .then(
           // `success`
           function(data, textStatus) {
             console.log(textStatus)
         } 
           // `error`
         , function(jqxhr, textStatus, errorThrown) {
             console.log(textStatus, errorThrown)   
         })
       };
    };        
    reader.readAsDataURL(blob);

    au.controls = true;
    au.src = url;
    hf.href = url;
    hf.download = 'audio_recording_' + new Date().getTime() + '.wav';
    hf.innerHTML = hf.download;
    while (displayRecord.lastChild) displayRecord.removeChild(displayRecord.lastChild);
    li.appendChild(au);
    li.appendChild(hf);
    displayRecord.appendChild(li);
    // adding closing `}`
    };

See

FileReader

jQuery.post()