Chrome扩展Background Page iframe加载Discord的静音失效问题及实现需求

场景与需求 #

• 开发Chrome扩展时，在扩展的Background Page中通过iframe加载discord.com/channels/@me页面
• 需要实现对Background Page或该内嵌iframe的全局静音效果

已尝试的失效方案 #

方案1：iframe内注入脚本+MutationObserver监听 #

• 实现逻辑：向目标iframe注入自定义脚本，通过MutationObserver监听DOM节点变动；当观测到节点变化时，遍历页面内所有audio、video标签，执行三项静音操作：设置muted = true、将volume置为0、调用pause()方法
• 失效原因：经排查Discord站点不存在用于音频播放的audio、video标签，整套监听逻辑无法匹配到实际的音频播放节点，MutationObserver也完全观测不到这类元素的变动，因此静音操作无法生效

方案2：通过chrome.tabs API实现页面静音 #

• 实现逻辑：调用Chrome扩展提供的chrome.tabs系列API，直接对目标页面执行浏览器层面的静音操作
• 失效原因：Background Page不属于浏览器常规标签页，chrome.tabs相关API无法定位到该Background Page的目标实例，操作完全无法触达目标上下文，方案失效

内容的提问来源于stack exchange，提问作者ackhack