2015-09-10 80 views
1

我正在開發使用Ionic Framework的應用程序。部分應用程序是使用麥克風錄製音頻,過濾出一系列頻率,然後通過揚聲器/耳機播放該聲音。將Web Audio API輸出保存到Ionic的本地文件中

我使用此代碼

function ListenButtonPressed() 
{   
     context = new (window.AudioContext||window.webkitAudioContext); 
     navigator.getUserMedia = (navigator.getUserMedia || 
            navigator.webkitGetUserMedia || 
            navigator.mozGetUserMedia || 
            navigator.msGetUserMedia); 
     navigator.getUserMedia(
          {audio:true}, 
          SetupFilters, 
          function(e) { 
           alert("error getting user media " + e); 
          }); 
} 

function SetupFilters(stream) 
{  
    input = context.createMediaStreamSource(stream); 
    volume = context.createGain(); 

    volume.gain.value = 10; 

    lowPass = context.createBiquadFilter(); 
    lowPass.type = 'lowpass'; 
    lowPass.frequency.value = 25;  

    highPass = context.createBiquadFilter(); 
    highPass.type = 'highpass'; 
    highPass.frequency.value = 425;  

    input.connect(lowPass); 
    input.connect(highPass); 
    input.connect(volume); 

    highPass.connect(context.destination); 
    lowPass.connect(context.destination);  
    volume.connect(context.destination); 

    alert("recording started successfully"); 
} 

現在,我想另一個按鈕,記錄的過濾條件的輸出,並保存在手機的存儲系統中的文件的那部分工作。

我試過使用RecorderJS並在離子應用中使用this RecorderJS integration,但無濟於事。

他們在常規瀏覽器中工作正常,但由於它生成的下載鏈接而不是僅存儲該文件,因此它們對於移動應用程序沒有多大用處。

對於如何在本地存儲文件或者使用不同的方法來濾除允許文件存儲的頻率有任何建議,都是值得歡迎的。

+0

您是否嘗試過使用'File' API從'RecorderJS'生成的鏈接下載文件,然後將其保存在本地? –

回答

1

得到它的工作,所以張貼我的解決方案別人有這個問題。

從問題中的git回購下載RecorderJS,並將the File plugin添加到您的項目中。

更改Recorder.setupDownload功能

Recorder.setupDownload = function(blob, filename) 
{ 
try 
{  
    window.requestFileSystem(window.PERSISTENT, 1024*1024, function(filesystem) { 
     if(filesystem) 
     { 
      alert("got file system"); 
      try 
      { 
       var src = blob; //3-5mb blob from previously retrieved file 
       var starttime = Date.now(); 
       filesystem.root.getFile("NEWFILE.WAV", { 'create': true }, 
       function (fileEntry) 
       { 
        fileEntry.createWriter(function (fileWriter) 
        { 
         fileWriter.onwriteend = function (event) 
         { 
         alert(Date.now()-starttime); //usually 3-6 seconds lockup 
         }; 
         fileWriter.write(src); 
        }, 
        function (fail) 
        { 
        alert("failed saving"+fail); 
        }); 
       }); 
      } 
      catch(e) 
      { 
       alert(e.message); 
      } 


     } 
    }); 

} 
catch(e) 
{ 
    alert(e.message); 
} 

} 

這行加入到我的 'SetupFilters' 功能的底部

audioRecorder = new Recorder(input); 

我已經觸發這些的StartRecording和StopRecording功能的按鈕

function stopRec() 
{ 
    highPass.disconnect(); 
    lowPass.disconnect(); 
    volume.disconnect(); 

    audioRecorder.stop();  
    audioRecorder.getBuffers(gotBuffers); 
} 
function startRec() 
{ 
    audioRecorder.clear(); 
    audioRecorder.record(); 
} 

將這些函數放在與s相同的類中撻和停止錄製功能。由於我仍然在學習Javascript,所以我不能100%確定他們做了什麼,但是他們是從RecorderJS集成中獲得的。

​​

畢竟這是一個WAV文件被保存到手機存儲。