Skip to content

Instantly share code, notes, and snippets.

@kus

kus/fixIOSAudioContext.js

Last active May 22, 2025 16:45
Download ZIP

Revisions

  1. kus renamed this gist Dec 6, 2015. 1 changed file with 0 additions and 0 deletions.
    0 example.html → test.html
    View file
    File renamed without changes.
  2. kus revised this gist Dec 6, 2015. No changes.
  3. kus revised this gist Nov 19, 2015. 2 changed files with 2 additions and 2 deletions.
    2 changes: 1 addition & 1 deletion example.html
    View file
    Original file line number Diff line number Diff line change
    @@ -12,7 +12,7 @@ <h1>iOS Safari AudioContext Demo</h1>
    <p>Refresh the page touch the screen (within 3 seconds of it loading) and the audio and any other audio will play outside of a user generated event.</p>
    <p id="status">Waiting 3 seconds to play audio...</p>
    <script type="text/javascript">
    // Fix iOS Audio Context by Blake Kus http://github.com/kus
    // Fix iOS Audio Context by Blake Kus https://gist.github.com/kus/3f01d60569eeadefe3a1
    // MIT license
    (function() {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    2 changes: 1 addition & 1 deletion fixIOSAudioContext.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    // Fix iOS Audio Context by Blake Kus http://github.com/kus
    // Fix iOS Audio Context by Blake Kus https://gist.github.com/kus/3f01d60569eeadefe3a1
    // MIT license
    (function() {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
  4. kus created this gist Nov 19, 2015.
    72 changes: 72 additions & 0 deletions example.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,72 @@
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Fix iOS Audio Context</title>
    <meta name="author" content="Blake Kus">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
    <h1>iOS Safari AudioContext Demo</h1>
    <p>Load on iOS device without touching the screen and it will not play a noise after 3 seconds.</p>
    <p>Refresh the page touch the screen (within 3 seconds of it loading) and the audio and any other audio will play outside of a user generated event.</p>
    <p id="status">Waiting 3 seconds to play audio...</p>
    <script type="text/javascript">
    // Fix iOS Audio Context by Blake Kus http://github.com/kus
    // MIT license
    (function() {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    if (window.AudioContext) {
    window.audioContext = new window.AudioContext();
    }
    var fixAudioContext = function (e) {
    if (window.audioContext) {
    // Create empty buffer
    var buffer = window.audioContext.createBuffer(1, 1, 22050);
    var source = window.audioContext.createBufferSource();
    source.buffer = buffer;
    // Connect to output (speakers)
    source.connect(window.audioContext.destination);
    // Play sound
    if (source.start) {
    source.start(0);
    } else if (source.play) {
    source.play(0);
    } else if (source.noteOn) {
    source.noteOn(0);
    }
    }
    // Remove events
    document.removeEventListener('touchstart', fixAudioContext);
    document.removeEventListener('touchend', fixAudioContext);
    };
    // iOS 6-8
    document.addEventListener('touchstart', fixAudioContext);
    // iOS 9
    document.addEventListener('touchend', fixAudioContext);
    })();

    var $status = document.querySelector('#status');

    function playSound () {
    var path = '../sounds/laser.mp3';
    var context = window.audioContext;
    var request = new XMLHttpRequest();
    $status.innerHTML = 'Playing ' + path;
    request.open('GET', path, true);
    request.responseType = 'arraybuffer';
    request.addEventListener('load', function (e) {
    context.decodeAudioData(this.response, function (buffer) {
    var source = context.createBufferSource();
    source.buffer = buffer;
    source.connect(context.destination);
    source.start(0);
    });
    }, false);
    request.send();
    }

    setTimeout(playSound, 3000);
    </script>
    </body>
    </html>
    33 changes: 33 additions & 0 deletions fixIOSAudioContext.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,33 @@
    // Fix iOS Audio Context by Blake Kus http://github.com/kus
    // MIT license
    (function() {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    if (window.AudioContext) {
    window.audioContext = new window.AudioContext();
    }
    var fixAudioContext = function (e) {
    if (window.audioContext) {
    // Create empty buffer
    var buffer = window.audioContext.createBuffer(1, 1, 22050);
    var source = window.audioContext.createBufferSource();
    source.buffer = buffer;
    // Connect to output (speakers)
    source.connect(window.audioContext.destination);
    // Play sound
    if (source.start) {
    source.start(0);
    } else if (source.play) {
    source.play(0);
    } else if (source.noteOn) {
    source.noteOn(0);
    }
    }
    // Remove events
    document.removeEventListener('touchstart', fixAudioContext);
    document.removeEventListener('touchend', fixAudioContext);
    };
    // iOS 6-8
    document.addEventListener('touchstart', fixAudioContext);
    // iOS 9
    document.addEventListener('touchend', fixAudioContext);
    })();