html未找到音频文件夹,【已解决】html5中MediaRecorder的dataavailable没有执行获取不到录音数据...-程序员宅基地

技术标签: html未找到音频文件夹  

折腾:

期间,用相关代码:    function testMediaRecorder(mediaStream){

console.log("testMediaRecorder: mediaStream=%o", mediaStream);

const options = {mimeType: 'audio/webm'};

if (MediaRecorder.isTypeSupported(options.mimeType)) {

console.log("support options=%o", options);

} else {

console.log(options.mimeType + ' is not Supported');

}

const recordedChunks = [];

const mediaRecorder = new MediaRecorder(mediaStream, options);

console.log("mediaRecorder=%o", mediaRecorder);

mediaRecorder.addEventListener('dataavailable', function(e) {

console.log("dataavailable: e.data.size=%d, e.data=%o", e.data.size, e.data);

if (e.data.size > 0) {

recordedChunks.push(e.data);

console.log("recordedChunks=%o", recordedChunks);

}

if (shouldStop === true && stopped === false) {

mediaRecorder.stop();

stopped = true;

console.log("stopped=%s", stopped);

}

});

mediaRecorder.addEventListener('stop', function() {

// downloadLink.href = URL.createObjectURL(new Blob(recordedChunks));

// downloadLink.download = 'acetest.wav';

var blobFile = URL.createObjectURL(new Blob(recordedChunks));

console.log("blobFile=%o", blobFile);

$("#downloadSpeakAudio").attr("href", speakAudioFilename);

var curDate = new Date();

console.log("curDate=%o", curDate);

var curDatetimeStr = curDate.Format("yyyyMMdd_HHmmss");

console.log("curDatetimeStr=%o", curDatetimeStr);

var speakAudioFilename = curDatetimeStr + ".wav"

console.log("speakAudioFilename=%o", speakAudioFilename);

$("#downloadSpeakAudio").attr("download", speakAudioFilename);

});

console.log("before start: mediaRecorder.state=%s", mediaRecorder.state);

mediaRecorder.start();

// mediaRecorder.start(100);

console.log("after  start: mediaRecorder.state=%s", mediaRecorder.state);

}

但是始终无法执行到:dataavailable

从而无法得到麦克风录音的数据

MediaRecorder dataavailable not work

chrome中是可以开启摄像头的:

22d560566d8ffa1beb7ff04eed718009.png

Chrome’s experimental Web Platform Features enabled

MediaRecorder voice

js MediaRecorder voice

去调试:console.log("before start: mediaRecorder.state=%s", mediaRecorder.state);

mediaRecorder.start();

console.log("after start: mediaRecorder.state=%s", mediaRecorder.state);

state是对的:before start: mediaRecorder.state=inactive

main.js:196 after  start: mediaRecorder.state=recording

MediaRecorder dataavailable not fire

“2.2. Attributes

stream, of type MediaStream, readonly

The MediaStream to be recorded.

mimeType, of type DOMString, readonly

The MIME type [RFC2046] that has been selected as the container for recording. This entry includes all the parameters to the base mimeType. The UA should be able to play back any of the MIME types it supports for recording. For example, it should be able to display a video recording in the HTML tag. The default value for this property is platform-specific.

mimeType specifies the media type and container format for the recording via a type/subtype combination, with the codecs and/or profiles parameters [RFC6381] specified where ambiguity might arise. Individual codecs might have further optional specific parameters.

state, of type RecordingState, readonly

The current state of the MediaRecorder object. When the MediaRecorder is created, the UA MUST set this attribute to i

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_42245701/article/details/117951605

智能推荐

瑞芯微RK3288、RK3399、RK3568、RK3368芯片性能介绍与对比分析_rk3288和rk3568对比-程序员宅基地

文章浏览阅读2.1k次,点赞7次,收藏8次。是瑞芯微推出的一款低功耗、高性能的应用处理器芯片,该芯片基于Big.Little架构,即具有独立的NEON协同处理器的双核Cortex-A72及四核Cortex-A53组合架构,主要应用于计算机、个人互联网移动设备、VR、广告机等智能终端设备。RK3399内置多个高性能硬件处理引擎,能够支持多重格式的视频解码,如:4K*2K@60fps 的H.264/H.265/VP9,也支持1080P@30fps的H.264/MVC/VP8 以及高质量的JPEG编解码和图像的前后处理器。_rk3288和rk3568对比

使用esp 8266物联网开发板 + Mqtt制作远程控制LED小灯_esp8266 mqtt 控制灯亮灭-程序员宅基地

文章浏览阅读1.5k次。如何30快钱以内制作一个手机控制的led小灯_esp8266 mqtt 控制灯亮灭

Ansys Zemax | 如何模拟光学相干层析成像系统_nsdd操作数-程序员宅基地

