8

Webサイトで最新のmediaelement.jsを使用してhtml5ビデオを再生しています。GoogleChromeに何か奇妙なことがあります。彼は1つのビデオを再生しますが、他のビデオをmp4形式で再生したくないため、webmにフォールバックしません。両方のビデオは、次のパラメータを使用してffmpegで変換されました。

ffmpeg -i input.mov -acodec libfaac -ab 96k -vcodec libx264 -vpre slower -vpre main -level 21 -refs 2 -b 345k -bt 345k -threads 0 -s 640x360 output.mp4

さらに、最初のビデオはmp4形式のmediaelement.jsライブラリを使用せずに通常どおり再生され、2番目のビデオはwebm形式に変わります。

からのサンプルページhttp://random.net.ua/video_test/

  • http://random.net.ua/video_test/video1.html(わかった)
  • http://random.net.ua/video_test/video2.html(わかった)
  • http://random.net.ua/video_test/video1-mediaelement.html(わかった)
  • http://random.net.ua/video_test/video2-mediaelement.html(不合格)
4

3 に答える 3

14

コンソールで実行しようとする$("video").get(0).currentSrcと、非mediaelement.jsバージョンがWebmビデオを再生していることがわかります。これは、Chromeで問題なく再生できますが、mediaelement.jsバージョンで同じことを確認すると、試行されます。 MP4を再生します。

次に、見てみる$("video").get(0).errorと、MediaErrorがあることがわかります。それを調べると、「コード4」があることがわかります。仕様によると、それはMEDIA_ERR_SRC_NOT_SUPPORTEDです。

さて、試してみてください$("video").get(0).canPlayType("video/mp4")-それはを返します"maybe"

これは今のところ当て推量ですが、おそらくChromeはMP4の一部のプロファイルを再生できるが、他のプロファイルは再生できないため、「多分」と報告します。理由が何であれ、私はMediaelement.jsが「たぶん」を「いいえ」として扱い、他のソースタイプがネイティブに再生できない場合は、先に進んでFlashフォールバックを起動することを個人的に好みます。パッチを適用するのは簡単です。私はちょうど作ったフォークでそれを正確に行いました-https://github.com/tremby/mediaelement/tree/maybe-to-noを見てください

お役に立てば幸いです。それがあなたのために働くかどうか私に知らせてください-私はそれがMP4で諦め、あなたの場合の代わりにWebmを試すことを望んでいます。私自身のプロジェクト(この質問に私を導いたデバッグ)では、私はMP4ファイルしか持っておらず、Flashフォールバックが喜んでその代わりになっています。

于 2012-12-01T00:28:51.013 に答える
0

MediaSourceAPIを使用しています...

これは上記のフォールバックとは関係がないことは理解していますが、MP4ビデオが適切にエンコードされていれば、webmへのフォールバックは必要ないことを指摘することが重要だと思います。

MP4ビデオは、ファイル全体のダウンロードが完了する前にビデオを利用可能にするチャンクのダウンロードを可能にするMediaSourceAPIをサポートするようにエンコードすることもできます。

MP4実装はより広く使用されており、ほとんどのブラウザーでwebmフォールバックを必要としません。

MediaSourceAPI のビデオ形式のサポートを示すグラフはこちら

FFmpegはこれとそのオープンソースを行います。

以下を参照してください:( FFmpegを使用してMediaElement.jsのh.264およびWebMビデオをエンコードします):


Chris Coulsonの書き込み: 2012年6月14日(Windows)

最近、クライアントのサイトにビデオプレーヤーを追加しました。John DyerのMediaElement.jsは、これを行うための優れたソリューションであることがわかりました。ビデオのh.264とWebMでエンコードされたバージョンの両方を提供する限り、ほとんどすべてのブラウザーでネイティブに再生されます。サポートされていないブラウザの場合は、Flashにフォールバックします。

クライアントのビデオはすべてwmvであったため、h.264とWebMに変換する必要があります。幸いなことに、ジョンはFFmpegを使用してこれらのフォーマットにエンコードするためのいくつかの指示も提供しました。

http://johndyer.name/ffmpeg-settings-for-html5-codecs-h264mp4-theoraogg-vp8webm/

残念ながら、コマンドが公開されてからFFmpegが変更されたため、若干の変更が必要でした。また、ビデオのアスペクト比が維持され、ビデオをより低いビットレートとより速い速度でエンコードするように、いくつかの変更を加えました。また、変換されるビデオの一部は非常に短く、サムネイルが作成される10秒のマークの前に終了していました。この問題を解決するために、スクリプトを変更して、1、2、3、5、および10秒のマークでサムネイルをキャプチャし、キャプチャが成功するたびに最後のマークを上書きしようとしました。

