ビデオの始め方

ビデオ提供用のソースを設定する

注意: この機能は現在、プレミアムプランのお客様のみ利用可能です。この機能に興味がある場合は、営業チームにお問い合わせくださいして詳細情報を取得してください。

Video API を使用するには、まずソースを作成し、アカウントマネージャーに機能を有効にするよう依頼する必要があります。既に動画アセットが接続されているオリジンにソースを設定している場合は、その既存のソースを Video API と共に利用することも可能です。

初期のソース設定では、ビデオを提供するサブドメインとパスを定義する必要があります。

設定オプション

Video APIを使用するための関連するソース設定フィールドは以下の通りです：

• imgix Video Subdomain: ビデオをストリーミングするために使用されるドメインです。このフィールドは編集不可で、imgix Image Subdomainの値と同じサブドメインを継承します。Rendering APIとは異なり、Video APIは.videoサブドメインを使用します。rendering apiまたはVideo APIを使用してアセットを提供する方法の詳細な説明については、Serving Assetsのドキュメントを参照してください。
• Path Prefix: アセットを提供する際に使用される親パスを指定します。提供したいすべてのアセットが含まれるパスを選択する必要があります。

ソースをビデオのみ提供する目的で使用する場合は、ビデオファイルとフォルダのみを含むパスを使用することで設定を簡素化できます。

• Asset Processing Rules: Path Prefixと同様に、Asset Managerのルーティングに追加の層を加えます。その主な用途は、Asset Managerがクロールする（またはクロールしない）パスを定義することです。Video APIで提供するファイルは最初にAsset Managerで提供される必要があるため、これらのルールを使用してAsset Managerに表示されるビデオ（および画像）を絞り込むことができます。これはRendering APIで提供できるアセットには影響しませんが、Video APIで提供できるビデオには影響します。

アカウントの設定が完了したら、そのソースでVideo APIを有効にするために営業チームに連絡してください。有効化および設定が完了した後は、オリジンにビデオを追加し始めることができます。オリジンに既にビデオがある場合は、それらをクロールしてAsset Managerに追加します。

ビデオのアップロード

ビデオをアップロードするには、Management APIのアップロードエンドポイントまたはAsset Managerユーザーインターフェースを使用することをお勧めします。これらの方法では、ビデオがAsset Managerに即座に反映され、Video APIを通じてビデオが利用可能になるまでの時間が短縮されます。

ビデオがAsset Managerに反映されてから、ビデオがVideo APIを通じて利用可能になるまでの時間は、15分未満のビデオの場合は5秒から5分、60分のビデオの場合は10秒から40分ですが、ビデオの長さが長い場合はさらに時間がかかることがあります。

または、imgixのアップローダーを使用せずに、直接オリジンにビデオをアップロードすることもできます。オリジンで検出されたビデオは、検出され次第利用可能になります。これは一日を通じて定期的に行われます。

ビデオの更新

ビデオを更新するには、新しいファイル名でビデオをアップロードすることをお勧めします。ファイル名を保持したままビデオを更新する必要がある場合は、オリジンでビデオを置き換え、リフレッシュエンドポイントを使用してビデオをリフレッシュします。

ビデオがリフレッシュされると、再びトランスコードプロセスを経ます。

ビデオの削除

ビデオを削除するには、オリジンでビデオを削除し、その後Asset Managerからも削除する必要があります。これを行うには：

• オリジンからビデオを削除する
• 私たちがビデオを削除されたと検出するのを待つ（一日を通じてチェックします）
  • 代わりに、リフレッシュエンドポイントを呼び出してアセットのステータスを即座に更新することもできます
• ビデオURL（.netおよび.video）は自動的に404エラーを返します

ビデオのトランスコード

ビデオをVideo APIで提供する前に、ビデオはトランスコードされる必要があります。このプロセスは自動的に行われ、次の場合に発生します：

• .video URLが初めて要求されたとき。
• Asset ManagerまたはAsset Management APIを通じてアップロードされたとき
• オリジンからビデオをクロールして取得するとき（一日を通じて定期的に行われます）

まだ処理されていないビデオが要求された場合、ビデオURLへのリクエストはビデオが存在しない場合は404を返し、処理中の場合は423ステータスコードを返します。

