JSFiddle - React, Tailwind, and code Playground
JavaScript
var context;
if(window.webkitAudioContext) {
context = new webkitAudioContext();
} else {
context = new AudioContext();
}
var audio = new Audio();
// This file does seem to have CORS Header
audio.src = "http://upload.wikimedia.org/wikipedia/en/4/45/ACDC_-_Back_In_Black-sample.ogg";
/**
curl -I "http://upload.wikimedia.org/wikipedia/en/4/45/ACDC_-_Back_In_Black-sample.ogg"
HTTP/1.1 200 OK
X-Object-Meta-Sha1base36: 47ygeya01c3craoc4bix9uy3j5nc8vu
Last-Modified: Thu, 03 Oct 2013 22:51:26 GMT
Etag: 71185323c2ab0179460546a9d0690107
X-Timestamp: 1380840686.21959
X-Content-Duration: 25.0006875
Content-Type: application/ogg
X-Varnish: 2645112073 2623047422, 3322651659
Via: 1.1 varnish, 1.1 varnish
Content-Length: 191675
Accept-Ranges: bytes
Date: Sun, 24 Nov 2013 20:02:53 GMT
Age: 10677
Connection: keep-alive
X-Cache: cp1048 hit (78), cp1063 frontend miss (0)
Access-Control-Allow-Origin: *
**/
var source;
function onCanPlay() {
console.log("can play called");
source = context.createMediaElementSource(audio);
source.connect(context.destination);
audio.removeEventListener("canplay", onCanPlay);
audio.play();
}
if(audio.readyState < 3) {
audio.addEventListener("canplay", onCanPlay);
} else {
onCanPlay();
}