HTML播放flv

页面效果:

代码如下:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>FLV Player</title>
</head>
<script src="https://cdn.bootcss.com/flv.js/1.6.2/flv.js"></script>
<!-- <script src="https://unpkg.com/flv.js@1.6.2/dist/flv.js"></script> --><body><div style='margin-bottom:6px'><input id='flvUrl' style='width:545px' value="http://waketzheng.top:8080/live/0.live.flv"></input><button id='flvBtn'>Play</button></div><div><video id="vVideo" width="600" height="500" controls /></div><script>		function playFlv(url) {if (flvjs.isSupported()) {// 原生H5支持的媒体格式主要有MP4、OGG、WebM、M3U8var videoElement = document.getElementById('vVideo');var flvPlayer = flvjs.createPlayer({url,type: 'flv',isLive: false,hasAudio: false,hasVideo: true,enableStashBuffer: false,changeOrigin: true});flvPlayer.attachMediaElement(videoElement);flvPlayer.load();flvPlayer.play();}}document.getElementById("flvBtn").addEventListener('click', function(){playFlv(document.getElementById('flvUrl').value);}, false);</script>
</body>
</html>

=======================================================================

附:

服务端推流使用的是如下命令

docker pull zlmediakit/zlmediakit:master
docker run -id -p 1937:1935 -p 8080:80 -p 8443:443 -p 554:554 -p 8111:8000/udp zlmediakit/zlmediakit:master
ffmpeg -rtsp_transport tcp -probesize 32 -analyzeduration 5000000 -i "rtsp://waketzheng.top/live/test" -an -c:v libx264 -tune zerolatency -preset ultrafast -b:v 1000k -r 30 -g 15 -c:a aac  -f flv "rtmp://127.0.0.1:1937/live/0"

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/31142.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

森林火灾扑救特类车辆有哪些_鼎跃安全

森林消防是在森林火灾发生时&#xff0c;为了保护森林资源&#xff0c;防止火势蔓延&#xff0c;采取了一系列的应用措施&#xff0c;针对自然环境中的火灾消防工作。森林灭火主要包括预警、预防措施、火情监测、火势控制和灭火等&#xff0c;森林火灾发生的地形往往复杂崎岖&a…

如何判断自己遇到的攻击是SQL注入攻击

要判断自己遇到的攻击是否是SQL注入攻击&#xff0c;可以从以下几个方面进行观察和分析&#xff1a; 攻击方式识别&#xff1a; 观察输入字段&#xff1a;如果攻击者在输入字段&#xff08;如用户名、密码框&#xff09;中输入了非正常的字符或语句&#xff0c;特别是与SQL语法…

【银河麒麟】高可用触发服务器异常重启,处理机制详解

1.服务器环境以及配置 【机型】物理机 处理器&#xff1a; Intel 内存&#xff1a; 126G 【内核版本】 4.19.90-25.16.v2101.ky10.x86_64 【银河麒麟操作系统镜像版本】 Kylin-Server-10-SP2-Release-Shenzhen-Metro-x86-Build01-20220619 Kylin-HA-10-SP2-Release-S…

NGINX_七 nginx 高级应用

七 nginx 高级应用 1 使用alias实现虚拟目录 location /test { # /var/www/qianfeng/index.htmlalias /var/www/qianfeng/;index index.html; }location /test { #/var/www/qianfeng/test/index.htmlroot /var/www/qianfeng/;index index.html; }2 通过 stub_status 模…

yolov10打包为exe

一、前言 本节实验将官方yolov10推理程序打包为exe运行 二、代码 首先下载官方代码至本机&#xff0c;并使用conda创建虚拟环境&#xff0c;并安装好yolov10所需库 conda create --prefix E:/pyenv/myYolo10 python3.8 pip install -r requirements.txt 下载官方模型权重 …

深入理解和实现Windows进程间通信(消息队列)

常见的进程间通信方法 常见的进程间通信方法有&#xff1a; 管道&#xff08;Pipe&#xff09;消息队列共享内存信号量套接字 下面&#xff0c;我们将详细介绍消息队列的原理以及具体实现。 什么是消息队列&#xff1f; Windows操作系统使用消息机制来促进应用程序与操作系…

Git 查看当前分支是基于哪个分支拉取(源头分支)

场景&#xff1a; 项目中使用 Git 管理代码仓库的时候&#xff0c;随着项目的持续迭代及项目的扩展&#xff0c;多版本并行开发是非常常见的事情&#xff0c;多版本并行开发就伴随着多分支&#xff0c;随着 Git 的分支越拉越多&#xff0c;这时候很容易造成分支的混乱&#xf…

AI学习指南机器学习篇-朴素贝叶斯分类器

AI学习指南机器学习篇-朴素贝叶斯分类器 1. 介绍 在机器学习中&#xff0c;朴素贝叶斯分类器是一种简单而有效的分类算法。它基于贝叶斯定理和特征条件独立性假设&#xff0c;可以被用来解决多种分类问题。本篇博客将深入探讨朴素贝叶斯分类器的基本原理&#xff0c;包括如何…

【TensorFlow深度学习】量化压缩技术在降低模型体积中的应用

量化压缩技术在降低模型体积中的应用 量化压缩技术在降低模型体积中的应用1. 引言2. 量化压缩基础3. 实战:使用TensorFlow Lite进行模型量化4. 评估量化效果5. 结果分析与优化建议6. 结语量化压缩技术在降低模型体积中的应用 在深度学习领域,模型的体积和推理速度成为了实际…

蓝牙模块在车载系统中的应用与集成:现状、挑战与未来展望

随着科技的快速发展&#xff0c;蓝牙技术已经深入到我们生活的方方面面&#xff0c;其中车载系统中的应用尤为显著。蓝牙模块作为一种无线通信技术&#xff0c;不仅为驾驶者提供了更加便捷的操作体验&#xff0c;同时也提升了驾驶的安全性。本文旨在分析蓝牙模块在车载系统中的…

selenium框架学习

概念 WEB自动化框架 三大组件: selenium IDE 浏览器插件,实现脚本录制WebDriver 实现对浏览器的各种操作(API包)Grid 实现同时对多个用例进行执行,用例在多个浏览器同步执行环境搭建 1、安装selenium: pip install selenium2、安装浏览器 3、安装浏览器驱动(对应的驱…

FFmpeg源码:ff_h2645_extract_rbsp函数分析

一、ff_h2645_extract_rbsp函数的声明 ff_h2645_extract_rbsp函数的声明放在FFmpeg源码&#xff08;本文演示用的FFmpeg源码版本为5.0.3&#xff0c;该ffmpeg在CentOS 7.5上通过10.2.1版本的gcc编译&#xff09;的头文件libavcodec/h2645_parse.h中。 /*** Extract the raw (u…

东郊到家类型小程序APP软件基于SpringBoot开发的系统源码

项目背景 在快节奏的现代生活中&#xff0c;人们越来越追求高效、便捷的生活方式。上门服务作为一种新型的服务模式&#xff0c;正逐渐受到广大用户的青睐。而这一切的背后&#xff0c;离不开技术的强大支撑。今天&#xff0c;我们就来探讨一下上门服务类型软件的技术魅力&…

常用的基于WebGL的三维WebGIS框架

1. Three.js Three.js 是一款运行在浏览器中的3D引擎&#xff0c;官方地址为https://threejs.org/&#xff0c;你可以用它创建各种三维场景&#xff0c;包括摄影机、光影、材质等各种对象。 2. Babylon.js Babylon.js是一个JavaScript开源框架&#xff0c;基于WebGL和TypeSc…

React Native性能优化红宝书

一、React Native介绍 React Native 是Facebook在React.js Conf2015 推出的开源框架&#xff0c;使用React和应用平台的原生功能来构建 Android 和 iOS 应用。通过 React Native&#xff0c;可以使用 JavaScript 来访问移动平台的 API&#xff0c;使用 React 组件来描述 UI 的…

WebHttpServletRequestResponse(完整知识点汇总)

额外知识点 Web核心 Web 全球广域网&#xff0c;也成为万维网&#xff08;www&#xff09;&#xff0c;可通过浏览器访问的网站 JavaWeb 使用Java技术来解决相关Web互联网领域的技术栈 JavaWeb技术栈 B/S架构&#xff1a;Browser/Server&#xff0c;即浏览器/服务器 架构模式…

ROS2 概念以及通信方式

一、ros2的相关概念 ROS 2&#xff08;Robot Operating System 2&#xff09;是一个用于机器人开发的开源平台&#xff0c;它提供了一系列工具和库&#xff0c;用于构建机器人应用程序。相较于前身ROS&#xff08;ROS 1&#xff09;&#xff0c;ROS 2在设计上考虑了更多的实时…

IT入门知识第六部分《后端开发》(6/10)

目录 后端开发&#xff1a;构建强大的服务端逻辑 1.引言 2.后端技术概述 2.1 数据库 2.2 服务器 2.3 API 2.4 安全性 3.服务器和API 3.1 服务器的作用 3.2 API的作用 4.后端框架 4.1 Node.js 4.1.1 特点 4.1.2 用途 4.1.3 代码案例分析 4.2 Django 4.2.1 特点 …

mac赛车竞速游戏:弯道卡丁车车手 for Mac 中文版下载

《弯道卡丁车车手》是一款刺激的卡丁车竞速游戏&#xff0c;玩家扮演的是赛道上的卡丁车车手&#xff0c;需要在曲线崎岖的赛道上驾驶卡丁车&#xff0c;与其他车手展开激烈的竞速比赛。 游戏中有多种赛道可以选择&#xff0c;每个赛道都有不同的难度和特点&#xff0c;玩家需…

探索webkit的奥秘:打造高效,兼容的现代网页

### 探索 WebKit 的奥秘&#xff1a;打造高效、兼容的现代网页 WebKit 是一个开源的网页浏览引擎&#xff0c;广泛应用于多种浏览器和设备中。为了打造高效且兼容的现代网页&#xff0c;了解和利用 WebKit 的特性和功能是非常关键的。以下是一些深入探讨 WebKit 的关键要点和实…