Передача аудио, записанного с помощью Media Recorder, на сервер через php
Недавно я начал изучать API Media Recorder, и до сих пор мне удавалось записывать аудио в браузере с помощью этого API, воспроизводить это аудио в браузере и загружать его с моего диска. Теперь я хочу отправить записанное аудио на сервер PHP. Как я могу это сделать?
Вот мой код до сих пор:
<!DOCTYPE html>
<button id="record" disabled> record </button>
</p>
<p>
<button id="stop" disabled> stop </button>
<p>
<audio id="audio" controls></audio>
</p>
<p>
<a id="downloadLink" href></a>
<script type="text/javascript">
var recordButton, stopButton, recorder;
var chunks = [];
var downloadLink = document.querySelector('a#downloadLink');
window.onload = function() {
recordButton = document.getElementById("record");
stopButton = document.getElementById("stop");
navigator.mediaDevices.getUserMedia({
audio: true
})
.then(function(stream) {
recordButton.disabled = false;
recordButton.addEventListener('click', startRecording);
stopButton.addEventListener('click', stopRecording);
recorder = new MediaRecorder(stream );
recorder.addEventListener('dataavailable', onRecordingReady);
});
};
function startRecording() {
chunks = [];
recordButton.disabled = true;
stopButton.disabled = false;
recorder.start();
}
function stopRecording() {
recordButton.disabled = false;
stopButton.disabled = true;
recorder.stop();
}
function onRecordingReady(e) {
chunks.push(e.data)
var audio = document.getElementById('audio');
audio.src = window.URL.createObjectURL(e.data);
var audioURL = audio.src;
downloadLink.href = audioURL;
downloadLink.innerHTML = audioURL;
var rand = Math.floor((Math.random() * 10000000));
var name = "audio_" + rand + ".wav";
downloadLink.setAttribute("download", name);
downloadLink.setAttribute("name", name);
audio.play();
}
</script>