Advertisement

Recorder.js 是一款利用纯 HTML5 和 JavaScript 实现的网页录音工具。

  •  5星
  •     浏览量: 0
  •     大小:None
  •      文件类型:None


简介:
# recorder.js:microphone:该模块提供基于HTML5的录音功能,并以MP3文件格式输出音频数据。 ## 前言 该项目完全依赖于H5原生API,涉及的关键技术包括:`WebRTC、AudioContext、Worker、Video/Audio API、Blob、URL`。 ## 兼容性 本项目支持Chrome、Firefox(FF)和Edge浏览器。此外,QQ浏览器和360浏览器也具有兼容性,但请注意,目前IE和Safari全版本均不兼容。 Chrome 47及以上版本以及QQ浏览器强制要求HTTPS协议的支持。 为了获得最佳体验,建议您尝试使用Firefox、Edge或360等浏览器进行测试,或者将项目下载到本地并通过localhost的方式进行运行。 ## 使用方法 ```js var recorder = new Recorder({ sampleRate: 44100, //设置采样频率,默认值为44100Hz(标准MP3采样率) bitRate: 128, //设置比特率,默认值为128kbps(标准MP3质量) success: function(){ //录音成功后的回调函数 }, error: function(msg){ //录音失败时的回调函数,msg包含错误信息 }, fix: function(msg){ //H5录音不支持的回调函数 }}); ``` ## API ```js //启动录音 recorder.start(); //停止录音 recorder.stop(); //获取包含MP3编码的Blob格式音频文件的函数 recorder.getBlob(function(blob){ //获取成功回调函数,blob对象即为音频文件// ...},function(msg){ //获取失败回调函数,msg包含错误信息// ...}); ```

全部评论 (0)

