西安网站有哪些,外链代发公司,房屋建筑设计说明,龙岗在线官网前言
flv.js一款使用纯 JavaScript 编写的 HTML5 Flash 视频 (FLV) 播放器#xff0c;无需 Flash#xff01;#xff01;#xff01;flv.js 的工作原理是将 FLV 文件流转换为 ISO BMFF#xff08;碎片 MP4#xff09;片段#xff0c;然后通过Media Source Extensions无需 Flashflv.js 的工作原理是将 FLV 文件流转换为 ISO BMFF碎片 MP4片段然后通过Media Source ExtensionsvideoAPI 将 mp4 片段输入 HTML5元素。
特点
具有 H.264 AAC / MP3 编解码器播放功能的 FLV 容器多部分分段视频播放HTTP FLV低延迟直播流播放通过 WebSocket 播放 FLV 直播流兼容 Chrome、FireFox、Safari 10、IE11 和 Edge极低的开销并由您的浏览器硬件加速
安装
npm install --save flv.js
上手
script srcflv.min.js/script
video idvideoElement/video
scriptif (flvjs.isSupported()) {var videoElement document.getElementById(videoElement);var flvPlayer flvjs.createPlayer({type: flv,url: http://example.com/flv/video.flv});flvPlayer.attachMediaElement(videoElement);flvPlayer.load();flvPlayer.play();}
/script
创建播放器
function createPlayer(mediaDataSource: MediaDataSource, config?: Config): Player;
根据mediaDataSource中指示的类型字段创建播放器实例配置可选.
MediaDataSource配置
字段类型描述typestring表示媒体类型flv或mp4isLive?boolean指示数据源是否为直播流cors?boolean指示是否启用 CORS 以进行 http 获取withCredentials?boolean指示是否使用 cookie 进行 http 获取hasAudio?boolean指示该流是否有音轨hasVideo?boolean表示该流是否有视频轨道duration?number表示媒体总时长以毫秒为单位filesize?number表示媒体文件的总文件大小以字节为单位url?string表示媒体 URL可以以https(s)或开头ws(s)(WebSocket)segments?ArrayMediaSegment多部分播放的可选字段请参阅MediaSegment *如果分段字段存在transmuxer将把此MediaDataSource视为多部分源。 在多部分模式下MediaDataSource结构中的持续时间文件大小url字段将被忽略。
MediaSegment配置
字段类型描述durationnumber必填字段表示片段持续时间以毫秒为单位filesize?number可选字段表示段文件大小以字节为单位urlstring必填字段表示段文件URL
Config配置
字段类型默认描述enableWorker?booleanfalse启用分离线程进行转路目前不稳定enableStashBuffer?booleantrue启用 IO 存储缓冲区。如果您需要实时最小延迟直播流播放请设置为 false但如果网络抖动可能会停滞。stashInitialSize?number384KB指示 IO 存储缓冲区的初始大小。默认值为384KB。指示合适的大小可以改善视频加载/寻道时间。isLive?booleanfalse与MediaDataSourceisLive中的相同如果已在 MediaDataSource 结构中设置则忽略。lazyLoad?booleantrue如果有足够的数据可供播放则中止 http 连接。lazyLoadMaxDuration?number3 * 60指示要保留数据多少秒lazyLoad。lazyLoadRecoverDuration?number30指示lazyLoad恢复时间边界以秒为单位。deferLoadAfterSourceOpen?booleantrue在 MediaSource 事件触发后进行加载sourceopen。在 Chrome 上在后台打开的标签页可能不会触发sourceopen事件直到切换到该标签页。autoCleanupSourceBufferbooleanfalse自动清理 SourceBufferautoCleanupMaxBackwardDurationnumber3 * 60当后向缓冲区持续时间超过此值以秒为单位时自动清理 SourceBufferautoCleanupMinBackwardDurationnumber2 * 60指示进行自动清理时为后向缓冲区保留的持续时间以秒为单位。fixAudioTimestampGapbooleantrue当检测到较大的音频时间戳间隙时填充静音音频帧以避免 a/v 不同步。accurateSeek?booleanfalse精确搜索任意帧不限于视频 IDR 帧但速度可能稍慢。可在Chrome 50、FireFox和上使用Safari。seekType?stringrangerange使用范围请求来查找或者param在url中添加params来指明请求范围。seekParamStart?stringbstart表示搜索开始参数名称seekType paramseekParamEnd?stringbend表示搜索结束参数名称seekType paramrangeLoadZeroStart?booleanfalse如果使用范围搜索则发送Range: bytes0-首次加载customSeekHandler?objectundefined表示自定义搜索处理程序reuseRedirectedURL?booleanfalse重复使用 301/302 重定向 URL 进行后续请求如搜索、重新连接等。referrerPolicy?stringno-referrer-when-downgrade指示使用 FetchStreamLoader 时的Referrer Policyheaders?objectundefined表示将添加到请求中的附加标头
function isSupported(): boolean;
// 如果基本播放可以在浏览器上运行则返回true。
function getFeatureList(): FeatureList;
// 返回一个FeatureList对象该对象具有以下详细信息
字段类型描述mseFlvPlaybackboolean与 相同flvjs.isSupported()表示您的浏览器是否支持基本播放。mseLiveFlvPlaybackboolean指示 HTTP FLV 直播流是否可以在您的浏览器上运行。networkStreamIOboolean指示网络加载器是否正在流式传输。networkLoaderNamestring表示网络加载器类型名称。nativeMP4H264Playbackboolean指示您的浏览器是否原生支持 H.264 MP4 视频文件。nativeWebmVP8Playbackboolean指示您的浏览器是否原生支持 WebM VP8 视频文件。nativeWebmVP9Playbackboolean指示您的浏览器是否原生支持 WebM VP9 视频文件。
interface FlvPlayer extends Player {}
// 实现该Player接口的FLV播放器可由操作人员直接创建new。
interface NativePlayer extends Player {}
// 不带 MediaSource src 的浏览器原生播放器 (HTMLVideoElement) 的播放器包装器可实现接口Player。适用于单部分MP4文件播放。
// player
interface Player {constructor(mediaDataSource: MediaDataSource, config?: Config): Player;destroy(): void;on(event: string, listener: Function): void;off(event: string, listener: Function): void;attachMediaElement(mediaElement: HTMLMediaElement): void;detachMediaElement(): void;load(): void;unload(): void;play(): Promisevoid;pause(): void;type: string;buffered: TimeRanges;duration: number;volume: number;muted: boolean;currentTime: number;mediaInfo: Object;statisticsInfo: Object;
}
flv事件
事件描述ERROR播放过程中因任何原因发生错误LOADING_COMPLETE输入的 MediaDataSource 已完全缓冲至结束RECOVERED_EARLY_EOF缓冲期间发生意外的网络 EOF但已自动恢复MEDIA_INFO提供媒体的技术信息如视频/音频编解码器、比特率等。METADATA_ARRIVED使用“onMetaData”标记提供 FLV 文件流可以包含的元数据。SCRIPTDATA_ARRIVED提供 FLV 文件流可包含的脚本数据OnCuePoint / OnTextData。STATISTICS_INFO提供播放统计信息例如丢帧、当前速度等。 flvjs.错误类型
播放期间可能出现的错误。它们需要前缀flvjs.ErrorTypes。
错误描述NETWORK_ERROR与网络相关的错误MEDIA_ERROR与媒体相关的错误格式错误、解码问题等OTHER_ERROR任何其他未指定的错误 flvjs.错误详细信息
为网络和媒体错误提供更详细的解释。它们需要前缀flvjs.ErrorDetails。 错误描述NETWORK_EXCEPTION与网络的任何其他问题相关包含messageNETWORK_STATUS_CODE_INVALID与无效的 HTTP 状态代码相关例如 403、404 等。NETWORK_TIMEOUT与超时请求问题相关NETWORK_UNRECOVERABLE_EARLY_EOF与无法恢复的意外网络 EOF 相关MEDIA_MSE_ERROR与 MediaSource 的错误如解码问题相关MEDIA_FORMAT_ERROR与媒体流中的任何无效参数相关MEDIA_FORMAT_UNSUPPORTEDflv.js 不支持输入的 MediaDataSource 格式MEDIA_CODEC_UNSUPPORTED媒体流包含不受支持的视频/音频编解码器
