几行代码把Chrome搞崩溃之：HTML5 MP3录音由ScriptProcessorNode升级成AudioWorkletNode采坑记

最新推荐文章于 2024-09-02 09:20:12 发布
最新推荐文章于 2024-09-02 09:20:12 发布
阅读量541 收藏
点赞数
分类专栏： it 文章标签： chrome html5 前端 计算机
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/www_xuhss_com/article/details/123398760
版权
本文记录了在尝试使用AudioWorkletNode替换ScriptProcessorNode进行HTML5 MP3录音时遇到的Chrome浏览器崩溃问题。作者通过现象复现和填坑处理，发现状态下的AudioContext在特定情况下会导致崩溃。解决方案包括确保用户操作后再创建AudioContext或调用resume()。然而，新版本在移动端存在录音变短的性能问题，因此暂时恢复了旧的实现。完整代码实现可在recorder-core.js的指定行查看。
摘要由CSDN通过智能技术生成

Python微信订餐小程序课程视频

https://edu.csdn.net/course/detail/36074

Python实战量化交易理财系统

https://edu.csdn.net/course/detail/35475

关键词: STATUS_ACCESS_VIOLATION AudioContext AudioWorkletNode audioWorklet addModule resume suspended createScriptProcessor
搞崩Chrome测试页：测试页地址

目录* 事件起因

事件起因

我前些年GitHub开源的前端H5录音库：https://github.com/xiangyuecn/Recorder，提供了 mp3 wav ogg webm amr 格式支持，拥有丰富的音