文章浏览阅读291次,点赞2次,收藏4次。聚焦透镜的坐标(0,20,40),使聚焦透镜与扫描镜保持水平,并保持20mm的距离(该距离在两者的水平位置距离中是任意的),聚焦透镜的材料为N-BK7。_nsdd操作数

流式处理中的文本聚类:探索Apache Beam在文本数据处理中的应用-程序员宅基地

文章浏览阅读5.7k次。作者:禅与计算机程序设计艺术 流式处理中的文本聚类:探索Apache Beam在文本数据处理中的应用引言1.1. 背景介绍随着互联网与物联网的发展,大量的文本数据在各个领

基于微服务架构的分布式系统:如何设计和实现高效的微服务系统_基于微服务的系统-程序员宅基地

文章浏览阅读4.7k次。随着互联网的发展,分布式系统在大型企业应用中越来越普遍。微服务架构作为一种新兴的分布式系统架构,以其灵活性和可扩展性吸引了越来越多的开发者。在微服务架构中,每个服务都是独立的,具有完整的功能和数据职责。本文旨在探讨如何设计和实现高效的微服务系统,以应对现代应用中日益增长的需求。服务注册和发现:服务注册表和反向代理服务。服务路由:服务发现和路由器。服务安全:访问控制、加密和认证。分布式事务:分布式事务工具,如乐观锁。消息队列:异步处理和消息传递。_基于微服务的系统

全网最有效解决centos7 安装MySQL报错No package mysql-server available_no package mod_auth_mysql available.-程序员宅基地

文章浏览阅读856次。今天想在centos7上面装一个mysql,但是无论我yum就还是wget都装不上,提示No package mysql-server…,然后又度娘又各种查资料,试了好多种方法都没有用,最后了解Centos7系统后发现,Centos7带有MariaDB而不是MySQL,MariaDB和MySQL一样也是开元的数据库,同样可以使用yum命令安装,只不过安装使用的并不是老方式的MySQL,而是默认的MariaDB,并且还需要安装的是mariadb-server,如果想继续使用老方式的MySQL,那么需要清_no package mod_auth_mysql available.

随便推点

TensorFlow及其在自然语言处理中的应用_python tensorflow文本理解-程序员宅基地

文章浏览阅读2k次。作者:禅与计算机程序设计艺术 1.简介自然语言处理(Natural Language Processing,NLP)是人工智能领域的一个重要方向。NLP是利用计算机处理及分析文本、语音、图像等各种媒体形式的信息的一门学科。自然语言处理最主要的任务就是把输入的文本进行解析、理解、整合成有意义的信息。可以_python tensorflow文本理解

rocketmq集群安装配置说明-程序员宅基地

文章浏览阅读343次。2019独角兽企业重金招聘Python工程师标准>>> ..._rocketmq 添加集群

构造一个银行账户类(Java)_java定义一个银行账户类,建立账户id为001,姓名张三-程序员宅基地

文章浏览阅读4.4k次。class Bank{ private String name; private float money; public String getName() { return name; } public void setName(String name) { this.name = name; } public float getMoney() { return mone..._java定义一个银行账户类,建立账户id为001,姓名张三

Docker和DockerMachine的对比-程序员宅基地

文章浏览阅读295次,点赞5次,收藏7次。1.背景介绍1. 背景介绍Docker和Docker-Machine都是在容器化技术的基础上发展出来的,它们在软件开发和部署方面发挥了重要作用。Docker是一个开源的应用容器引擎,它使用容器化技术将软件应用与其依赖包装在一起,以便在任何环境中快速部署和运行。Docker-Machine是一个用于管理Docker主机的工具,它可以创建和管理远程Docker主机,以便在不同的环境中运行Doc...

CCF CSP 201703-1 分蛋糕(Java-100分)_ccfcsp分蛋糕-程序员宅基地

文章浏览阅读787次。试题编号: 201703-1试题名称: 分蛋糕时间限制: 1.0s内存限制: 256.0MB问题描述: 问题描述  小明今天生日,他有n块蛋糕要分给朋友们吃,这n块蛋糕(编号为1到n)的重量分别为a1, a2, …, an。小明想分给每个朋友至少重量为k的蛋糕。小明的朋友们已经排好队准备领蛋糕,对于每个朋友,小明总是先将自己手中编号最小的蛋糕分_ccfcsp分蛋糕

前端访问性:实现可访问性与易用性-程序员宅基地

文章浏览阅读902次,点赞22次,收藏14次。1.背景介绍前端访问性是一种设计理念,它关注于为所有用户提供相同或类似的体验,无论他们的能力、年龄、技能水平或其他因素。可访问性和易用性是前端访问性的关键组成部分,它们确保了网站或应用程序对所有用户都是友好的。在过去的几年里,前端访问性变得越来越重要,因为互联网已经成为了人们生活和工作的重要组成部分。因此,确保所有用户都能够轻松地使用网站或应用程序变得至关重要。在本文中,我们将讨论前端...

推荐文章

热门文章

相关标签