Howler.js: howler loads audiosprites file multiple times in IE 11

Created on 4 Aug 2016 · 3Comments · Source: goldfire/howler.js

We are using audiosprite in howler.js and I noticed strange behavior in EI (v11).
Audiosprite file loaded multiple times with different size and sometimes howler plays whole soundsprite without the interaptions.

Also there strange behavior in IE in the Audio Sprite demo https://howlerjs.com/
Screenshot: https://i.gyazo.com/923f11481a8335522bb2771c0741a5fd.png

In Chrome everything works fine.

Source

FFankias

Most helpful comment

I also faced this problem. What I am trying is:

Download sound files by XHR.
Create blob URI.
Use this URI for src instead of raw file paths.

Then downloading itself is done only once.

var xhr = new XMLHttpRequest();
xhr.open('GET', './sprite.mp3', true);
xhr.responseType = 'blob';
xhr.onload = function () {
    var sound = new Howl({
        src: [URL.createObjectURL(xhr.response)],
        format: ['mp3'],
        sprite: { test: [1000, 5000] }
    });
};
xhr.send();

xl1 on 4 Feb 2017

👍2

All 3 comments

As far as I have been able to tell, this is a bug with IE11 itself. I'm not aware of any way to get around this, but will be happy to re-open if anyone has any ideas.

goldfire on 21 Aug 2016

👍1

I also faced this problem. What I am trying is:

Download sound files by XHR.
Create blob URI.
Use this URI for src instead of raw file paths.

Then downloading itself is done only once.

var xhr = new XMLHttpRequest();
xhr.open('GET', './sprite.mp3', true);
xhr.responseType = 'blob';
xhr.onload = function () {
    var sound = new Howl({
        src: [URL.createObjectURL(xhr.response)],
        format: ['mp3'],
        sprite: { test: [1000, 5000] }
    });
};
xhr.send();

xl1 on 4 Feb 2017

👍2

Have you solved this problem?