Можете ли вы использовать видео / аудио проигрыватель HTML5 с отказоустойчивым Flash? - PullRequest
6 голосов
/ 04 марта 2011

Я пытаюсь выяснить свои варианты, когда дело доходит до воспроизведения аудио и видео через Интернет. Я продаю на HTML 5 <video /> и <audio />. Но я хотел бы иметь возможность отображать флэш-видео / аудио, если HTML-видео / аудио не удается.

Существует ли простой способ определить, не воспроизводится ли видео / аудио по какой-либо причине, а затем заменить проигрыватель HTML5 на Flash-проигрыватель?

Ответы [ 4 ]

4 голосов
/ 04 марта 2011

Вы можете вставить свой вариант Flash в качестве последнего элемента в теге <video>, и он будет воспроизводиться, если видео HTML5 не будет.

См. Пример Марка Пилигрима, поскольку он всеобъемлющий и регулярнообновлено: http://diveintohtml5.ep.io/video.html#example

Подведем итог:

<video>
    <!-- HTML5 video -->
    <source src="video.webm" type='video/webm; codecs="vp8, vorbis"'>
    <source src="video.ogv" type='video/ogg; codecs="theora, vorbis"'>
    <source src="video.mp4">

    <!-- Flash player fallback for user agents that don’t support HTML5 video -->
    <!-- All user agents that don’t understand the <video> tag, or don’t support
     the video formats you’ve provided, will show this instead. Even IE 6. -->
    <object width="320" height="240" type="application/x-shockwave-flash"
data="flowplayer-3.2.1.swf"> 
        <param name="movie" value="flowplayer-3.2.1.swf">
        <param name="flashvars" value='config={"clip": {"url": "video.mp4", "autoPlay":false, "autoBuffering":true}}'>
    </object>
</video>
3 голосов
/ 04 марта 2011

Если вы можете свободно выбирать проигрыватель Flash-видео, попробуйте JWPlayer, в котором реализован запасной вариант HTML5 / Flash

2 голосов
/ 04 марта 2011

Я бы порекомендовал MediaElementJS .

Но, чтобы ответить на ваш вопрос, сама природа видео, аудио и элементов источника позволяет вам представлять различные источники браузерам, которые затем выбирают, что он может воспроизводить. Если он не может воспроизвести ни одного из них, пока вы предоставляете альтернативу флеш-памяти, он будет использовать ее.

1 голос
/ 04 марта 2011

Вы можете использовать Modernizr , чтобы проверить, поддерживается ли определенный тег HTML5 или нет, и переключиться на опцию безопасного отказа, если это не так, например:

if (Modernizr.video) {
    //start using HTML5's video tag
} else {
    // use flash
}

Вот руководство по использованию Modernizr Развертывание HTML5 и CSS3 с Modernizr

...