Saving WAV tập tin ghi trong Chrome đến Server

Question

Tôi đã nhìn thấy nhiều câu trả lời một phần ở đây và các nơi khác, nhưng tôi rất nhiều một coder mới làm quen và đang hy vọng cho một giải pháp triệt để. Tôi đã có thể thiết lập ghi âm thanh từ một máy tính xách tay mic trong Chrome Canary và có thể, sử dụng recorder.js, tương đối dễ dàng thiết lập ghi âm một file .wav và tiết kiệm mà tại địa phương, a la (v 29.x.):

http://webaudiodemos.appspot.com/AudioRecorder/index.html

Nhưng tôi cần lưu tệp vào máy chủ Linux mà tôi đang chạy. Đó là sự gửi thực tế của blob đã ghi dữ liệu đến máy chủ và lưu nó ra dưới dạng tệp .wav đang đánh bắt tôi. Tôi không có kiến ​​thức cần thiết về PHP và/hoặc AJAX về cách lưu blob vào một URL và để giải quyết, như tôi đã được hiểu, với các tệp nhị phân trên Linux giúp tiết kiệm tệp .wav đó thực sự khó khăn. Tôi rất hoan nghênh bất kỳ con trỏ nào đi đúng hướng.

Answer 1

Khách hàng bên hàm JavaScript để tải lên các blob WAV:

function upload(blob) { 
    var xhr=new XMLHttpRequest(); 
    xhr.onload=function(e) { 
     if(this.readyState === 4) { 
      console.log("Server returned: ",e.target.responseText); 
     } 
    }; 
    var fd=new FormData(); 
    fd.append("that_random_filename.wav",blob); 
    xhr.open("POST","<url>",true); 
    xhr.send(fd); 
} 

PHP tập tin upload_wav.php:

<?php 
// get the temporary name that PHP gave to the uploaded file 
$tmp_filename=$_FILES["that_random_filename.wav"]["tmp_name"]; 
// rename the temporary file (because PHP deletes the file as soon as it's done with it) 
rename($tmp_filename,"/tmp/uploaded_audio.wav"); 
?> 

sau đó bạn có thể chơi các tập tin /tmp/uploaded_audio.wav.

Nhưng hãy nhớ! /tmp/uploaded_audio.wav được tạo bởi người dùng www-data và (theo mặc định PHP) không thể đọc được bởi người dùng. Để tự động thêm các quyền thích hợp, hãy thêm dòng

chmod("/tmp/uploaded_audio.wav",0755); 

vào cuối PHP (trước thẻ kết thúc PHP ?>).

Hy vọng điều này sẽ hữu ích.

Answer 2

Cách dễ nhất, nếu bạn chỉ muốn hack mã, là đi vào recorderWorker.js, và hack exportWAV() chức năng để một cái gì đó như thế này:

function exportWAV(type){ 
    var bufferL = mergeBuffers(recBuffersL, recLength); 
    var bufferR = mergeBuffers(recBuffersR, recLength); 
    var interleaved = interleave(bufferL, bufferR); 
    var dataview = encodeWAV(interleaved); 
    var audioBlob = new Blob([dataview], { type: type }); 

    var xhr=new XMLHttpRequest(); 
    xhr.onload=function(e) { 
     if(this.readyState === 4) { 
      console.log("Server returned: ",e.target.responseText); 
     } 
    }; 
    var fd=new FormData(); 
    fd.append("that_random_filename.wav",audioBlob); 
    xhr.open("POST","<url>",true); 
    xhr.send(fd); 
} 

Sau đó, phương pháp đó sẽ được lưu vào máy chủ từ bên trong sợi công nhân, thay vì đẩy nó trở lại sợi chính. (Cơ chế dựa trên công nhân phức tạp trong RecorderJS là do một mã hóa lớn nên được thực hiện ngoài luồng.)

Thực sự, lý tưởng, bạn chỉ cần sử dụng MediaRecorder hôm nay và để nó thực hiện mã hóa, nhưng đó là toàn bộ 'Quả bóng sáp.