日本語

ビデオと字幕 · 字幕ツールキット

VLC では字幕ファイルが再生されるが、HTML5 トラック要素では失敗する理由

· 仕組み

字幕 webvtt ブラウザ処理

1 つの字幕ファイルが 2 つのパーサーに到達します。寛容なものはすべてのキューを表示し、厳格なものはキューがドロップされたギャップを表示します。
オリジナル ToolAcre ベクトル イラスト

デスクトップ プレーヤーは寛容です。ブラウザの track 要素はそうではありません。この投稿では、HTML5 キャプション パーサーが WebVTT ファイルを読み取る方法、サイレントにドロップするエラー、および両方を受け入れるファイルの準備方法について説明します。

同じファイルが VLC で動作し、Web ページには何も表示されません - 2 つのパーサー、2 つの許容レベル

デスクトップ プレーヤーでは正しく再生され、Web ページには何も表示されないキャプション ファイルは、この 2 つ間で変更されていません。変わったのは、読者がどれだけの寛容さをもたらすかということだ。デスクトップ プレーヤーは、ユーザーがドラッグしたものをすべて表示するように構築されているため、推測、修復、スキップが可能です。 HTML5 の track 要素は仕様を実装していますが、推測が受け入れられる仕様は仕様ではありません。

この違いはどちらのバグでもありません。これは義務が異なる 2 つの設計であり、実際的な結果として、デスクトップ プレーヤーはファイルが Web 上で動作するかどうかのテストとしては不十分です。

track 要素がキャプション ファイルをロードする方法 - リクエスト、MIME タイプ、クロスオリジン トラックの CORS、および WEBVTT ヘッダー チェック

track 要素は通常のリソースとしてキャプション ファイルをフェッチします。これは、他のリクエストと同じルールが適用されることを意味します。 WebVTT メディア タイプで提供する必要があり、プレーン テキストとして提供されるファイルは、その内容に関係なく拒否されます。別のオリジンでホストされているトラックには、クロスオリジン ヘッダーとビデオ要素のcrossorigin属性が必要です。これらがないと、解析が行われる前にフェッチが失敗します。

次にヘッダーのチェックです。 WebVTT ファイルは WEBVTT 署名で始まる必要があり、オプションでその前にバイト オーダー マークを付ける必要があり、これのないファイルは WebVTT ファイルではありません。これが、SRT ファイルの名前を VTT 拡張子に変更しても何も表示されない最も一般的な理由です。名前を変更すると、拡張子が変更され、最初の行は変更されません。

キューごとの解析 - 不正なタイムコードまたは予期しない行に対してブラウザが何を行うか、およびエラーがサイレントで発生する理由

それ以降の解析はキューごとに行われ、失敗モードが混乱を招く原因になります。パーサーが読み取れないブロックは破棄され、解析が続行されます。例外、コンソール エラー、視覚的な表示はありません。キューはまったく表示されません。 900 のうち 4 つの不正なタイムコードを含むファイルは、ほぼ完璧に再生されますが、4 つの沈黙の瞬間があり、フォーマットの欠陥というよりも、翻訳が欠落しているように見えます。

これが、通常、症状が断続的であると報告される理由です。断続的なものは何もありません。同じキューは毎回失敗しますが、周囲のキューが機能するため、ファイルは概ね機能しているように見え、障害は解析ではなくコンテンツに起因すると考えられます。

デスクトップ プレーヤーの寛大さ — VLC などが技術的に無効なファイルを受け入れる理由

デスクトップ プレーヤーは意図的に逆のポジションをとります。これらは両方のミリ秒区切り文字を受け入れ、インデックス行の欠落を許容し、拡張子ではなく内容から形式を推測し、順序を修復し、使用できないものは文句なしにスキップします。ファイルをプレーヤーにドラッグするユーザーは、映画に検証レポートではなく字幕を付けたいと考えています。

ツールキット パーサーは、入力時に同じ寛大な伝統に従っており、オプションの時間、区切り文字およびブロックが不規則なファイルのいずれかを受け入れます。違いは、その後の動作です。許容したすべての障害を特定の問題として記録し、受け入れた不規則性を保存するのではなく、1 つの標準的な形状を書き戻します。

うまくいった例: 3 つの一般的な欠陥のあるファイル — ブラウザでテストし、どのキューが消えるかを確認する

3 つの欠陥のあるファイルを考えます。WEBVTT ヘッダーが欠如し、1 つのキューの秒フィールドが 75 で、1 つのキューが開始する前に終了します。デスクトップ プレーヤーでは、ファイルが再生され、不可能な秒数が修復されるか静かにスキップされ、反転キューが点滅するかドロップされます。視聴者には字幕が表示されます。

track 要素では、ヘッダーが欠落しているとすぐに終了します。ファイルが WebVTT として受け入れられなかったため、キューは 1 つも表示されません。ヘッダーを追加すると画像が変更されます。ほとんどのキューが表示され、75 秒のキューは解析中に破棄され、反転されたキューは解析されますが、表示する期間がないため表示されません。検証はページをロードする前の両方で名前を付け、不可能なタイムコードと開始前に終了するキューをそれぞれ番号で報告します。

これでカバーされないもの — ::cue によるスタイル設定、位置設定、ライブ キャプション

ここでは、キューがどのように見えるかではなく、キューが読み込まれるかどうかについて説明します。キュー疑似要素によるスタイル設定、タイムコード ライン上の位置と配置の設定、領域定義、縦書きテキストはすべて別個の関心事であり、ファイルが解析された後でのみ問題になります。何も表示されないファイルはスタイルの問題ではなく、スタイルを設定しても問題は解決されません。

ライブおよびストリーミングのキャプションもこれに含まれません。アダプティブ ストリームと一緒に配信されるセグメント化されたキャプション トラックには独自の配信モデルがあり、トラック要素によって読み込まれる静的ファイルはプレーヤーに到達する方法ではありません。

要点: 最も厳密なパーサーを準備する — 字幕ツールキットの変換とクリーンアップがトラック要素が受け入れるファイルを生成する方法

視聴者が使用するのは厳密なパーサーであるため、最も寛容なパーサーではなく、最も厳格なパーサーを準備してください。署名行が想定されるのではなく書き込まれるように WebVTT に適切に変換し、正しいメディア タイプで提供し、ファイルが別のホストにある場合はクロスオリジン ヘッダーを追加します。

出荷前に変換を実行し、報告された問題を読んでください。コンバーターは、フォーマットに必要な区切り文字を使用して正規のタイムスタンプを書き込み、キューの番号を連続的に付け直し、許容しなければならなかった障害を報告します。これは、ブラウザー内で静かに消えるキューのリストです。次に、ページをリロードし、キャプションが表示されることを信頼するのではなく、キュー数をソースと比較します。