有没有可能在 IOS 上控制 HTML5 音量？

Question

我使用 html5 音频库Buzz为浏览器游戏添加声音。 有一个用于静音和取消静音的切换按钮，适用于桌面和 Android 设备。 不幸的是，iOS 上的音频标签似乎非常有限，因此我无法在 Mobile Safari 中静音（请参阅https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Introduction/Introduction. html ):

在 iOS 设备上，音频电平始终在用户的物理控制之下。 音量属性在 JavaScript 中不可设置。 读取 volume 属性总是返回 1。

您知道在 Mobile Safari 中控制 html5 音频标签音量的任何解决方法吗？

Answer 1

要为 iOS 添加音量更改支持而不是为此将整个应用程序从 html5 音频重写为 Web 音频，您可以通过createMediaElementSource组合这些音频解决方案。

请在 Mozilla 网站上查看更多详细信息https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaElementSource

Answer 2

众所周知，我一直认为动态音量控制和交叉淡入淡出是不可能的。 苹果已经规定了它是这样的。 除了.... 显然，Kodo Games 的人（特别是 Nicola Hibbert？）已经成功了，并将代码提供给任何人。 我刚刚在 iOS 8 上检查过。淡入淡出和交叉淡入淡出似乎有效！

看看（新网站有效）： Web Audio API 入门

Answer 3

似乎您可以设置muted属性而不是更新音量值。 适用于 iOS 15

  /**
   * Set volume of sound object
   * @param volume
   */
  setVolume (volume) {
    const muted = volume === 0
    // iOS workaround when volume is 0
    this.sound.muted = muted
    this.sound.volume = volume
  }

Answer 4

我通过简单地停止所有声音并将变量isMuted设置为 true 或 false 来解决此问题，因此我可以在播放声音的任何地方检查这一点：

// set the variable
var isMuted = false;

// toggle audio
function toggleMute() {

    var toggleAudioBtn = $(".toggleAudio");

        if (isMuted == false) {
            sounds.stop();
            isMuted = true;
            toggleAudioBtn.css("background-image", "url('images/ui/btn_audio_mute.png')");
        } else {
            isMuted = false;
            toggleAudioBtn.css("background-image", "url('images/ui/btn_audio.png')");
        }

};

// for every sound check if sound is muted
if(isMuted == false) {
    sound.play();
}