|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Audio Recorder</title> </head> <body> <h1>Audio Recorder</h1> <button id="start">Start Recording</button> <button id="stop" disabled>Stop Recording</button> <script> let recorder, audioStream; document.getElementById('start').addEventListener('click', async () => { document.getElementById('start').disabled = true; document.getElementById('stop').disabled = false; const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); recorder = new MediaRecorder(stream); audioStream = stream; const chunks = []; recorder.ondataavailable = e => chunks.push(e.data); recorder.onstop = e => { const completeBlob = new Blob(chunks, { type: 'audio/mp4' }); const audioURL = URL.createObjectURL(completeBlob); const a = document.createElement('a'); a.href = audioURL; a.download = 'recording.mp4'; a.click(); URL.revokeObjectURL(audioURL); }; recorder.start(); }); document.getElementById('stop').addEventListener('click', () => { document.getElementById('start').disabled = false; document.getElementById('stop').disabled = true; recorder.stop(); audioStream.getTracks().forEach(track => track.stop()); }); </script> </body> </html> |