Tengo un archivo mp3 que estoy almacenando en caché como tal:

 const request = URL_TO_MY_MP3_FILE caches.open("my-cache").then(cache => { cache.add(request); });

Puedo ver que el archivo mp3 se almacena en caché en la pestaña Aplicación:

Por cierto, ¿cómo me aseguro de que el tipo de contenido se almacene en caché como audio/mp3 y no como audio/mpeg ?

Más adelante, me gustaría recuperar el archivo mp3 del caché para poder reproducirlo en el navegador:

 caches.open("my-cache").then(cache => { const responsePromise = cache.match(request); responsePromise.then(result => { console.log(result.body) this.audio = new Audio(result.body); const playPromise = this.audio.play(); playPromise.then(function() { console.log('success!') }).catch(function(error) { console.log(error) }.bind(this), false); });

})

Esta es la salida de console.log(result.body) :

Después de cargar el archivo mp3 con new Audio(result.body) , intento reproducir el archivo con this.audio.play() pero esto da como resultado un error:

DOMException: no se pudo cargar porque no se encontró una fuente compatible.

¿Cómo puedo recuperar el archivo mp3 del caché y reproducirlo en el navegador?