## 一、背景：最近在写毕设，一个Web即时通讯平台，其中我想加个功能, 就是可以录制音频发送 ![GIF 2023-12-11 13-25-42.gif](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0410cc16bcba4ddaa4e05b3cd63330bf~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=1190&h=387&s=353068&e=gif&f=37&b=f9eff1) 故我先在网上找寻了一下，看到了挺多大佬文章都是基于`ScriptProcessorNode`去实现功能，比如说 - [如何实现前端录音功能 - 知乎 (zhihu.com)](https://zhuanlan.zhihu.com/p/43581133) - 还有使用量很高的 [js-audio-recorder - npm (npmjs.com)](https://www.npmjs.com/package/js-audio-recorder) 我一开始直接使用了`js-audio-recorder`，不过在使用的过程中发现已经给出了警告说`ScriptProcessorNode`已经被摒弃了。目前需要用`AudioWorkletNode`去替换掉。这一下子就提起我的兴趣了 ![image.png](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/b983efa3bb034ad7b5c825010194b205~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=613&h=91&s=9521&e=png&b=fef1e4) 故又找到了MDN去确认一下，可以看到在14年该API就被弃用了，随时可能无法正常工作。当然，我试过了目前还是能用的，但是按捺不住我想尝试的心啦 ![image.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/993322346cbd43f4811e938b7be242b2~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=1500&h=343&s=56041&e=png&b=fefefe) 故此篇会探索一下如何使用`AudioWorkletNode`去实现功能。 **当然，在此之前要先研究一下，录制音频功能，具体需要干嘛** **研究之前，总要先打好基础吧** ## 二、基础铺垫 #### Web Audio 一段介绍让你快速走进`Web Audio`： `Web Audio API` 并不会取代`