最低0.47元/天 解锁文章
www_xuhss_com
关注
专栏目录
使用chrome爬取URL数据的实战代码
herosunly的博客
01-27 1万+
本文主要介绍了使用chrome爬取URL数据的实战代码，希望能对使用chrome的同学们有所帮助。 文章目录 1. 问题描述 2. 解决方案
Chrome导出cookie的实战教程
热门推荐
weixin_43178406的博客
06-29 8万+
本文主要介绍了Chrome导出cookie的实战教程，希望能对使用Chrome的同学们有所帮助。 文章目录 1. 问题描述 2. 实战工具一 3. 实战工具二
recorder-audio-worklet:该模块为 RecorderAudioWorkletProcessor 和对应的 RecorderAudioWorkletNode 提供了一个加载器
08-03
录音机音频工作集 该模块为 RecorderAudioWorkletProcessor 和相应的 RecorderAudioWorkletNode 提供了一个加载器。
Web前端JS通过使用AudioWorkletNode() 获取 Video/Audio 视音频声道(左右声道|多声道)
沐枫
12-18 2803
在之前的博文【Web前端JS如何获取 Video/Audio 视音频声道(左右声道|多声道)、视音频轨道、音频流数据】中，介绍了通过使用AudioContext.createScriptProcessor()方法来获取视音频音轨（声道）数据。但由于W3C不再推荐使用该AudioContext.createScriptProcessor()特性。所以在不久的将来也许会从相关的Web标准中移除，也许正准备移除或出于兼容性而保留。
音频处理新纪元：探索AudioWorklet Polyfill
最新发布
gitblog_00430的博客
09-02 921
音频处理新纪元：探索AudioWorklet Polyfill audioworklet-polyfill???? Polyfill AudioWorklet using the legacy ScriptProcessor API.项目地址:https://gitcode.com/gh_mirrors/au/audioworklet-polyfill 在数字音频领域，原生的Web Audio API...
soundtouchjs-audio-worklet:实现SoundTouchJS的AudioWorkletNode和AudioWorkletProcessor
05-01
SoundTouchJS音频工作包 SoundTouchNode是Web Audio API 的扩展。 它与SoundTouchWorklet配合使用，是处理缓冲区中音频的 。 在使用该节点之前，必须在代码中注册该Worklet。 该节点表示为一个真实的 。 浏览器和使用注意事项 目前仅在Chrome，MS Edge和Electron（带有hack）中可用。 我们使用RollupJS和Babel来编译我们所有的依赖项。 使用本机WebAudio API时，SoundTouchWorklet在主线程之外的上下文中运行。 因此，Babel运行时与其他工作项依赖项捆绑在一起。 所有必需的位都已预编译到工作区中，并且SoundTouchNode控制它们的属性。 向您的应用程序添加Worklet / Webworkers可能很棘手。 阅读下面的文档以获取更多信息。 设置AudioWorkletPr
web AudioContext 与AudioWorkletNode
06-20 763
web AudioContext 与AudioWorkletNode
几行代码解决京东购物界面
流楚丶格念的博客
07-10 9291
文章目录完整项目界面展示GIF界面代码index.htmlindex.css（中间主要部分）base.css（头部，尾部）normal.css图片资源 完整项目 https://download.csdn.net/download/weixin_45525272/12596801 界面展示 GIF 界面代码 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">
代码之谜（五）- 浮点数（谁偷了你的精度？）
justjavac(迷渡)
11-13 1万+
****光棍节加长版**** 如果我告诉你，中关村配置最高的电子计算机的计算精度还不如一个便利店卖的手持计算器，你一定会反驳我：「今天写博客之前又忘记吃药了吧」。 你可以用最主流的编程语言计算 0.2 + 0.4，如果你使用的是 Chrome、FireFox、IE 8+，可以按 F12 键，然后找到 「控制台」，输入上面的 表达式 0.2 + 0.4，回车。 然后再用最简陋的
modplayer-js：使用AudioWorklet API的SoundTracker Mod文件JavaScript播放器
02-05
modplayer-js 使用webaudio API的 / Noisetracker mod文件JavaScript播放器。 有关演示，请前往。 要求 modplayer-js需要使用支持的浏览器，并且如果检测到新的 ，它将使用新的 （因为我正在发布，因此只有Chrome支持）。 这些浏览器使用本机AudioWorklet API： Chrome 70（OSX，Windows） 在以下浏览器中，Modplayer-js将回退到不赞成使用的ScriptProcessorNode API： Safari 11.1.2（OSX和iOS） Firefox 62.0（OSX） Edg
Vue3 中使用 AudioWorklet 获取麦克风音量
qq_37962440的博客
04-11 1574
AudioWorklet 用于提供在单独线程中执行的自定义音频处理脚本，以提供非常低延迟的音频处理。之前提议处理音频使用，但是它被设计成了异步的形式，随之而来的问题就是处理会出现 “延迟”。AudioWorklet 的代码在 AudioWorkletGlobalScope 全局执行上下文中运行，使用由工作集和其他音频节点共享的单独的 Web 音频线程。
Chrome 66 新特性：CSS 类型对象模型，异步剪贴板 API，AudioWorklet，等
justjavac的专栏
03-31 436
原文链接：https://blog.chromium.org/2018/03/chrome-66-beta-css-typed-object-model.html除非另有说明，否则下文所述的更改适用于 Android，Chrome OS，Linux，macOS 和 Windows 的最新 Chrome Beta 版本。在 ChromeStatus 上查看 Chrome 66 中完整的特性列表。 的
移动端实现HTML5 mp3录音踩坑指南：系统播放音量变小、一些机型录音断断续续 之 MediaRecorder和AudioWorklet的终极对决
虚幻私塾
08-14 1100
目录*
AudioWorklet Polyfill 使用教程
gitblog_00085的博客
04-19 285
AudioWorklet Polyfill 使用教程 audioworklet-polyfill ???? Polyfill AudioWorklet using the legacy ScriptProcessor API. 项目地址: https://gitcode...
ScriptProcessorNode
Claroja
02-09 1337
弃用(被AudioWorklet替代) 是AudioNode,有input audio data,还有output audio data 2个buffer. input和output buffer在创建的时候被定义,bufferSize必须是 256~163384,且是2的n次幂(256, 512, 1024, 2048, 4096, 8192 or 16384),越高音质越好,越低延迟越低 构...
Elasticsearch摄取节点（九）——安全用户、浏览器信息、自定义脚本处理器
大风的博客
12-13 363
安全用户、浏览器信息、自定义脚本处理器 1. Script Processor 此处理器允许在接收管道中执行内联和存储的脚本 2. Set Security User Processor 此处理器，将当前经过身份验证的用户的用户相关详细信息（如用户名、角色、电子邮件、全名和元数据）设置为当前文档。 3. User Agent processor 此处理器从浏览器随其web请求发送的用户代理字符串中...
Web端录音数据回传unity
weixin_44250118的博客
08-27 720
js部分 var WebLibrary = { $audioInput: {}, $recorder: {}, $chunks: {}, $audioContext: {}, Init: function (url) { //初始化录音 navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || na
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值