Next.js向けプレイヤー適用
- 印刷する
- PDF
Next.js向けプレイヤー適用
- 印刷する
- PDF
Article Summary
Share feedback
Thanks for sharing your feedback!
Classic/VPC環境で利用できます。
Next.js用プレイヤーの適用では、Video Player Enhancement Web SDK JSを活用し、プレイヤーを適用して設定するためのユースケースを紹介します。
参考
Next.jsのユースケースを実行するには以下のような環境が求められます。
- Next.jsバージョン: 13.2.4
- Reactバージョン:18.2.0(
react-dom
バージョン: 18.2.0)
Next.jsの特性を理解する
Video Player Enhancementサービスを適用する前に、Next.jsの特性を必ず検討してください。
Next.jsバージョン13ではすべてのコンポーネントがサーバコンポーネントなので、CSR方式でクライアントコンポーネントを使うためには "use client";
を使う必要があります。クライアントコンポーネントを作成する方法は、Next.js公式ホームページにて確認できます。公式ホームページでは、サーバコンポーネントを使用する場合とクライアントコンポーネントを使用する場合を明確に分けてご案内しています。 Rendering: Server and Client Components | Next.jsをご参照ください。
参考
React関連機能はクライアントコンポーネントで作成しないと使用できません。Next.jsファイルの第一行に 'use client'
と入力すると、そのファイルはクライアントコンポーネントとして扱われます。
関数を使用したスクリプトのロード
Next.jsでは、クライアントコンポーネントを作成して外部スクリプトをロードする方法でプレイヤーを適用できます。
`
</>
)
}
この記事は役に立ちましたか?