Question

我正在尝试将.connect方法链接到我的AudioNode。就像下面的示例一样：https://googlechrome.github.io/samples/webaudio-method-chaining/

它可以在Chrome和Firefox中使用，但在Safari中出现“ TypeError：未定义不是对象（正在评估'source.connect（gainNode）.connect'）”。有什么办法解决这个问题？

const $audioPlayer = document.querySelector('.audio-player')
const audio = new AudioContext()
const gainNode = audio.createGain()
const source = audio.createMediaElementSource($audioPlayer)
source.connect(gainNode).connect(audio.destination)

Answer 1

Safari的Web Audio API的实现不仅是前缀，而且不幸的是也非常过时。 connect()方法始终会在Safari中返回undefined。

要使示例在Safari中运行，您可以重写第2行并将第5行拆分为两个调用。

const $audioPlayer = document.querySelector('.audio-player'); // unchanged

const audio = new webkitAudioContext();

const gainNode = audio.createGain(); // unchanged
const source = audio.createMediaElementSource($audioPlayer); // unchanged

source.connect(gainNode);
gainNode.connect(audio.destination);

如果您要编写代码，使其像针对Web Audio API的最新迭代一样，则可以使用库。

我是standardized-audio-context的作者。还有web-audio-api-shim也可以填充connect()方法。

要使用标准化音频上下文库，您只需要在代码中添加导入语句即可。

import { AudioContext } from 'standardized-audio-context';

// everything else can be left unchanged
const $audioPlayer = document.querySelector('.audio-player');
const audio = new AudioContext();
const gainNode = audio.createGain();
const source = audio.createMediaElementSource($audioPlayer);

source
    .connect(gainNode)
    .connect(audio.destination);

Answer 2

代替创建

const audio = new AudioContext()

尝试使用此代码：

const audioCtx = new (window.AudioContext || window.webkitAudioContext)();

这适用于大多数浏览器。

在Safari中链接.connect（）方法时，获取“未定义不是对象”

2 个答案: