vue播放flv格式的直播流

  • 在ios无法播放,安卓可以

安装

npm install flv.js --save

页面

<template><div><videoref="videoElement"style="width: 100%; height: 100%"autoplayplaysinlinemuted></video></div>
</template><script>
import FlvPlayer from "flv.js";export default {data() {return {player: null,streamUrl:"http://180.101.234.45:10554/icvs/stream.flv?puid=201115203876589199&token=18lCFOd-9d&idx=0&stream=0&resType=IV&random=72b8f655-6e51-489a-a38f-af73087be20f",};},mounted() {this.initPlayer();},methods: {async initPlayer() {FlvPlayer.isSupported() && (await FlvPlayer.getFeatureList());this.player = FlvPlayer.createPlayer({type: "flv",url: this.streamUrl,});// 设置视频元素this.player.attachMediaElement(this.$refs.videoElement);// 监听播放器就绪事件this.player.on(FlvPlayer.Events.MEDIA_INFO, () => {// 在此可以做一些播放器初始化后的操作});// 加载和播放视频this.player.load();this.player.play();},},beforeDestroy() {if (this.player) {this.player.destroy();}},
};
</script>

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

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

相关文章

【设计模式深度剖析】【11】【行为型】【解释器模式】| 以算术表达式求值为例加深理解

&#x1f448;️上一篇:状态模式 设计模式-专栏&#x1f448;️ 文章目录 解释器模式定义英文原话直译 解释器模式中的角色1. 抽象表达式&#xff08;AbstractExpression&#xff09;2. 终端表达式&#xff08;TerminalExpression&#xff09;3. 非终端表达式&#xff08;Non…

6.S081的Lab学习——Lab7: Multithreading

文章目录 前言一、Uthread: switching between threads (moderate)提示&#xff1a;解析 二、Using threads (moderate)解析&#xff1a; 三、Barrier (moderate)解析&#xff1a; 总结 前言 一个本硕双非的小菜鸡&#xff0c;备战24年秋招。打算尝试6.S081&#xff0c;将它的…

OpenCV--波滤器(二)

高通滤波器 代码和笔记 代码和笔记 import cv2 import numpy as np""" 高通滤波器--锐化图像&#xff0c;增强图像中的高频成分&#xff0c; 如边缘(边缘检测&#xff1a;旨在找出图像中亮度变化显著的区域&#xff0c;大幅度地减少了数据量&#xff0c;并剔除…

[Linux] 文件系统

UNIX操作系统将文件组织成一个有层次的树形结构&#xff1a; 标准目录&#xff1a; 根目录&#xff1a; /tmp目录 主目录&#xff1a; 这就是主目录 一般与系统有关的信息都存放在etc目录下 注意&#xff1a; /etc/passwd存放的是用户账户信息&#xff0c;不是密码信息&#xf…

ubuntu换镜像源方法

查看ubuntu的版本&#xff0c;不同的版本对应的不同的镜像源 cat /etc/issue Ubuntu 18.04.6 LTS \n \l 先备份一个&#xff0c;防止更改错误 cobol cp /etc/apt/sources.list /etc/apt/sources.list.backup 先进入清华源,搜索ubuntu&#xff0c;点击问号 点进来可以看到可以…

VMware RedHat虚拟机磁盘扩容(添加磁盘和扩展磁盘)

前言 自己的电脑上配一个虚拟机还是很有必要的&#xff0c;用起来比双系统方便一点&#xff0c;之前搞了100g的ubuntu没用到&#xff0c;后面重装redhat觉得随便搞个20g就够用了&#xff0c;后面用到之后就遇到磁盘不够用的情况&#xff0c;只能说情况允许的话&#xff0c;磁盘…

FPGA生成图像Modelsim仿真生成BMP图片保存显示

FPGA生成图像模板&#xff0c;产生RBG格式棋盘格。利用Modelsim仿真&#xff0c;将FPGA生成的图片转化成BMP图片保存并显示。 一&#xff1a;仿真代码 timescale 1ns/1ps module design_1_wrapper_top (); reg clk_100MHz; reg clk_300MHz; wire [31:0]clk_rate; …

为微信小程序项目添加eslint

背景 在使用vscode开发微信小程序的过程中&#xff0c;修改js的时候发现没有报错提示&#xff0c;让我很不习惯&#xff0c;所以想为微信小程序项目添加eslint配置 编码实战 为微信小程序配置ESLint可以遵循以下步骤&#xff1a; 安装ESLint及其相关插件 首先&#xff0c;…

spring和Mybatis的逆向工程

文章目录 十二、注解开发1、注解方式单表的增删改查的操作 十三、逆向工程13.1、创建逆向工程的步骤⑴添加依赖⑵配置MyBatis的核心配置文件⑶创建逆向工程的配置文件,该文件文件名必须是&#xff1a;generatorConfig.xml 13.2测试 十四、分页插件14.1、使用步骤14.2分页插件的…

基于IDEA的Maven(坐标信息介绍和编写)

这篇博客来学习和分析一下&#xff1a; " pom.xml " 所生成的最基本的信息。 之前的博客中讲到&#xff0c;学 Maven 就是学 " pom.xml " 的配置。后面也会围绕这个文件进行学习。 目录 一、分析 pom.xml 文件 &#xff08;1&#xff09;分析的 "p…

2024 年最新 Python 基于火山引擎豆包大模型搭建 QQ 机器人详细教程(更新中)

豆包大模型概述 火山引擎官网&#xff1a;https://www.volcengine.com/ 字节跳动推出的自研大模型。通过字节跳动内部50业务场景实践验证&#xff0c;每日千亿级tokens大使用量持续打磨&#xff0c;提供多模态能力&#xff0c;以优质模型效果为企业打造丰富的业务体验。 模型…

代码随想录算法训练营刷题复习6 :贪心算法2/2

贪心算法 贪心算法这些题中&#xff0c;关于区间的问题可以进行小总结&#xff0c;今天有事耽搁了还没来得及写 860. 柠檬水找零 406. 根据身高重建队列 452. 用最少数量的箭引爆气球 435. 无重叠区间 按照区间的左界对区间进行升序排序&#xff08;如遇到相同的值&#xf…

数据库 | SQL语言和关系代数汇总篇(*^▽^*)

双重/两个 not exists 嵌套查询 简单分析_两个not exists-CSDN博客 最明白的 not exists 双层嵌套讲解 SQL 查询语句_not exist 嵌套-CSDN博客 1. 答案&#xff1a; 2. 答案&#xff1a; 3. 4. 5. 6. 7. 8. 这个SQL查询是从两个表&#xff08;假设是SPJ和P&#xff09;中检…

智能合约新项目 链上智能合约前端H5源码 智能合约区块链 以太坊前端调用智能合约

智能合约新项目 链上智能合约前端H5源码 智能合约区块链 以太坊前端调用智能合约 源码下载&#xff1a;https://download.csdn.net/download/m0_66047725/89402192 更多资源下载&#xff1a;关注我。

.NET+Python量化【1】——环境部署和个人资金账户信息查询

前言&#xff1a;量化资料很少&#xff0c;.NET更少。那我就来开个先河吧~ 以下是使用QMT进行量化开发的环境部署和基础信息获取有关操作。 1、首先自己申请券商的QMT权限&#xff0c;此步骤省略。 2、登陆QMT&#xff0c;选择极简模式&#xff0c;或者独立交易模式之类的。会进…

阿里员工:“大厂病”导致有些人不太正常

阿里巴巴对“大公司病”开刀 阿里巴巴宣布对“大公司病”开刀&#xff0c;终于有高层意识到这个问题的严重性&#xff0c;并决心解决。所谓“大公司病”&#xff0c;不仅体现在规模臃肿、部门繁多、层次复杂&#xff0c;还包括中层管理人员的不作为。这些人处在上传下达的位置&…

软件测试面试题回答

**软件测试面试题回答** 一、**软件测试基础知识** 1. **测试的目的** - 软件测试的目的是为了找出软件中的缺陷和错误&#xff0c;确保软件的质量符合预定的需求和期望。通过测试&#xff0c;我们可以提高软件的可靠性、稳定性和用户满意度。 2. **测试的分类** - 测…

旅游管理平台系统

摘要 如今许多地区的风景已经随着网络技术的不断发展和进步而映入人们的眼帘&#xff0c;旅游已经成为一种大众化的休闲方式。而青海海西州风光旖旎&#xff0c;民族文化独特&#xff0c;更是吸引了众多游客纷至沓来。海西州地域广阔、人烟稀少、是一个经济发展缓慢的地方&…

nginx+tomcat负载均衡、动静分离群集【☆☆☆☆☆】

Nginx是一款非常优秀的HTTP服务器软件&#xff0c;性能比tomcat更优秀&#xff0c;它支持高达50 000个并发连接数&#xff0c;拥有强大的静态资源处理能力&#xff0c;运行稳定&#xff0c;内存、CPU等系统资源消耗非常低。目前很多大型网站都应用Nginx服务器作为后端网站程序的…

Python Textract库:文本提取

更多Python学习内容&#xff1a;ipengtao.com Textract是一个强大的Python库&#xff0c;用于从各种文件格式中提取文本。无论是PDF、Word文档、Excel电子表格、HTML页面还是图像&#xff0c;Textract都能有效地提取其中的文本内容。Textract通过集成多种开源工具和库&#xff…