Safari 上的 AudioContext

Posted 2023-02-25

【中文标题】Safari 上的 AudioContext

【英文标题】：AudioContext on Safari

【发布时间】：2015-03-31 16:23:48

【问题描述】：

昨天，我有a question about the noteOn method of the AudioContext object。 我现在已经在这个 AudioContext 对象上彻底改变了自己。 这是我在桌面上的 Safari 中尝试过的方法及其相关的错误消息：

	var ctx
//	ctx = new(AudioContext || webkitAudioContext); // ReferenceError: Can't find variable: AudioContext
//	ctx = new(audioContext || webkitAudioContext); // ReferenceError: Can't find variable: audioContext
//	ctx = new(window.AudioContext || webkitAudioContext); // ReferenceError: Can't find variable: webkitAudioContext
	ctx = new(window.AudioContext || window.webkitAudioContext);
// TypeError: 'undefined' is not a constructor (evaluating 'new(window.AudioContext || window.webkitAudioContext)')

问：如何定义 myAudioContext 以使其适用于所有浏览器？

【问题讨论】：

我按照html5Rocks 上的第一个示例，我得到''Web Audio API is not supported in this browser'。

这很有趣。我的帮助关于说我是 Safari 5.1.7...

是的，Safari 仅在 6.1 或更高版本上支持 Web Audio API。

Apple 说最新版本是5.1.7。

这仅适用于 Windows 和 Mac OS X（或更低版本）的 Safari。在 Mac OS Mountain Lion 上，支持的最高 Safari 版本是 6，在 Mavericks 上是 7，在 Yosemite 上是 8（最新版本）。

【参考方案1】：

浏览器支持限制

并非所有浏览器都支持Web Audio API（id est AudioContext）。某些浏览器可能会将其前缀为供应商前缀，但较旧的浏览器根本不支持它。因此，回答您的问题：您不能在所有浏览器上使用AudioContext。

尽管如此，您仍然可以使用功能检测在受支持的浏览器上使用 Web Audio API（见下文），或者只需检查您的浏览器是否支持它here。查看并找到您的 Safari 版本：该网站会告诉您该功能是否可用，如果有前缀，您必须使用哪个前缀。

AudioContext特征检测

为了确保您可以在支持它的任何浏览器上使用网络音频 API，您可以使用特征检测以及相对于供应商前缀对象的回退。如果不支持 AudioContext 对象，您将停止执行脚本并提醒用户。这是一个例子：

var AudioContext = window.AudioContext // Default
    || window.webkitAudioContext // Safari and old versions of Chrome
    || false; 

if (AudioContext) 
    // Do whatever you want using the Web Audio API
    var ctx = new AudioContext;
    // ...
 else 
    // Web Audio API is not supported
    // Alert the user
    alert("Sorry, but the Web Audio API is not supported by your browser. Please, consider upgrading to the latest version or downloading Google Chrome or Mozilla Firefox");

请注意，截至目前，webkit 是唯一现有的供应商前缀 AudioContext，因为 Mozilla 和 Opera 使用常规的无前缀对象，而 IE 还不支持 Web Audio API。

【讨论】：

我认为我不能接受“不”作为答案。也许我应该更仔细地表达我的问题：这样它就可以在内置它的浏览器上运行。

It will not unmute until you attempt to play a sound in a user input event

最新稳定版 Chrome：'webkitAudioContext' 已弃用。请改用“AudioContext”。。似乎 AudioContext 现在在所有主要的现代浏览器中都没有前缀。不知道 Safari，因为 Windows 版本自 2012 年以来没有更新

@bryc 没什么意思，老版本的浏览器还是需要前缀的

当然这意味着什么，这意味着 API 正在迅速成为标准。这意味着来自不推荐使用的方法（如 noteOn 和 createjavascriptNode 或 Firefox 的音频数据 API）的损坏代码更少。那里有很多损坏的 WebAudio 代码。只有 OS X 上的 Safari 留下了 webkit 前缀，我相信当他们发布新版本的 OS X (??) 时会更新。

【参考方案2】：

  var AudioContext = window.AudioContext // Default
      || (window as any).webkitAudioContext;// Safari and old versions of Chrome

    this.audioContext = new AudioContext();

【讨论】：

虽然此代码可以解决 OP 的问题，但最好包含关于您的代码如何解决 OP 问题的说明。通过这种方式，未来的访问者可以从您的帖子中学习，并将其应用到他们自己的代码中。 SO 不是编码服务，而是知识资源。此外，高质量、完整的答案更有可能得到支持。这些功能，以及所有帖子都是独立的要求，是 SO 作为一个平台的一些优势，使其与论坛区分开来。您可以编辑以添加其他信息和/或使用源文档补充您的解释。

如果您使用的是 TypeScript，那么您最好在项目的根目录中添加 webkitAudioContext 的声明，而不是诉诸 any。我在当前项目的declaration.d.ts 文件中使用interface Window webkitAudioContext: typeof AudioContext 。