친구, 내 웹 사이트에서 오디오를 캡처하려면 RecordRTC 다음 Im을 사용하여 서버에 사운드 블롭 업로드 및 XMLHTTPRequest를 통해 PHP 서버에 기록 된 파일을 성공적으로 업로드 관리. 여기에 임 업로드 내 코드 :Laravel
var audio_context;
var recorder;
var isMouseDown = false;
var fileType = 'audio';
var fileName = 'ABCDEF.wav';
function startUserMedia(stream) {
var input = audio_context.createMediaStreamSource(stream);
__log('Media stream created.');
\t console.log('Media stream created.');
// Uncomment if you want the audio to feedback directly
//input.connect(audio_context.destination);
//__log('Input connected to audio context destination.');
recorder = new Recorder(input);
__log('Recorder initialised.');
\t console.log('Recorder Initialized');
}
function startRecording(button)
{
recorder && recorder.record();
button.disabled = true;
button.nextElementSibling.disabled = false;
__log('Recording...');
\t console.log('Recording....');
}
function stopRecording(button)
{
recorder && recorder.stop();
button.disabled = true;
button.previousElementSibling.disabled = false;
__log('Stopped recording.');
\t console.log('Stopped Recording');
\t
// create WAV download slink using audio data blob
createDownloadLink();
recorder.clear();
}
function createDownloadLink()
{
recorder && recorder.exportWAV(function(blob)
\t {
\t \t var counter = 0;
\t \t
\t \t var url = URL.createObjectURL(blob);
\t \t var fileName = 'Recording'+counter+'.wav';
\t \t
\t \t var fileObject = new File([blob], fileName, {
type: 'audio/wav'
});
\t \t \t \t \t \t
\t \t var formData = new FormData();
// recorded data
\t \t formData.append('audio-blob', fileObject);
// file name
formData.append('audio-filename', fileObject.name);
\t \t
\t \t
\t \t $.ajax({
url: 'save.php', // replace with your own server URL
data: formData,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(response) {
if (response === 'success') {
alert('successfully uploaded recorded blob');
\t \t \t \t \t \t \t \t \t console.log('Successfully Uploaded Recorded Blob');
// file path on server
var fileDownloadURL = '/uploads/' + fileObject.name;
\t \t \t \t \t \t \t \t } else
\t \t \t \t \t \t \t \t {
alert(response); // error/failure
}
}
});
});
}
window.onload = function init() {
try {
// webkit shim
window.AudioContext = window.AudioContext || window.webkitAudioContext;
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
window.URL = window.URL || window.webkitURL;
audio_context = new AudioContext;
__log('Audio context set up.');
__log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!'));
} catch (e) {
alert('No web audio support in this browser!');
}
navigator.getUserMedia({audio: true}, startUserMedia, function(e) {
__log('No live audio input: ' + e);
});
};
<button onclick="startRecording(this);">record</button>
<button onclick="stopRecording(this);" disabled>stop</button>
<?php
// upload directory
$filePath = 'uploads/' . $_POST['audio-filename'];
// path to ~/tmp directory
$tempName = $_FILES['audio-blob']['tmp_name'];
// move file from ~/tmp to "uploads" directory
if (!move_uploaded_file($tempName, $filePath)) {
// failure report
echo 'Problem saving file: '.$tempName;
die();
}
// success report
echo 'success';
?>
이제 난 내 Laravel 프로젝트에이 메커니즘을 적용해야, Laravel Framework에 대한 새로운 소식과 어떻게 실현 될 수 있는지 실마리가 없습니다. 친절하게 해결책을 찾도록 도와주세요. 감사
: 당신은 당신의 원하는 디렉토리에 파일을 저장할 수있을 것입니다, 그리고
$blobInput = $request->file('audio-blob');
을 업로드 된 파일 및 저장 방법에 대한 설명서를 읽었습니까? – sisve
https://laravel.com/docs/5.5/filesystem#file-uploads – mimo
예, 읽었습니다. 문제는 여기 getusermedia()를 사용하여 캡처 한 BLOB를 처리하는 중입니다 ... 문제는 디렉토리에 업로드하는 것입니다. –