javascript - 如何在 PHP 中将 MediaRecorder 流保存到 OGG 文件?包括元数据
问题描述
我正在使用 Javascript 在浏览器中向我的用户提供录音:
navigator.mediaDevices.getUserMedia(media.gUM).then(_stream =>
{
stream = _stream;
recorder = new MediaRecorder(stream);
recorder.ondataavailable = e =>
{
// push data to chunks
chunks.push(e.data);
// recording has been stopped
if(recorder.state == 'inactive')
{
blob = new Blob(chunks, {type: media.type });
blob_url = URL.createObjectURL(blob);
$('.rec_result_audio').attr({
'src': blob_url
});
// send data to server
// append file to object to be sent
var filedata = new FormData();
filedata.append('recfile', blob, blob_url);
// send by AJAX/POST
}
};
}
在 PHP 中,我像这样获取并存储流:
if(!empty($_FILES))
{
$filename = $_FILES['recfile']['name'];
$file_locationtmp = $_FILES['recfile']['tmp_name'];
$filetype = $_FILES['recfile']['type'];
$filesize_bytes = $_FILES['recfile']['size'];
// add file extension to string
$_FILES['recfile']['name'] = $_FILES['recfile']['name'].'.ogg';
// save to filesystem
}
现在 OGG 文件(带有 opus 编解码器的 webm)存储在服务器上。但是,所有元数据都丢失了。因此播放栏不起作用。有关更多信息,请参见此处:HTML5 音频 - 进度条/播放栏不适用于 OGG 音频文件/206 部分内容问题
Length
不见了。还有Bit rate
,Channels
和Audio sample rate
.
显然用 PHP 直接保存到文件系统是不够的。
PHP 代码中缺少什么,以便稍后将该文件识别为 OGG 文件?
我是否必须添加元数据,如果需要,如何添加?
解决方案
我可能遗漏了一些明显的东西,但是 - 你不应该指定你希望Javascript 流是 OGG/Vorbis吗?
recorder = new MediaRecorder(stream, { mimeType: "audio/ogg; codecs=vorbis" });
我可能弄错了,但你得到的文件:
现在 OGG 文件(带有 opus 编解码器的 webm)存储在服务器上。但是,所有元数据都丢失了。
实际上不是 OGG 文件——它是一个 WEBM 文件。因此,给它一个.ogg
扩展名而不是.webm
像你所做的那样,可能会使系统感到困惑,这就是为什么文件出现“不可读和缺少元数据”的原因。
推荐阅读
- java - 时间不前进,它停留在同一时间
- npm - npm 错误!代码 E401 密码不正确或丢失。如果您尝试登录,请更改密码,创建身份验证令牌
- javascript - for循环中的事件侦听器同时执行而不是一次执行如何解决?
- spring-boot - 如何在运行时启用/禁用实体关系?
- python - 如何将矩阵分解为特定形状?
- c - CodeBlocks 中的 C 程序编译错误
- c - K&R c书5-9练习
- javascript - 如何按类获取数组中的多个元素?
- c - Swift 将 [UIn16] 转换为 UnsafeMutablePointer
- c# - 我想在 dotnetcore web api 控制器中使用 linq 方法通过 entityframework 从多个表中获取数据