これが私が使用した更新されたバッチファイルです:

REM mp4 (H.264 / AAC)
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -vcodec libx264 -pix_fmt yuv420p -vprofile high -preset fast -b:v 500k -maxrate 500k -bufsize 1000k -vf scale=trunc(oh*a/2)*2:480 -threads 0 -acodec libvo_aacenc -b:a 128k %1.mp4

REM webm (VP8 / Vorbis)
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -vcodec libvpx -quality good -cpu-used 5 -b:v 500k -maxrate 500k -bufsize 1000k -vf scale=trunc(oh*a/2)*2:480 -threads 0 -acodec libvorbis -f webm %1.webm

REM jpeg (screenshot at 10 seconds, but just in case of a short video - take a screenshot earlier and overwrite)
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -ss 1 -vframes 1 -r 1 -vf scale=trunc(oh*a/2)*2:480 -f image2 %1.jpg
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -ss 2 -vframes 1 -r 1 -vf scale=trunc(oh*a/2)*2:480 -f image2 %1.jpg
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -ss 3 -vframes 1 -r 1 -vf scale=trunc(oh*a/2)*2:480 -f image2 %1.jpg
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -ss 5 -vframes 1 -r 1 -vf scale=trunc(oh*a/2)*2:480 -f image2 %1.jpg
"c:\program files\ffmpeg\bin\ffmpeg.exe" -y -i %1 -ss 10 -vframes 1 -r 1 -vf scale=trunc(oh*a/2)*2:480 -f image2 %1.jpg

また、特定のディレクトリ内のすべてのwmvを反復処理し、各ファイルに対してエンコーダバッチを実行する個別のバッチファイルを作成しました。

for /r %1 %%i in (*.wmv) do "c:\program files\ffmpeg\CreateWebVideos.bat" %

Faron Coderのコメント:2014年9月3日午後6時52分(* nix)

こんにちは– </ p>

unixベースのffmpegを使用している人のために–これはunixの名前の作者のコード(上記)に対応するものです。

ffmpeg -y -i $fileid -vcodec libx264 -pix_fmt yuv420p -vprofile high -preset fast -b:v 500k -maxrate 500k -bufsize 1000k -vf “scale=trunc(oh*a/2)*2:480″ -threads 0 -acodec libvo_aacenc -b:a 128k “$file.mp4″ < /dev/null

ffmpeg -y -i $fileid -vcodec libvpx -quality good -cpu-used 5 -b:v 500k -maxrate 500k -bufsize 1000k -vf "scale=trunc(oh*a/2)*2:480" -threads 0 -acodec libvorbis -f webm "$file.webm" < /dev/null

ffmpeg -y -i $fileid -ss 1 -vframes 1 -r 1 -vf "scale=trunc(oh*a/2)*2:480" -f image2 "$file.jpg" < /dev/null
ffmpeg -y -i $fileid -ss 2 -vframes 1 -r 1 -vf "scale=trunc(oh*a/2)*2:480" -f image2 "$file.jpg" < /dev/null
ffmpeg -y -i $fileid -ss 3 -vframes 1 -r 1 -vf "scale=trunc(oh*a/2)*2:480" -f image2 "$file.jpg" < /dev/null
ffmpeg -y -i $fileid -ss 5 -vframes 1 -r 1 -vf "scale=trunc(oh*a/2)*2:480" -f image2 "$file.jpg" < /dev/null
ffmpeg -y -i $fileid -ss 10 -vframes 1 -r 1 -vf "scale=trunc(oh*a/2)*2:480" -f image2 "$file.jpg" < /dev/null 

お役に立てば幸いです。

于 2014-09-14T02:54:55.160 に答える
-1

これが私のために働いた簡単な解決策です。私の問題は、Chrome 29でMP4ビデオファイルを再生することでした。WWWの周りの同様のスレッドの束をくぐり抜け、拡張機能などを含むものの束を試した後、この解決策を見つけました。

そのページのクロムアドレスバーにchrome:flagsと入力して、「ハードウェア」を検索します

「ハードウェアアクセラレーションによるビデオデコード」を有効にします。その後、再起動します

これにより、Chromeでmp4を再生できるようになります。また、それを実行しようとしている場合は、Chromecastにキャストできます。

于 2013-09-23T18:56:57.960 に答える