Classic/VPC環境で利用できます。
スクリプトコードを変更して、メタデータの表示有無を設定する方法について説明します。
参考
Standard料金プランでのみご利用いただけます。
- オプションを設定するプロパティに関する説明は、プレイヤー設定をご参照ください。
- 現在のプレイヤーは、メタデータのクリックイベントに対応していません。
メタデータの表示有無
descriptionNoVisible プロパティで、プレイヤー上部のメタデータの表示有無を設定します。
import Hls from "hls.js";
import dashjs from "dashjs";
import { VpePlayer } from "@sgrsoft/vpe-react-sdk";
// 動画(MP4)
export function App() {
return (
<VpePlayer
accessKey="YOUR_ACCESS_KEY"
hls={Hls}
dashjs={dashjs}
platform="pub"
options={{
autostart: true,
descriptionNoVisible: true, // メタデータ UIを表示しない(false(デフォルト): 表示)
playlist: [
{
file: "https://CDNドメイン/example_video_01.mp4",
poster: "https://CDNドメイン/example_image_01.png",
description: {
title: "NAVERクラウドの紹介", //タイトル
created_at: "2023.01.01", // アップロード日
profile_name: "NAVERクラウド", // アップローダのハンドルネームまたはチャンネル名
profile_image: "https://CDNドメイン/example_image_profile.png", //プロファイル画像またはチャンネル画像
},
},
],
}}
/>
);
}