图片来源:Chrome插件Yunyinle听歌曲
本文的作者:Kongwu
当您使用网页在视频网站上刷视频时,您是否遇到了引起内部波浪的BGM,但您不知道它的名称。这次,您只能打开手机来收听歌曲,并且更容易通过浏览器插件来解决此问题。不需要乏味地拿出手机,也不会干扰他人,因为它需要释放,更不用说由于环境噪音而确定困难。
如果您碰巧有这种需求,请尝试使用Yun Music制作的Chrome浏览器插件 - Yun Yinle聆听歌曲,您也可以直接收集红色的心收藏。预览实际操作的实际效果。
目前,Chrome商店中的大多数听力和知识插件都是由外国生产的,而家用产品很少。它对家庭音乐的支持很差。由于Yun音乐具有这种能力,我们希望涵盖此功能以覆盖每个角落并传达音乐的美丽力量。在同一时间,市场上的大部分插件仍在实施基于清单V2(与清单V3,安全性差,性能和隐私相比),一般方法是将音频记录直接移交给服务器,并通过服务器端执行指纹进行指纹。服务器增加压力并增加网络传输。因此,是否有一种方法可以使用清单V3协议来实现该功能,同时,将音频指纹提取放置在前端?
本文的重点不是实现浏览器插头本身。如果您不了解插件本身的开发,则可以检查Google的官方开发文档。
特别解释的是,清单V2(MV2)即将被放弃,并且逐渐不接受2022年的更新。它将在2023年逐渐无法运行。本文的所有内容均基于更安全,更好的性能(MV3)实施。
协议升级还可以为该函数的实现带来一些更改,因为MV3更安全,并且一些不安全的方法,例如MV2的灵活实现(例如:执行远程代码,您可以使用eval,新功能(。..)和其他不安全的方法)不会使用它。这将带来一些实现困难来聆听歌曲。
核心影响点上的MV3协议在实现插件-in的实现:
浏览器插件中的音频提取实际上非常简单,可以在网页上录制音频和视频录制。您只需要API即可获得网页本身的录音。我们需要对音频数据进行采样,以确保将数据库数据的规则计算一致。
对于所获得的流流,可以转录和采样音频。通常有三种处理方法:
Audiooorkletnode的方法实现了音频样本和采样持续时间控制方法:
init(callback){this.callback = callback;this.port.onmessage =(event)=> this.onmessage(event.data);}
onMessage(event){if(event.type ==='getData'){if(this.callback){this.callback(event.result);}}}}}}}}
const node = new PitchNode(Audio_ctx,“ PitchProcessor”);
以收集数字信号的第一个输入通道的第一个通道,并在收集定义长度后将信号识别处理收集到主线程(例如48000此处)。
根据方法,您可以进行许多有趣的尝试,例如最基本的白噪声产生。
从音频信号中提取音频指纹提取后,下一步是使指纹提取信号数据。我们提取的实际上是二进制数据的一部分。傅立叶变换需要转换为频域信息的特征表示。特定指纹提取的逻辑是一组常规复杂算法。常规的指纹提取方法:1)基于频带能量的音频指纹;您可以读取相关论文,例如:高度强大的音频指纹系统。整个操作都有一定的性能要求。对于WebAssembly进行操作,它可以获得更好的CPU性能。TODAY,C ++/C/RUST具有一种相对方便的方式来编译到WebAssembly字节码中,在这里不会扩展。
接下来,当您尝试在插件场景中初始化WASM模块时,您可能会有以下异常:
这是因为当使用WebAssembly时,您需要遵循严格的CSP定义,并且可以通过添加语句来解决Chrome MV2的声明。在MV3上,由于严格的隐私和安全性限制,已允许这种简单而粗鲁的执行方法.in mv3,只有定义插件的定义的允许值是:
换句话说,此安全性在沙盒模式下受到限制。插头 - 本身可以定义沙盒页面。尽管此页面无法访问Web/Chrome API,但它可以运行一些如此符合的“不安全”方法,例如。因此,您可以使用Sandbox页面加载并运行WASM模块,将计算结果返回到主页,总体指纹收集过程如下所示:
对于主页和沙盒页面上的数据通信,您可以使用iframe的ContentWindow和主窗口来通过在主页上加载iframe来执行数据连接。数据过程如下:图:
此时,基本的音频提取和指纹提取过程已经完成。其余部分是通过指纹匹配功能。
在特征性匹配的音频指纹之后,下一步是在指纹库中进行音频检索。指纹库可以在传播列表中实现。每个表项代表与同一指纹相对应的音乐ID和音乐的时间,并构建了指纹数据库。访问数据库的指纹可以获得匹配的歌曲。当然,这只是一个基本过程。特定算法优化方法仍然非常不同。除了版权原因外,该算法还直接导致每种匹配的效率和准确性。插头的实现仍然是有效的。
以上通常描述了基于聆听MV3的实现的一般过程。尽管插头很灵活且易于使用,但Google还实现了插件带来的一些安全性和隐私问题,因此很大 -比例迁移。MV3协议是更多的隐私和安全性,但它也限制了许多功能的实现。2023年之后,将有大量无法使用的插头。
当前收听歌曲和素养的歌曲的完成包括音频识别,红色的歌曲收集等,并将在将来继续扩展功能扩展。我希望这个小型功能可以为您提供帮助。
本文是从NetEase Cloud Music Technology团队发行的,该文章将在未经任何授权的情况下复制。我们全年招募各种技术职位。如果您要更改工作,就像云音乐一样,请加入我们的grp.music-fe(at)corp.netease.com!
原始:https://juejin.cn/post/7094083239702659109