JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" id="file">

JavaScript

var context = new (window.AudioContext || window.webkitAudioContext)();
function playsound(raw) {
    console.log("now playing a sound, that starts with", new Uint8Array(raw.slice(0, 10)));
    context.decodeAudioData(raw, function (buffer) {
        if (!buffer) {
            console.error("failed to decode:", "buffer null");
            return;
        }
        var source = context.createBufferSource();
        source.buffer = buffer;
        source.connect(context.destination);
        source.start(0);
        console.log("started...");
    }, function (error) {
        console.error("failed to decode:", error);
    });
}

function onfilechange(then, evt) {
    var files = evt.target.files; // FileList object
    var selFile = files[0];
    var reader = new FileReader();
    reader.onload = function (e) {
        console.log(e);
        then(e.target.result);
    };
    reader.onerror = function (e) {
        console.error(e);
    };
    reader.readAsArrayBuffer(selFile);
}


document.getElementById('file').addEventListener('change', onfilechange.bind(null, playsound), false);