Access to local sound files

[mjoycemilburn]

Goodness, me this is interesting! I've tried the text-file demo and been duly amazed. Unfortunately what I want is something a bit different. I simply want to be able to point an

Not a big job, surely.

I note that one of your API calls returns a file handle. Would it be possible to feed this to the audio element in some way?

[Anoesj]

It's definitely possible using Web Audio API! Haven't tried the same with the <audio> element though. How about something like:

const ctx = new window.AudioContext();

async function playAudio (fileHandle) {
  const file = await fileHandle.getFile();
  const arrayBuffer = await file.arrayBuffer();
  const decodedBuffer = await ctx.decodeAudioData(arrayBuffer);

  // Create source node
  const source = ctx.createBufferSource();
  source.buffer = decodedBuffer;
  source.connect(ctx.destination);
  source.start(); 
}

You may run into the autoplay policy restrictions when running this code. Remember to call ctx.resume() on a user gesture. E.g.:

window.addEventListener('click', () => {
  ctx.resume().then(() => {
    console.log('AudioContext started');
  });
}, {
  once: true,
  capture: true,
  passive: true,
});

[jbe]

You should be able to use URL.createObjectURL to get a "virtual" URL to the file handle, that can be used in an audio element.

[mkruisselbrink]

Closing this, since I think the replies answered the original question.