@ devultur/ 反应
Devultur 介质的回放组件和钩子:带有标题、质量和故事板的 HLS 视频播放器 预览、带进度的拖放上传、图像剪接器、记录和监视进度跟踪.
安装
pnpm add @devultur/react
需要反应19.
示例
import { UploadZone, VideoPlayer } from "@devultur/react";
// `getUploadUrl` calls your backend, which returns `{ url, key }` from `@devultur/server`.
async function getUploadUrl(file: File) {
const response = await fetch("/api/upload-url", {
method: "POST",
body: JSON.stringify({ filename: file.name, contentType: file.type }),
});
return response.json() as Promise<{ url: string; key: string }>;
}
export function Lesson({ playlistUrl, viewerToken }: { playlistUrl: string; viewerToken: string }) {
return (
<>
<UploadZone onUploadUrl={getUploadUrl} onComplete={({ key }) => console.log("uploaded", key)} />
<VideoPlayer src={playlistUrl} token={viewerToken} />
</>
);
}
回放度量衡
<VideoPlayer> 回放质量衡量标准 默认: 启动时间、再缓冲、出错、比特率和监视
时间,在小信标到 POST /v1/metrics/playback 在服务视频的主机上( Devutur 发送 URL)
页:1 它们是匿名的:每个视图的随机ID,媒体密钥和计数器. 没有饼干,没有本地存储和用户
编号. 自主机 Worker 丢弃它们,除非有一个插件记录它们.
把它们关掉 metrics={false}数字 :
<VideoPlayer src={playlistUrl} token={viewerToken} metrics={false} />
每一地及所发时:
文件/指南/视频播放器.md#回放度量, (中文(简体) ),
也随包运出为 node_modules/@devultur/react/docs/guides/video-player.md。 。 。 .
标签
<VideoPlayer labels={…}> 替换玩家的任何字符串( e)VideoPlayerLabels- 其余的还是英语.
@devultur/convex/locales/es 财务报告和审定财务报表 locales/es-formal 导出西班牙语为 videoPlayerLabels。 。 。 .
文档
部件、钩和向导: github.com/devultur/devultur/树木/主/文件。 。 。 .
这个 视频播放器指南 与《京都议定书》
软件包,用于已安装的版本 : node_modules/@devultur/react/docs/guides/video-player.md。 。 。 .