I have a page with a number of html 5 audio elements. The page loads and the audio files all play in safari, firefox, and opera – but not in chrome, whether on mac, windows, or android.
Oddly, the page DOES play the audio in chrome when I load it locally via Freeway’s browser command – but not from the server.
I’ve tried a number of things troubleshooting, but before I go into that, is this a known issue?
If you haven’t already, enable the Developer Tools option in your browser. (You need to do this in Preferences in Safari, and I can’t remember if you have to do it in Chrome as well.)
Visit the page you want to check for errors, and from the little “hamburger” menu on the right side of the Chrome frame, choose More Tools, then Developer Tools. Look in that interface for errors when the page loads (you can reload from the developer tools window and the main graphical window will reload as well. Often, reloading will trigger an error that is not there if you open the page and then the developer tools window.
I checked your page, and every music player I clicked on played immediately. Are you having the problem with only one or two of them?
The only error I saw in the developer tools was the missing favicon.
Walter
On Nov 7, 2017, at 7:43 PM, Dave Anderson email@hidden wrote:
I have a page with a number of html 5 audio elements. The page loads and the audio files all play in safari, firefox, and opera – but not in chrome, whether on mac, windows, or android.
Oddly, the page DOES play the audio in chrome when I load it locally via Freeway’s browser command – but not from the server.
I’ve tried a number of things troubleshooting, but before I go into that, is this a known issue?
Hi Walter – many thanks for the reply. I had looked briefly earlier at the source code that way with both Safari and Chrome. I combed that and didn’t see where any errors would be listed or indicated. I’ll dig further into that.
I’m happy to hear the files played for you. I wasn’t aware of an issue until a friend told me she couldn’t play the audio from her browser on an Android phone. After putting out a question on FB, another friend, who does design/development, said they also wouldn’t play in Chrome on his Windows machine. I had the same experience (with the exception I mentioned) on my Mac with Chrome. So I assumed that something was being rendered successfully in Safari and elsewhere that Chrome was more strict about. This applied to all the audio files – not just one or two.
I’ve been able to create a new page in my FW doc and add audio files to it, and have that audio play in Chrome from the server. The only difference in content compared to the problem page is the text headers and the CSS tables.
My best guesses after a lot of experimenting are that either FW is adding something to the markup that Chrome doesn’t like, or my hosting is somehow affecting the files. I use linux hosting with 1&1, and have my doc setup prefs in FW set to HTML 5, unix line feeds, and unix/windows file names.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
One thing that may be important is to ensure that the server has the proper MIME-types registered for the file extensions on your audio files. You’ll have to trawl around in their control panel (which I haven’t looked at in many many years, used them once for a year) and make sure that the .m4a file extension is associated with ‘audio/mp4’, and .ogg is associated with ‘audio/ogg’. You may also have to create an MP3 version and add that in order to make Chrome happy on Android. I have never done anything special for that browser, it usually just works.
Walter
On Nov 8, 2017, at 1:18 PM, Dave Anderson email@hidden wrote:
Hi Walter – many thanks for the reply. I had looked briefly earlier at the source code that way with both Safari and Chrome. I combed that and didn’t see where any errors would be listed or indicated. I’ll dig further into that.
I’m happy to hear the files played for you. I wasn’t aware of an issue until a friend told me she couldn’t play the audio from her browser on an Android phone. After putting out a question on FB, another friend, who does design/development, said they also wouldn’t play in Chrome on his Windows machine. I had the same experience (with the exception I mentioned) on my Mac with Chrome. So I assumed that something was being rendered successfully in Safari and elsewhere that Chrome was more strict about. This applied to all the audio files – not just one or two.
I’ve been able to create a new page in my FW doc and add audio files to it, and have that audio play in Chrome from the server. The only difference in content compared to the problem page is the text headers and the CSS tables.
My best guesses after a lot of experimenting are that either FW is adding something to the markup that Chrome doesn’t like, or my hosting is somehow affecting the files. I use linux hosting with 1&1, and have my doc setup prefs in FW set to HTML 5, unix line feeds, and unix/windows file names.
I figured out what the problem was, and I’m posting a follow-up in case it’s helpful to anyone else.
The short answer is that it is, as I had guessed in my original post, a known issue with Chrome: Chrome will choke if it tries to load more than six or so audio files on a page. It holds the metadata in a queue and doesn’t allow playback, even after refreshing. This explains why I was able to build a new test page and add one or two audio files, and have them play, but not be able to play anything on my existing page where there are over a dozen files.
The workaround is to set the “preload” setting for the audio element to “none”. This way, Chrome doesn’t “see” the audio until you click a play button, after which it loads and plays normally (albeit with a slight pause as the data loads – but that’s a small price to pay for solving the problem).
After identifying the issue by adding files one at a time and seeing that the page broke after a point, I googled that behavior specifically and found this:
There are certainly more elegant ways to present a large number of audio clips than I’ve arrived at here with this simple, straightforward page (I’m looking into jplayer) but this solves the problem for now.
Thanks again to Walter for offering assistance.
freewaytalk mailing list
email@hidden
Update your subscriptions at: