jplayer / jPlayer

jPlayer : HTML5 Audio & Video for jQuery
http://jplayer.org/
Other
4.6k stars 1.47k forks source link

jPlayer 2.6.0 and inspector. HTML5 mp3 detection fails on Chrome > 35 #223

Closed ghost closed 9 years ago

ghost commented 10 years ago

I know Chrome html5 can play mp3 natively because when I throw http://jplayer.org/audio/mp3/Miaow-07-Bubble.mp3 at it, it plays it natively.

And http://html5doctor.com/html5-audio-the-state-of-play/#support says

Chrome 6.0+ Ogg Vorbis, MP3, WAV†

and http://www.chromium.org/audio-video says

Codec Support. As of February 2014 [...] Google Chrome, the following codecs/containers are also included: MP3 audio codec

And http://jplayer.org/ says jplayer supports:

HTML5: mp3, mp4 (AAC/H.264), ogg (Vorbis/Theora), webm (Vorbis/VP8), wav

If I browse to http://www.jplayer.org/latest/demo-01-supplied-mp3/ I get the following results:

BUILDS THAT PASS

Chrome 35.0.1916.153 (Ubuntu 14.04 x32 desktop

This jPlayer instance is running in your browser where:
jPlayer's html solution is being used and will support: mp3
jPlayer's flash solution is not required
The HTML5 is active.
status.formatType = 'mp3'
Browser canPlay('audio/mpeg; codecs="mp3"')

BUILDS THAT FAIL

(I've tried to collate these as neatly as possible)

Chrome 36.0.1985.67 beta-m

Version 37.0.2054.3 dev-m

Windows 8.1 X64

..

This jPlayer instance is running in your browser where:
jPlayer's html solution is not required
jPlayer's flash solution is being used and will support: mp3
The Flash is active.
status.formatType = 'mp3'
Browser canPlay('audio/mpeg; codecs="mp3"')

FOR REFERENCE

On all the above machines, I tested with Firefox 30.0

This jPlayer instance is running in your browser where:
jPlayer's html solution is being used and will support: mp3
jPlayer's flash solution is not required
The HTML5 is active.
status.formatType = 'mp3'
Browser canPlay('audio/mpeg; codecs="mp3"')

I've also posted this as a ticket at https://code.google.com/p/chromium/issues/detail?id=386073

ghost commented 10 years ago

From the comments on that ticket over at Chrome, it looks very much like this is a Chrome bug, not a jPlayer problem. However, I'll leave this open until jPlayer want to close it, as doubtless others will notice this in time.

ntakouris commented 10 years ago

Im telling you chrome is a little buggy last 2 months....veeery buggy

2014-06-19 3:47 GMT-08:00 digitaltoast notifications@github.com:

From the comments on that ticket over at Chrome, it looks very much like this is a Chrome bug, not a jPlayer problem. However, I'll leave this open until jPlayer want to close it, as doubtless others will notice this in time.

— Reply to this email directly or view it on GitHub https://github.com/happyworm/jPlayer/issues/223#issuecomment-46550769.

ghost commented 10 years ago

The Chromium ticket I logged about html5/flash detection had a flurry of activity, but has now ground to a halt with the following question:

https://code.google.com/p/chromium/issues/detail?id=386073

5 dalecur...@chromium.org

It'd be helpful to know why jPlayer thinks it can't play mp3. Does it have any logs you can post here? Since the mp3 plays in Chrome, it's hard to say if it's a Chrome bug or a jPlayer bug.

crayton commented 10 years ago

i had the totally same issue with jplayer in my chrome app. It stop playing mp3 audio, any solution yet? because the google already release the chrome version 36 OTA.

Anyplace to download older version of chromium that free from this issue? thanks

ntakouris commented 10 years ago

Chromium is the open source of chrome and there are usually bugs and untested features , try it in chrome On Jul 13, 2014 2:24 PM, "crayton" notifications@github.com wrote:

i had the totally same issue with jplayer in my chrome app. It stop playing mp3 audio, any solution yet? because the google already release the chrome version 36 OTA.

Anyplace to download older version of chromium that free from this issue? thanks

— Reply to this email directly or view it on GitHub https://github.com/happyworm/jPlayer/issues/223#issuecomment-48838057.

lusaisai commented 10 years ago

The new version of Chrome shows it cannot play mp3 codec, the following are from the Chrome console

> new Audio().canPlayType('audio/mpeg; codecs="mp3"')
""
> new Audio().canPlayType('audio/mp4; codecs="mp4a.40.2"')
"probably"

JPlayer relies on this method, a temporary solution is to do some cheating, either of the following will work,

mp3: {
    // codec: 'audio/mpeg; codecs="mp3"',
    codec: 'audio/mp4; codecs="mp4a.40.2"',
    flashCanPlay: true,
    media: 'audio'
},
new jPlayerPlaylist({
    jPlayer: "#jquery_jplayer_1",
    cssSelectorAncestor: "#jp_container_1"
}, [
{
    title:"The Promise",
    m4a:".../music/Secret%20Garden/CD1/The%20Promise.mp3"
}
], {
    swfPath: "jQuery.jPlayer.2.6.0",
    supplied: "m4a",
    wmode: "window",
    smoothPlayBar: false,
    keyEnabled: true,
    playlistOptions: {
        autoPlay: true,
        enableRemoveControls: true
    }
});
ghost commented 10 years ago

Thanks - that's a useful workaround, but would everyone mind just quickly starring and adding to the bug thread at Chromium bug report HTML5 mp3 feature detection fails on Chrome > 35 https://code.google.com/p/chromium/issues/detail?id=386073

Here's the full current list of tickets and forum posts I'm aware of relating to this:

jPlayer bug report (this) https://github.com/happyworm/jPlayer/issues/223#issuecomment-46550769

jPlayer 2.6.0 on Chrome 37 Win 8.1 is not playing mp3 natively. https://groups.google.com/forum/#!topic/jplayer/cw9SD3bnLb4

Always flash fallback in Chrome > 35 https://groups.google.com/forum/#!topic/jplayer/fQz5vskxaps

jPlayer not playing after chrome 35 > https://groups.google.com/forum/#!topic/jplayer/Lyk7Znv1pWE

ghost commented 10 years ago

Weird - nothing happened on the Chromium ticket for ages, and then right after I updated this, something happened!

https://code.google.com/p/chromium/issues/detail?id=386073

The reply was:

11 acolw...@chromium.org

You can work around this if you just use audio/mpeg instead. audio/mpeg; codecs="mp3" is not actually RFC 3003 compliant which is why this broke when we tightened up our mimetype handling. We are working on a fix to allow this non-compliant form again, but if you have the ability to change the mimetype being used, you should switch to something that is more spec compliant.

ghost commented 10 years ago

OK, some progress! Looks like it's been "fixed", and will be appearing in upcoming Chrome builds soon... https://codereview.chromium.org/400023002

amitgur commented 10 years ago

Chrome on my win8 just updated to 36.0.1985.125 and I found out my Demo site is dead because of this issue:

http://www.windsoloist.com/livescore/ShalomAleichem/EN

I wonder how many potenial customers saw it before me.

I'm looking for that bug fix!

kamilogorek commented 10 years ago

@lusaisai your first solution breaks Firefox compatibility.

Working workaround: L679:

format: {
    mp3: {
        codec: !(new Audio().canPlayType('audio/mpeg; codecs="mp3"')) ? 'audio/mp4; codecs="mp4a.40.2"' : 'audio/mpeg; codecs="mp3"',
        flashCanPlay: true,
        media: 'audio'
    }
}
ghost commented 10 years ago

Thanks @jrsdotdung ! Your solution seems to work perfectly for me, and is the simplest of all.

Also seems to be RFC 3003 compliant. http://tools.ietf.org/html/rfc3003

Thanks!

nicolasgarnier commented 10 years ago

From the thread on Chromium:

Just modify jplayer source code, around line 696, change to:

mp3: {
    //codec: 'audio/mpeg; codecs="mp3"',
    codec: 'audio/mpeg',
    flashCanPlay: true,
    media: 'audio'
},

That's it. No other change needed... Works for me.

nicolasgarnier commented 10 years ago

And if you really want to be on the safe side you could use the following:

mp3: {
    codec: new Audio().canPlayType('audio/mpeg; codecs="mp3"') ? 'audio/mpeg; codecs="mp3"' : 'audio/mpeg',
    flashCanPlay: true,
    media: 'audio'
},
frazras commented 10 years ago

The audio/mpeg fix worked. I guess this patch needs to be committed because this was failing in my chrome browser extension which didn't support the flash fallback. I also had to manually minimize this patch :-)

erewok commented 10 years ago

The solution from NicolasGarnier solved my issue as well, but I wasn't sure how safe it was to use:

codec: new Audio().canPlayType('audio/mpeg; codecs="mp3"') ? 'audio/mpeg; codecs="mp3"' : 'audio/mpeg',

Because browsers that don't recognize the audio tag (older browsers) should throw errors saying that Audio is not defined.

thepag commented 9 years ago

This has been fixed. I think there may be 2 similar issue threads.

[2.6.4] Bug Fix: Removed the codecs part from the canPlayType test for MP3. This bug affected Win/OSX Chrome and Android Chrome and Firefox.