Note that there are some explanatory texts on larger screens.

plurals
  1. POPlaying WebAudio API automatically in iOS 6
    text
    copied!<p>I was performing some tests with the WebAudio API in iOS6. It seems that when you click on a button, the AudioBufferSourceNode will be created correctly and connected to the Contexts destination.</p> <p>I was simply wondering if there was any way of playing a sound automatically when a page is loaded, as iOS6 devices seem to build the SourceNode correctly, but no sound comes out.</p> <p>I have posted my code below:</p> <pre><code>&lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;HTML 5 WebAudio API Tests&lt;/title&gt; &lt;script type="text/javascript"&gt; var audioContext, audioBuffer; function init() { try { audioContext = new webkitAudioContext(); initBuffer('resources/dogBarking.mp3'); } catch(e) { console.error('webkitAudioContext is not supported in this browser'); } } function initBuffer(desiredUrl) { var url = desiredUrl || ''; var request = new XMLHttpRequest(); request.open("GET", url, true); request.responseType = "arraybuffer"; request.onload = function() { audioContext.decodeAudioData(request.response, function(buffer) { audioBuffer = buffer; }, onError); } request.send(); } function playSound(startTime, endTime) { var audioSource = audioContext.createBufferSource(); audioSource.buffer = audioBuffer; audioSource.connect(audioContext.destination); audioSource.noteOn(0); audioSource.noteOff(10); } &lt;/script&gt; &lt;/head&gt; &lt;body onload="init()"&gt; &lt;script type="text/javascript"&gt; (function() { var buttonNode = document.createElement('input'); buttonNode.setAttribute('type', 'button'); buttonNode.setAttribute('name', 'playButton'); buttonNode.setAttribute('onclick', 'playSound(0, 1)') buttonNode.setAttribute('value', 'playSound()'); document.body.appendChild(buttonNode); document.write('&lt;a id="test" onclick="playSound(0, 2)"&gt;hello&lt;/a&gt;'); var testLink = document.getElementById('test'); var dispatch = document.createEvent('HTMLEvents'); dispatch.initEvent("click", true, true); testLink.dispatchEvent(dispatch); }()); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>I hope this makes sense. Kind regards, Jamie.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload