HTML5 视频 - 使用 canPlayType 嗅探编解码器

发布于 2024-12-14 17:18:42 字数 1110 浏览 2 评论 0原文

我是一名移动 Web javascript 开发人员，我们发现某些 Android 设备无法播放我们的 mp4 容器 h.264 编码视频，因此我们的逻辑指向 3gp 版本。现在较新的 Android 设备（Samsung Ace、Kindle Fire）不支持 3GP 容器。

我现在正在考虑使用 canPlayType() 的 javascript DOM 方法，我无法确定其中的字符串。我从 HTML5 W3C 规范和其他来源获取示例。

使用以下代码（取自另一个问题）我得到混合结果，因为我相信我正在测试一个可能与我们的 handbrake/qt-faststart/ffmpeg 生成的文件不匹配的字符串。

我在 Samsung Vibrant 上的所有 3 个视频上都出现错误，但它可以正常播放所有视频。

    var testEl = document.createElement( "video" ),
        mpeg4, h264, webm;
    if ( testEl.canPlayType ) {
        // Check for MPEG-4 support
        var typeStr = testEl.canPlayType( "video/mp4; codecs=\"mp4v.20.8\"" );
        mpeg4 = typeStr !== "";

        // Check for h264 support
        typeStr = testEl.canPlayType( "video/mp4; codecs=\"avc1.42E01E\"" )
            || testEl.canPlayType( "video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"" )
        h264 = typeStr !== "";
        // Check for Webm support
        typeStr = testEl.canPlayType( "video/webm; codecs=\"vp8, vorbis\"" );
        webm = typeStr !== "";
    }
    alert("mpeg4 = "+mpeg4+"\nh264 = "+h264+"\nwebm = "+webm);

原文

I am a mobile web javascript developer and we are finding that some Androids will not play our mp4 container h.264 encoded videos, and so we had logic pointing to 3gp versions. Now newer Android devices (Samsung Ace, Kindle Fire) do not support the 3GP container.

I am now looking into using the javascript DOM method of canPlayType(), I am having trouble determining the strings that go in there. I pull the examples from the HTML5 W3C spec and other sources.

With the following code (taken from another question) I get mixed results because I believe I am testing a string that may not match our handbrake/qt-faststart/ffmpeg produced files.

I get a false on all 3 on a Samsung Vibrant, yet it plays all the videos fine.

    var testEl = document.createElement( "video" ),
        mpeg4, h264, webm;
    if ( testEl.canPlayType ) {
        // Check for MPEG-4 support
        var typeStr = testEl.canPlayType( "video/mp4; codecs=\"mp4v.20.8\"" );
        mpeg4 = typeStr !== "";

        // Check for h264 support
        typeStr = testEl.canPlayType( "video/mp4; codecs=\"avc1.42E01E\"" )
            || testEl.canPlayType( "video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"" )
        h264 = typeStr !== "";
        // Check for Webm support
        typeStr = testEl.canPlayType( "video/webm; codecs=\"vp8, vorbis\"" );
        webm = typeStr !== "";
    }
    alert("mpeg4 = "+mpeg4+"\nh264 = "+h264+"\nwebm = "+webm);

分享到QQ

分享到微博