chat room, send audio to store in server

[nitiphone2021]

According to I make a website for chat and I want to send voice to communicate.

so I use this script from https://blog.addpipe.com/using-recorder-js-to-capture-wav-audio-in-your-html5-web-site/

This is javascript

function createDownloadLink(blob) {


	//name of .wav file to use during upload and download (without extendion)
	var filename = new Date().toISOString();

		console.log('bob = ' + typeof(blob));
		console.log('file name = ' + typeof(filename));
		  var fd=new FormData();
		  fd.append("audio_data",blob, filename);

		  $.ajax({

			url: "../func/upload.php",
			method: "POST",
			processData: false,
			contentType: false,
			data: fd,
			enctype: 'multipart/form-data',
			success: function (data) {
				console.log('SUCCESS' + data);

			},
			error: function (err) {
			}

		});


}

and this is server side PHP

<?php





//this will print out the received name, temp name, type, size, etc. 
print_r($_FILES);
$input = str_replace(":","_",$_FILES['audio_data']['tmp_name']); //get the temporary name that PHP gave to the uploaded file 
$output = $_FILES['audio_data']['name'].".wav"; //letting the client control the filename is a rather bad idea 
//move the file from temp name to local folder using $output name 
move_uploaded_file($input, $output);

?>

This is the print output

Array
(
    [audio_data] => Array
        (
            [name] => 2021-07-02T07:59:33.877Z
            [type] => audio/wav
            [tmp_name] => C:\xampp\tmp\phpF3C8.tmp
            [error] => 0
            [size] => 44
        )

)

It seem no any error but I don't find any file on the server.

Could you please kindly help me check?

[requinix]

I like how the code has a comment that doing a thing is a "rather bad idea", and then does it anyway.

Check the return value from move_uploaded_file() to see if that worked, and make sure you have error displaying/logging/reporting set up so that you can see any errors that happen.

[nitiphone2021]

//this will print out the received name, temp name, type, size, etc. 
$input = str_replace(":","_",$_FILES['audio_data']['tmp_name']); //get the temporary name that PHP gave to the uploaded file 
 $output = $_FILES['audio_data']['name'].".wav"; //letting the client control the filename is a rather bad idea 
//move the file from temp name to local folder using $output name 
$result = move_uploaded_file($input, $output);

echo "Result = [" . $result . "]";

The result from these code is "Rsult = []"

$input = $_FILES['audio_data']['tmp_name']; //get the temporary name that PHP gave to the uploaded file 

If I follow the original code by this line, The server will said file not found. 

[nitiphone2021]

Now it's work.

seem it's fail on $output because I just copy but don't change the path

so this code is work

//this will print out the received name, temp name, type, size, etc. 
$input = $_FILES['audio_data']['tmp_name']; //get the temporary name that PHP gave to the uploaded file 
$output = "C:\\xampp\htdocs\dlap\ABC.wav"; //letting the client control the filename is a rather bad idea 
//move the file from temp name to local folder using $output name 
$result = move_uploaded_file($input, $output);

echo $output;
echo "Result = [" . $result . "]";

 

[nitiphone2021]

But the file I created it's no sound, it's like empty file always 44K

 

//this will print out the received name, temp name, type, size, etc. 
$input = $_FILES['audio_data']['tmp_name']; //get the temporary name that PHP gave to the uploaded file 
$output = "../management/design/voices/" . time() . uniqid() .".wav"; //letting the client control the filename is a rather bad idea 
//move the file from temp name to local folder using $output name 
$result = move_uploaded_file($input, $output); 

It is because the blob?

This is th javascript function for save record

function stopRecording() {
	
	
	//tell the recorder to stop the recording
	rec.stop();

	//stop microphone access
	gumStream.getAudioTracks()[0].stop();

	//create the wav blob and pass it on to createDownloadLink
	rec.exportWAV(createDownloadLink);
}

async function createDownloadLink(blob) {


	var filename = new Date().toISOString();
		  var fd=new FormData();
		  
		  fd.append('audio_data', blob,filename);
		  
		  $.ajax({

			url: "../func/upload.php",
			method: "POST",
			processData: false,
			contentType: false,
			
			data: fd,
			enctype: 'multipart/form-data',
			success: function (data) {
				console.log('SUCCESS' + data);

			},
			error: function (err) {
			}

		});


}