还没有任何评论哟~
客服
客服
  • 基于HTML5JavaScriptRecorder.js
    优质
    简介:Recorder.js是一款基于HTML5和JavaScript的开源库,用于实现浏览器中的音频录制功能。它支持多种格式输出,无需插件即可在纯网页环境中使用。 # recorder.js:microphone:基于HTML5的录音功能,输出格式为mp3文件。 ## 前言 完全依赖H5原生API 所涉及的API包括`WebRTC、AudioContext、Worker、Video/Audio API、Blob和URL` ## 兼容性 支持Chrome、FF(Firefox)、Edge及QQ浏览器。需要注意的是,目前IE和Safari全版本不兼容。 其中,在使用Chrome47及以上版本或QQ浏览器时需要强制要求HTTPS的支持。 请尝试通过其他如FF、Edge等浏览器体验该功能,或者将项目下载到本地并通过localhost的方式运行进行测试。 ## 使用方式 ```js var recorder = new Recorder({ sampleRate: 44100, //采样频率,默认为44100Hz(标准MP3采样率) bitRate: 128, //比特率,默认为128kbps(标准MP3质量) success: function(){//成功回调函数 }, error: function(msg){ //失败回调函数,msg包含错误信息 }, fix: function(msg){ //不支持H5录音的处理函数 }}); ``` ## API ```js //开始录音 recorder.start(); //停止录音 recorder.stop(); //获取MP3编码后的Blob格式音频文件 recorder.getBlob(function(blob){ //获取成功时调用,参数blob为生成的音频文件对象。 },function(msg){ //失败回调函数,msg包含错误信息。 }); ```
  • 使JavaScriptHTML5制MP3
    优质
    本教程介绍如何仅用JavaScript在HTML5页面实现音频录制功能,并将文件保存为MP3格式。无需额外插件或库,适合前端开发者学习实践。 以下是使用HTML5与JavaScript录制MP3音频的代码示例: ```html Html5网页JavaScript录制MP3音频

    Html5网页JavaScript录制MP3音频

    调试信息:

    ``` 注意,这段代码使用了`MP3Recorder`类和一个名为`js/worker-realtime.js`的JavaScript工作线程文件来处理音频数据。这些部分需要根据实际情况进行配置或替换。 以上代码中包含了一个简单的用户界面,用于开始、停止录音以及上传录制好的音频到服务器。同时提供了调试信息显示区域以帮助开发者了解程序运行状态和可能存在的问题。
  • 功能之Recorder.js
    优质
    Recorder.js是一款简单易用的JavaScript库,它提供了在网页中录制音频的功能。通过浏览器API,它可以轻松集成到各种Web应用中,为用户提供便捷的录音体验。 这款应用虽然界面有所更新,但核心功能代码并未改动。它模仿了微信的按住录音、释放发送的功能,增加了趣味性。运行时请注意不要使用Sublime Text,而应选择WebStorm,并通过谷歌手机模拟器进行长按操作以确保其正常工作;单独在网页上点击可能无效。
  • HTML5getUserMedia API进行
    优质
    本教程介绍如何使用HTML5及getUserMedia API在网页上实现音频录制功能,帮助开发者轻松获取用户设备的麦克风权限并开始录音。 通过HTML5的getUserMedia API可以在网页上实现录音功能,并且已经在服务器端成功实践,在Chrome 21以上的浏览器版本中可以立即播放音频。本人在更高版本的Chrome(31以上)中实现了这一功能,原DEMO是从国外网站下载而来的。
  • HTML5使JavaScript制MP3频(V2)
    优质
    本教程详细介绍了如何利用HTML5和JavaScript技术在网页上实现MP3音频的录制功能,为开发者提供了一个实用的技术指南。 自 Chrome 版本 47 起,语音录制功能仅在 HTTPS 站点上工作。目前基于 WebKit(如谷歌浏览器)和 Gecko (Firefox 52~57) 的浏览器都支持此功能,但不支持苹果移动设备。测试地址为 https://sms.reyo.cn/ ,用户名为 aa,密码为 123456。
  • HTML5在线功能
    优质
    本项目介绍如何使用HTML5技术实现在网页上进行实时录音的功能。通过简单的代码示例和API讲解,帮助开发者轻松集成音频录制模块到网站中。 HTML5可以实现在线录音功能,并且经过测试已经确认能够正常使用。
  • Dojo基于JavaScript开源DHTML
    优质
    Dojo是一款强大的、模块化的JavaScript框架,旨在简化网页开发并提供丰富的用户界面组件。作为一款开源DHTML工具库,它支持快速构建高效且可扩展的应用程序。 Dojo是一个用JavaScript语言开发的开源DHTML工具包。它基于几个项目(如nWidgets、Burstlib 和 f(m))建立而成,因此被称为统一工具包。其目标是解决在创建 DHTML 应用程序时遇到的历史性问题和跨浏览器兼容性问题。 使用 Dojo 可以让网页更容易具备动态功能,并且可以在任何支持 JavaScript 的环境中运行稳定。 Dojo 具有以下特点: 1. 通过利用 Dojo 提供的组件,可以提升 Web 应用程序的功能、可用性和交互性能。 2. 它使创建互动用户界面变得更加容易。同时提供小巧高效的工具来处理动态操作。 3. 使用其低级 API 和兼容性代码,能够编写简洁且风格一致(复杂程度较低)的 JavaScript 代码。Dojo 的事件系统、I/O 接口以及通用语言结构基于强大的编程环境构建。 4. 提供命令行单元测试功能,便于为自己的代码创建测试脚本。 5. Dojo 扩展包有助于提高自己编写代码的可维护性,并降低耦合度。 尽管具备这些强大特性,Dojo 却通过少量的代码实现。在编写脚本时仅需包含少数几个 JavaScript 文件即可使用其功能;同时也可以选择下载 dojo 提供的各种扩展库以获取更多功能支持。
  • JavaScript输入
    优质
    本工具是一款基于JavaScript开发的网页拼音输入插件,适用于各类中文网站和应用,提供便捷高效的在线汉字录入体验。 这是一款在线的拼音输入法,使用JavaScript编写,支持中文、英文以及半角全角切换等功能。它是一个展示JavaScript效果的好例子。如果您的操作系统自带的输入法出现问题,可以尝试使用这款在线输入法作为替代方案。请记得在开始时将输入法切换到英文状态。
  • 基于HTML5JavaScript屏器设计.zip
    优质
    本项目为一款基于HTML5和JavaScript技术实现的网页录屏工具。它能够高效地录制用户在浏览器中的操作过程,并支持多种格式导出,适用于教学演示、软件测试等多种场景。 资源包含设计报告word文档与项目源码Web录屏器的实现思路类似于工程上所称的操作日志(Operations Log)。其实现原理是通过记录一系列浏览器事件数据,并利用浏览器引擎重新渲染,从而还原之前的操作过程,达到类似“录屏器”的效果。从实际应用来看,即使采用H.265压缩技术将视频体积缩小几百倍,与传统视频流相比,这种基于操作日志的方法至少还能节省出原来的200倍空间。 详细介绍可以参考相关的文献资料。
  • HTML5面中功能
    优质
    本教程详细介绍如何在HTML5页面中集成录音功能,包括使用Web Audio API和Media Recorder API等技术,为网页应用增添互动性。 从Chrome版本47开始,Voice Recording功能仅在HTTPS站点上可用。使用WebKit(如谷歌浏览器)和Gecko(Firefox 52~57)可以实现该功能,但不支持苹果移动设备。我们希望实现在网页上的H5聊天数据发送语音消息的功能,类似微信的体验。