扩展音频/HTMLMediaElement javascript 对象
Posted
技术标签:
【中文标题】扩展音频/HTMLMediaElement javascript 对象【英文标题】:Extending Audio / HTMLMediaElement javascript object 【发布时间】:2012-07-15 14:45:00 【问题描述】:我需要扩展 Audio 对象以提供停止功能。通常这段代码可以工作:
Audio.prototype.stop = function()
this.pause();
this.currentTime = 0;
但是,我需要在 Chrome 扩展程序的内容脚本中执行此操作,并且由于上下文是分开的,因此更改不会传播到其他上下文。
我曾尝试使用 this unsafeWindow
hack 尝试突破隔离环境,但没有成功,并尝试使用 Object.create 并设置 constructor
属性。
【问题讨论】:
内容脚本永远无法访问页面的全局window
对象。问题与Building a Chrome Extension - Inject code in a page using a Content script 重复。旁注,我会使用if (!Audio.prototype.stop) ...;
,以避免在实现stop
时发生冲突。
【参考方案1】:
内容脚本有一个独立的执行环境,但它与页面共享 DOM。你可以通过在DOM中添加<script>
标签,在页面的实际执行环境中运行脚本:
var s = document.createElement("script");
s.innerText = "Audio.prototype.stop = function() this.pause(); this.currentTime = 0; ";
document.documentElement.appendChild(s);
我相信这段代码会在两个执行环境中运行脚本(或者至少应该在页面环境中运行)。
请注意,此解决方案只能在资源加载期间或之后运行脚本,而不是在 DOM 完成后立即运行,因为它需要浏览器处理添加到页面的新脚本资源。对于您当前的需求,这应该不是问题。
【讨论】:
以上是关于扩展音频/HTMLMediaElement javascript 对象的主要内容,如果未能解决你的问题,请参考以下文章
HTML5 音频元素 - 搜索滑块 - 无法在“HTMLMediaElement”上设置“currentTime”属性:提供的双精度值是非有限的
故意使 HTMLMediaElement 或 HTMLVideoElement 缓冲区无效或清除?
Android:“无法在'HTMLMediaElement'上执行'play':API只能由用户手势启动[重复]
如何在 canplay 事件中设置 HTMLMediaElement 的 .currentTime,调用 play 并避免调度 pause 事件?