audio/localstorage problem (IOS browser)

[Petiiz]

I developed a game using phaser, everything is ok when I run it at desktop browser but when I tried to run it in Ipad browser game runs ok but without sounds and without saving status using localStorage.

about sounds, what do you think is the problem? how to solve this?

My guess the problem is the sound files I use are '.ogg' maybe if I use '.mp3' it should work at IOS browser, but maybe not work in other browsers. I saw some example where we load ogg and mp3 files of same sound but this uses two files for same sound this is a big problem as rises file size. (but I really don't know if files extention is the problem)

Other problem is IOS browser simple don't save what we need using localStorage. To make localStorage works, user must change some settings at his apple device, this is surely a great problem. Any ideas to solve this problem without user need to change settings and without server-side/cloud storage?

if the problem is about browser compatibility, is there a list of this features we need to be careful when we are developing a game? (like audio and localStorage I just noticed)

[Str1ngS]

For the sound you need to conditionally load the audio files based on the device you're on. I tend to use ogg for most, then mp3 for IE (as a fallback) and I found that m4a has the best quality/performance for iPad, and fully supports looping audio.

Here is some example code of how I handle it:

if (this.game.device.iOS) {
    this.game.load.audio(assetName, ['assets/sound/' + assetName + '.m4a']);
}
this.game.load.audio(assetName, ['assets/sound/' + assetName + '.ogg', 'assets/sound/' + assetName + '.mp3']);

As for localStorage, I created a library that falls back to cookies if localStorage isn't accesible, works in most cases but you'll still loose data in private/incognito browsing, but thats exactly how it should work.

You can snag a copy from github

[Petiiz]

I tried as you suggested: 

if( this.game.device.IOS )
{
    this.game.load.audio('givecard', [path+'cardSlide3.m4a'] );
}
else
{
    this.game.load.audio('givecard', [path+'cardSlide3.ogg', path+'cardSlide3.mp3'] );
}

 

and tried to put all together:

 this.game.load.audio('givecard', [path+'cardSlide3.ogg', path+'cardSlide3.mp3', [path+'cardSlide3.m4a'] );

 

but both ways failed and sounds are not played at safari browser at ipads and iphones

 

but your suggestion of using cookies worked perfectly!