首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

flv.js 实现播放本地视频文件的技巧

目录 问题 解决 结尾 问题 有时候某些播放器无法直接播放本地视频文件,因此需要在本地启一个 HTTP 静态服务,通过 URL 的形式实现播放目的。...比如,自己在使用 flv.js 播放本地视频文件时就遇到了这个问题。...HTTP 静态服务还是非常简单的,只要我们安装了 Python 工具,执行如下命令就可以启动一个 HTTP 的静态服务: python3 -m http.server 利用静态服务就得到了一个对应视频文件的播放地址...: http://172.31.13.8:8000/qrq.out.flv 二、播放 URL 播放本地视频文件的代码如下: const video = document.getElementById...播放器播放刚才 URL 的视频文件,终于可以正常显示画面了,如下图所示: 好了,至此,flv.js 播放本地文件的方法就介绍完了,希望可以帮助大家。

8.2K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    flv格式详解+实例剖析

    简介 FLV(Flash Video)是现在非常流行的流媒体格式,由于其视频文件体积轻巧、封装播放简单等特点,使其很适合在网络上进行应用,目前主流的视频网站无一例外地使用了FLV格式。...另外由于当前浏览器与Flash Player紧密的结合,使得网页播放FLV视频轻而易举,也是FLV流行的原因之一。 FLV是流媒体封装格式,我们可以将其数据看为二进制字节流。...flv.jpg FLV格式解析 先来一张图,这是《东风破》——周杰伦(下载)的一个MV视频。我使用的是Binary Viewer的二进制查看工具。 ?...一般发现前三个字符为FLV时就认为他是flv文件。 Version 占1个字节 标示FLV的版本号。这里我们看到是1 Flags 占1个字节 内容标示。...DataOffset 4个字节 表示FLV的header长度。

    2.5K30

    【Android RTMP】RTMP 数据格式 ( FLV 视频格式分析 | 文件头 Header 分析 | 标签 Tag 分析 | 视频标签 Tag 数据分析 )

    文章目录 一、 RTMP 格式解析 二、 文件头 Header 分析 三、 标签 Tag 分析 四、 视频标签 Tag 数据分析 一、 RTMP 格式解析 ---- RTMP 视频数据包格式与 flv...视频格式类似 , 使用二进制分析工具分析 flv 视频文件 , 相关工具都在博客资源中 ; 分析 flv 文件格式 : ① flv 视频文件构成 : flv 视频由一个文件头 Header 与若干标签...Tag 组成 ; ② 使用二进制查看器 , 打开 flv 视频文件 , 如下图所示 : ③ 使用 flvAnalyser 工具打开 flv 视频文件 : 二、 文件头 Header 分析 ----...文件头 Header 分析 : ① flv 视频文件文件头 : 46 4C 56 ( 16 进制格式 ) , 这是 FLV 字母的 ASCII 码 ; 只要是 flv 格式的文件 , 前三个字节必定是这三个值...; ② 文件版本 : 第 4 个字节时 FLV 格式的版本 , 这里是 01 ; ( 参考上图 ) 三、 标签 Tag 分析 ---- flv 标签数据结构 : ① 标签类型 ( tag type

    1.3K10

    国标GB28181视频平台LiteCVR可支持的视频流播放协议汇总

    图片众所周知,国标GB28181视频平台LiteCVR平支持多种视频流媒体协议输出,如:HLS、HTTP-FLV、WebSocket-FLV、WebRTC、RTSP、RTMP。...图片1)HLSHLS协议的文件由两部分组成:多个只有几秒长度的.ts切片视频文件;记录这些视频文件地址的.m3u8索引文件,这些静态视频文件是直接写入磁盘的。...5)HTTP-FLVHTTP-FLV地址以http://开头,基于http协议,功能和工作原理与RTMP相似。HTTP-FLV一般作为拉流,延迟较低,适配播放场景更灵活。...6)WebSocket-FLV基于WebSocket传输FLV,依赖浏览器支持播放FLV。...WebSocket-FLV和HTTP-FLV类似,区别就是HTTP-FLV基于HTTP ,只能单向传输数据,而WS-FLV基于WS可以双向传输数据。

    56420

    TSINGSEE青犀视频汇聚平台EasyCVR多种视频流播放协议介绍

    视频监控汇聚平台EasyCVR平支持多种视频流媒体协议输出,如:HLS、HTTP-FLV、WebSocket-FLV、WebRTC、RTSP、RTMP。...这几种播放协议介绍如下:1)HLSHLS协议的文件由两部分组成:多个只有几秒长度的.ts切片视频文件;记录这些视频文件地址的.m3u8索引文件,这些静态视频文件是直接写入磁盘的。...5)HTTP-FLVHTTP-FLV地址以http://开头,基于http协议,功能和工作原理与RTMP相似。HTTP-FLV一般作为拉流,延迟较低,适配播放场景更灵活。...6)WebSocket-FLV基于WebSocket传输FLV,依赖浏览器支持播放FLV。...WebSocket-FLV和HTTP-FLV类似,区别就是HTTP-FLV基于HTTP ,只能单向传输数据,而WS-FLV基于WS可以双向传输数据。

    29220

    无惧FFmpeg的高冷美艳:8条音视频命令,让你变身短视频UP达人!

    #1 获取有关视频文件的信息 在执行任何操作之前,您必须知道如何获取视频文件的相关信息。 您可以使用以下命令来执行此操作。...#3将一个视频文件拆分成多个图像 FFmpeg允许您将视频文件转换为在父文件夹中找到的一系列图像。 要执行此操作,您需要发出以下命令。...#7视频到视频转换 FFmpeg允许您将视频文件从一种格式转换为另一种视频格式。 假设您在目录中有一个.flv格式的视频文件,并且您希望将其更改为.mpg格式,则以下命令将帮助您完成此操作。...ffmpeg -i video.flv video.mpg 此命令会将名为“Video”的.flv格式的视频文件转换为同名的.mpg视频文件。 同样,您也可以执行其他视频转换。...#8复用音视频文件 FFmpeg还为您提供了多路复用/多路分解音频和视频文件的功能。 以下命令将两个音频和视频文件合并为一个。

    1.4K20

    如何实现一个cs模式的flv视频点播系统

    基本上,可以把FLV格式简要画为如下形式: ?   其中,FLV Header指的是FLV的头部,只有9个字节,和常规的MP4文件头部相比,这个小太多了。...FLV MetaData存放的是一些整个视频文件的媒体信息,包括作者、视频宽高、时长、关键帧列表等等,这些信息对于解析视频文件来说,当然很重要,不过可惜的是,因为FLV的MetaData是可有可无的,所以有不少...所以,在解析FLV的时候,应该直接忽略FLV MetaData部分,通过遍历FLV的所有Tag,来获取相应的媒体信息。...对于FLV来说,因为其格式简单,头部非常小,而MetaData可以不要,所以只需要寻找到关键帧,然后拼上FLV Header,就可以组成一个可播放的视频文件。如下图所示: ?   ...根据FLV格式的特点,以及拖动后生成新的可播放文件的方法,可以将flv点播系统设计成如下方案: ?   1. 服务器端   首先,解析flv文件,生成flv视频关键帧列表,表明时间和便宜量的对应关系。

    1.7K100
    领券