3

私はモバイル Web アプリを構築しており、ビデオとオーディオのタグを実装しています。どうやら、すべてのデバイスがすべてのファイル形式を実行できるわけではありません。Modernizr はコーデックを返すことを知っていますが、ファイルにこの特定のコーデックが含まれているかどうかを確認するにはどうすればよいですか?

ファイル拡張子または mim-type を特定できますが、コーデックとファイル拡張子を比較し、このデータを使用して配列を維持する必要があります。これは厄介な作業のようです。

あなたたちは何を言いますか?この情報を提供してくれる優れたライブラリを知っている人はいますか? または、私のアプローチが間違っていて、それを達成するためのより良い方法があるかもしれません。

たとえば、Firefox OS では、特定のファイル形式が OS でサポートされていないというメッセージがユーザーに表示されますが、オーディオ ファイルを扱う場合、このメッセージは提供されません。これは、このフィードバックをユーザーに提供する必要があることを意味します。また、アプリケーションに対してカスタマイズされた視覚的な方法で提供することも好みます。

例: video.mp4 を取得しました。Modernizr は H264 のコーデックを返します。この 2 つの情報は関係ありません。使用可能なすべてのビデオ フォーマットで実行するために、ビデオのフォールバックを配置することはできません。アプリはクラウド ファイル ホスティング (ドロップボックスなど) のブラウザーであり、ユーザーが FirefoxOS で実行できないファイルをアップロードした場合、そのファイルが実行されない理由を理解する必要があります。そのためには、代わりにこのライブラリが必要です。この圧縮を自分で管理します。

参考文献:

ありがとうございました。

4

1 に答える 1

2

MIME タイプにアクセスできる場合は、単にaudioorvideocanPlayType()メソッドを使用できます。

canPlay = (function(){
  var a = document.createElement('audio'),
      v = document.createElement('video');

  function canPlayAudio(type){
    var mime = 'audio/';
    if (a && a.canPlayType) {
      if (type.indexOf(mime) === -1) type = mime+type;
      return !!a.canPlayType(type) || !!a.canPlayType(type.replace(/^audio\/(x-)?(.+)$/, mime+'x-$2'))
    } return false
  }

  function canPlayVideo(type){
    var mime = 'video/';
    if (v && v.canPlayType) {
      if (type.indexOf(mime) === -1) type = mime+type;
      return !!v.canPlayType(type) || !!v.canPlayType(type.replace(/^video\/(x-)?(.+)$/, mime+'x-$2'))
    } return false
  }

  return {
    audio: canPlayAudio,
    video: canPlayVideo
  }
})();

次に、次のようなテストを実行できます (注:"audio/"または"video/"の部分を含めることはオプションです)。

canPlay.audio('audio/mpeg')  // true
canPlay.audio('m4a')         // true
canPlay.audio('wav')         // true
canPlay.audio('flac')        // false
canPlay.audio('audio/ogg')   // true

canPlay.video('video/mpeg')  // false
canPlay.video('video/mp4')   // true
canPlay.video('m4v')         // true
canPlay.video('video/webm')  // true
canPlay.video('avi')         // false
于 2013-08-05T17:42:52.213 に答える