Audio is not playing in Facebook app

Question

I have a small HTML5 game with Javascript and JQuery. Every thing is working fine but the audio is not playing when the application starts.

I have used "audio" tag to play the sound.

 <audio id="backgroundMusic" autoplay loop>  
        <source src="sounds/startTheme.mp3" />  
        <source src="sounds/startTheme.wav" />  
    </audio>

This issue persists in all the browsers.

Can anybody please help or advice me some work around? Very thanks in advance.

P.S. - I think audio tag is not supported in facebook app.

That's it!? No code or browser specifications, nothing. Please update your question with more information — Adam Azad, Apr 27 '14 at 05:36
@AdamAzad Please check now. I have added more details. BTW it was just a simple audio tag. The point is - I think audio tag is not working in FB apps. — Manish Gupta, Apr 27 '14 at 05:45
Try using - `.OGG` file format. - check error log for error. - try accessing your page out of canvas using a modern browser http://caniuse.com/audio — Adam Azad, Apr 27 '14 at 05:51

score 2 · Accepted Answer · answered May 18 '14 at 20:53

After many tries I get this thing to work. The audio was not playing because Facebook only supports secured contents. (contents with ssl). When I generated a verified SSL certificate it started working. Before I was using a self signed certificate.

Thanks you everybody for your suggestions.

Arnaud Leyder · Answer 2 · 2014-04-28T14:27:42.603

I know facebook does uses HTML5 media element for example when displaying media content to a journal on iPad.
First I would check the audio tag you are using works on a blank HTML5 page (just to be sure there is no issue with the file/server you are using).

Could not it be that just the autoplay or loop attributes are not supported? We know that Apple disables autoplay on all of its mobile devices. Maybe facebook has rolled out something similar. Try something like this to see if it plays on user interaction:

<audio id="backgroundMusic" controls>  
    <source src="sounds/startTheme.mp3" />  
    <source src="sounds/startTheme.wav" />  
</audio>

To check if HTML5 audio is supported in an environment you can use:

function supports_audio() {
  return !!document.createElement('audio').canPlayType;
}

More information on this here.

Otherwise good old flash can be a fallback option.

Audio is not playing in Facebook app

2 Answers2