iPad上的iOS禁用Web Audio API

Question

Please note: This issue was fixed Nov 2016 in iOS 10.1.1. 请注意：此问题已于2016年11月在iOS 10.1.1中修复。 Thank you Apple! 谢谢Apple！

I am unable to play any audio through Web Audio API on iPad. 我无法通过iPad上的Web Audio API播放任何音频。 This is using the latest version of iOS (since 9.3.2 - currently 10.1). 这是使用最新版本的iOS（从9.3.2开始 - 目前为10.1）。

Test Case 测试用例

Here is a bare-bones test I have set up (code below). 这是我设置的一个简单的测试（下面的代码）。 None of the tests work on iPad for me. 这些测试都不适用于我。 No problems on iPhone or other compatible browsers. 在iPhone或其他兼容的浏览器上没有问题。 There is another test page here (from William Malone). 这里有另一个测试页面（来自William Malone）。 None of those sounds play on three iPads tried. 这些声音都没有在三台iPad上播放过。 Finally this game uses Web Audio API (thanks Derek) and is also muted. 最后这个游戏使用Web Audio API（感谢Derek）并且也很静音。

If you are reading this on iPad, please try that bare-bones test and report in the comments (or contact me privately ) if load, followed by play, works and plays sound. 如果您正在iPad上阅读此内容，请尝试进行简单的测试并在评论中报告（或私下与我联系），如果加载，播放，播放，播放声音。 Please include iOS version number (Settings -> General -> About -> Version). 请包含iOS版本号（设置 - >常规 - >关于 - >版本）。

Any insights or feedback would be much appreciated! 任何见解或反馈将非常感谢！

Here is the test code: 这是测试代码：

<!DOCTYPE html>
<html>
<head>
    <title>Web Audio API - iPad Test</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="./jquery-2.2.3.min.js"></script>
    <style>
        section { padding:10px; margin:0 0 10px; background:DarkSeaGreen }
        a { cursor:pointer; display:block; background: DarkSeaGreen; padding:10px; margin:0 0 3px }
    </style>
</head>
<body>
    <script>
        var app = {};
        $(document).ready(function() {
            // Do we have Web Audio API?
            try {
                window.AudioContext = window.AudioContext || window.webkitAudioContext;
                audioContext = new AudioContext();
            } catch (e) {
                alert('Web Audio API is not supported in this browser');
            }
            $('#loadClick').on('click',function(){load('./ipad_test.mp3')});
            $('#playTouchEnd').on('touchend',play);
            $('#playTouchStart').on('touchstart',play);
            $('#playClick').on('click',play);
            $('#unlockTouchEnd').on('touchend',unlock);
            $('#unlockTouchStart').on('touchstart',unlock);
            $('#unlockClick').on('click',unlock);
        });
        function unlock() {
            // play empty buffer to unmute audio
            var buffer = audioContext.createBuffer(1, 1, 22050);
            var source = audioContext.createBufferSource();
            source.audioContext = buffer;
            source.connect(audioContext.destination);
            source.start(0);
            $('#messages').append('<p>Unlocked.</p>');
        }
        function load(file) {
            if(app.loaded) {
                $('#messages').append('<p>Already loaded.</p>');
                return;
            }
            var request = new XMLHttpRequest();
            request.open ('GET', file, true);
            request.responseType = 'arraybuffer';
            request.onload = function () {
                audioContext.decodeAudioData(
                        request.response,
                        function (buffer) {
                            app.buffer = buffer;
                            $('#messages').append('<p>Loaded.</p>');
                            app.loaded = 1;
                        },
                        function(){alert('Load error.');}
                )
            };
            request.send();
        }
        function play() {
            if(!app.loaded) {
                $('#messages').append('<p>Please load before playing.</p>');
                return;
            }
            var sourceNode = audioContext.createBufferSource();
            sourceNode.buffer = app.buffer;
            sourceNode.connect (audioContext.destination);
            sourceNode.start(0);
            $('#messages').append('<p>Playing.</p>');
        }
    </script>
    <h1>Web Audio API Test</h1>
    <p>Unlock should not be needed at all, but offers an alternative way to try and get the audio going. Load and then play should be all any compatible device needs. Refresh to start again.</p>
    <a id="unlockTouchEnd">Unlock (touchend)</a>
    <a id="unlockTouchStart">Unlock (touchstart)</a>
    <a id="unlockClick">Unlock (click)</a>
    <a id="loadClick" style="background:#c0c0c0">Load (click)</a>
    <a id="playTouchEnd">Play Audio (touchend)</a>
    <a id="playTouchStart">Play Audio (touchstart)</a>
    <a id="playClick">Play Audio (click)</a>
    <section id="messages"></section>
</body>
</html>

Background 背景

The Apple documentation makes it clear that audio must be initiated from a user action for Web Audio API to work. Apple文档清楚地表明，必须从用户操作启动音频才能使Web Audio API正常工作。 They state: 他们说：

Note: On iOS, the Web Audio API requires sounds to be triggered from an explicit user action, such as a tap. 注意：在iOS上，Web Audio API需要通过显式用户操作触发声音，例如点按。 Calling noteOn() from an onload event will not play sound. 从onload事件调用noteOn（）将不会播放声音。

There are a number of threads online about problems with this, the latest being autumn 2015 with iOS 9.0 to 9.2: 网上有很多线程关于这方面的问题，最新的是2015年秋季iOS 9.0到9.2：

Thread from HTML 5 Game Devs (autumn 2015 problems) 来自HTML 5 Game Devs的线程（2015年秋季问题）
William Malone (autumn 2015 problems) 威廉马龙（2015年秋季问题）
Paul Bakaus (unlocking techniques) Paul Bakaus （解锁技术）
Adrian Holovaty (autumn 2015 problems) Adrian Holovaty （2015年秋季问题）

They suggest firing audio from a touchstart event to unlock iOS audio (or touchend while there were issues at that time). 他们建议从触摸启动事件中触发音频来解锁iOS音频（或者在当时存在问题时进行触摸）。 I have tried all of the suggested techniques and can't get touchstart, touchend or click to work. 我已经尝试了所有建议的技术，无法获得touchstart，touchend或点击工作。 The audio is always muted on iPad. iPad上的音频始终静音。

Answer 1

Apple在2016年11月的iOS 10.1.1中解决了这个问题。谢谢Apple！

iPad上的iOS禁用Web Audio API

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-12-01 03:36:24

iPad上的iOS禁用Web Audio API

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-12-01 03:36:24

解决方案1
0 已采纳 2016-12-01 03:36:24