Web Audio API 演示在 iOS 上不起作用

Posted 2023-03-12

【中文标题】Web Audio API 演示在 iOS 上不起作用

【英文标题】：Web Audio API demo doesn't work on iOS

【发布时间】：2017-09-02 04:34:32

【问题描述】：

我目前正在为我正在处理的项目调整此web audio API demo，但在 iPhone 上测试时没有声音。它在 iPad 上运行良好。

我已经搜索了解决方案，并在 *** 上找到了这个 thread，其中一个答案是以下 sn-p：

ios 6 上的 Safari 以静音的 Web Audio API 开始。它 在您尝试在用户输入中播放声音之前不会取消静音 事件（创建缓冲区源，将其连接到目标，然后调用 注意（））。在此之后，它取消静音和音频播放不受限制，并且作为 它应该。这是 Web Audio API 的一个未记录的方面 适用于 iOS 6（Apple 的文档在这里，希望他们用 很快就会提到这个！）

用户输入事件应该是播放按钮上的 onclick 事件，但更改为使用 noteOn() 而不是 start() 仍然不能解决它。

更新：我也尝试将播放按钮与touchend 事件绑定，但无济于事。

下面是使用 noteOn() 的函数：

function playNote(buffer, pan, x, y, z, sendGain, mainGain, playbackRate, noteTime) 
    // Create the note
    var voice = context.createBufferSource();
    voice.buffer = buffer;
    voice.playbackRate.value = playbackRate;

    // Optionally, connect to a panner
    var finalNode;
    if (pan) 
        var panner = context.createPanner();
        panner.panningModel = "HRTF";
        panner.setPosition(x, y, z);
        voice.connect(panner);
        finalNode = panner;
     else 
        finalNode = voice;
    

    // Connect to dry mix
    var dryGainNode = context.createGain();
    dryGainNode.gain.value = mainGain * effectDryMix;
    finalNode.connect(dryGainNode);
    dryGainNode.connect(masterGainNode);

    // Connect to wet mix
    var wetGainNode = context.createGain();
    wetGainNode.gain.value = sendGain;
    finalNode.connect(wetGainNode);
    wetGainNode.connect(convolver);

    if (iOS)         
        voice.noteOn(noteTime);    
    
    else 
        voice.start(noteTime);
    

任何建议将不胜感激。谢谢。

【问题讨论】：

请出示您的代码

我添加了调用 noteOn() 的函数，但代码库非常大。该项目在 Github 上github.com/cwilso/MIDIDrums

原始演示在这里，它也不适用于 iPhone。 webaudiodemos.appspot.com/MIDIDrums/index.html

【参考方案1】：

我觉得自己很愚蠢。显然，如果您的 iPhone 处于振动模式，则不会播放声音。

【讨论】：

这个答案只是为我节省了数小时无果的调试。谢谢！

【参考方案2】：

只要您使用用户交互事件调用该函数，在 iOS 上没有 if else 语句，start() 方法应该可以正常工作。还要翻转将 y 和 z 传递给 panner 的顺序，因为 z 出于某种奇怪的原因排在第二位。 这是一个工作示例，更改其中的内容以适应您的需要，大多数都不需要，而且我在其他地方使用 dom 添加事件侦听器

<script>
    var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
    var oscillator = audioCtx.createOscillator();
    var gainNode = audioCtx.createGain();
    oscillator.connect(gainNode); 
    gainNode.connect(audioCtx.destination);
    oscillator.type = 'sine'; 
    oscillator.frequency.value = 440;

    gainNode.gain.value = 1;
</script>
<button onclick="oscillator.start();">play</button>

【讨论】：

谢谢。我将删除该逻辑并修复 y 和 z。下面是使用playNote()函数绑定播放按钮的方法：document.getElementById('play').addEventListener('touchend', handlePlay, true);

【参考方案3】：

我自己的经验是，有时 Web Audio API 可以在 iPhone 上运行，有时则不能。这是 5 分钟前在我的 iPhone 6s 上运行的页面； 1 分钟前它不起作用；现在它又来了！

http://www.stephenandrewtaylor.net/dna-sonification/

这是另一个间歇性工作的；它在 2 分钟前有效，现在无效（动画有效，只是没有音频）。

http://www.stephenandrewtaylor.net/lie-sonification/

这可能与 Safari 中打开了多少标签有关；您可以尝试关闭一些打开的标签（现在我有 5 个标签，包括 2 分钟前有效但现在无效的 lie-sonificaton 页面）。我也是一名新手程序员，我确信有更好的方法可以编写代码。