Next.js向けプレイヤー適用
    • PDF

    Next.js向けプレイヤー適用

    • PDF

    Article Summary

    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をご参照ください。

    image.png

    参考

    React関連機能はクライアントコンポーネントで作成しないと使用できません。Next.jsファイルの第一行に 'use client'と入力すると、そのファイルはクライアントコンポーネントとして扱われます。

    関数を使用したスクリプトのロード

    Next.jsでは、クライアントコンポーネントを作成して外部スクリプトをロードする方法でプレイヤーを適用できます。
    `






    </>
    )
    }


    この記事は役に立ちましたか?

    Changing your password will log you out immediately. Use the new password to log back in.
    First name must have atleast 2 characters. Numbers and special characters are not allowed.
    Last name must have atleast 1 characters. Numbers and special characters are not allowed.
    Enter a valid email
    Enter a valid password
    Your profile has been successfully updated.