ビデオが処理中の間、423が返され続け、ビデオのトランスコードが完了すると、Video APIで変換して提供できるようになります。この挙動はLoad to Encodeと呼ばれます。

ビデオの提供

Video APIは現在、mp4とhlsの2つの異なるフォーマットをサポートしています。HLSはVideo APIを使用する際のデフォルトフォーマットであり、他のフォーマットはビデオURLの末尾にfmパラメータを追加することで選択できます（例：?fm=mp4）。

HLSと他のビデオフォーマット（MP4、AVIなど）との直接再生のサポートはあまり良くありません。これはHLSがstreamableビデオフォーマットであり、ビデオのビットレートがユーザーの接続速度に応じて異なるチャンクで送信されるためです。

ブラウザでHLSビデオを再生するには、ネイティブのブラウザサポートまたはサードパーティのライブラリ（ix-playerなど）が必要です。

Video APIを使用した例：

• https://assets.imgix.video/videos/northern-lights.mp4 - HLSファイルを提供します（ビデオプレーヤーが必要です）
• https://assets.imgix.video/videos/northern-lights.mp4?fm=mp4 - MP4ファイルを提供します

MP4 vs HLS

ビデオをどのように再生したいかによって、HLSとMP4のどちらを使用するかが決まります。

もし以下を望むなら、HLSを使用すべきです：

• より良いシーク機能
• スムーズな再生のための高度なビデオバッファリング
• ユーザーのインターネット接続に基づいてビデオビットレートを変更する

しかし、以下の場合はMP4を使用するべきです：

• ビデオの長さが30秒以下の場合
• ビデオ品質を固定したい場合
• 汎用的なビデオ再生を追加するためのサードパーティライブラリを使用したくない場合

30秒以下の再生時間のビデオの場合は、MP4をお勧めします。HLSビデオは<5セグメント（通常は30秒以下）で終わるため、その長さのビデオで帯域幅に応じたストリーミングのメリットを得ることはほとんどありません。そのような短い期間で品質を変えるよりも、同じ品質を保持した方がユーザー体験にとってより良いかもしれません。

ビデオプレーヤーの追加

ビデオが有効になったら、任意のWebページでビデオの提供を開始できます。

ビデオプレーヤーについて心配することなくすぐにビデオを提供したい場合は、fm=mp4パラメータを使用できます：

https://assets.imgix.video/videos/girl-reading-book-in-library.mp4?fm=mp4

ただし、ビデオの再生時間が30秒を超える場合は、ユーザーの帯域幅やネットワーク接続に応じてビデオが完全にロードされるまで非常に長い時間がかかることがあります。

30秒を超える再生時間のビデオには、HLS形式を使用します。fmパラメータが指定されていない場合、デフォルトでHLSが返されます：

https://assets.imgix.video/videos/girl-reading-book-in-library.mp4

上記のビデオURLにHLSをネイティブにサポートしていないブラウザでアクセスすると、マニフェストファイルのダウンロードが求められます。HLSはストリーミング可能な形式で、ファイルはチャンクでストリームされ、マニフェストファイルは再生可能な様々なチャンクを概説しています。これらのビデオチャンクをビデオストリームとして再生するには、HLSをネイティブにサポートするブラウザを使用するか、HLS再生をサポートするサードパーティのライブラリやビデオプレーヤー（<ix-player>など）を利用する必要があります。

HTMLページでix-playerカスタムエレメントビデオプレーヤーを使用してHLSビデオプレーヤーをすばやく埋め込む方法の例を以下に示します：

<!-- Note: type 'module' here is important -->
<script
    defer
    type="module"
    src="https://static.imgix.net/ix-player/@latest/dist/ix-player.mjs">
</script>
<ix-player
    gif-preview
    type="hls"
    src="https://assets.imgix.video/videos/girl-reading-book-in-library.mp4?ixembed=docs&fm=hls">
</ix-player>

Click here to modify this in a CodeSandbox.

MP4ファイルと比較して、HLSビデオプレーヤーは以下の3つのことを行います。それは：

• ユーザーの接続に応じてビデオのビットレートを調整します
• ユーザーがダウンロードされていないビデオのセクションをナビゲートできるようにします（例えば、真ん中にスキップするなど）

ビデオの作成や実装に関する詳細は、ユーザーフレンドリーなビデオプレーヤーの作成に関する記事をご覧ください。