vue使用vue-h265-player播放h265编码格式视频流

这篇具有很好参考价值的文章主要介绍了vue使用vue-h265-player播放h265编码格式视频流。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

GitHub地址

vue-h265-player

支持h265编码格式视频流播放

vue使用vue-h265-player

1、安装vue-h265-player
npm install vue-h265-player
2、拷贝libDecoder.wasm文件到public目录下

复制node_modules/h265-player/lib/libDecoder.wasm文件到public目录下

h265 vue,vue.js,javascript,前端

3、示例代码

url: 需要播放的链接,播放器会根据该值的变化自动重启。
maxRetryCount: 最大尝试重连次数,到达次数上限后会触发 on-errorevents:
on-error: 链接不可用时会触发该方法文章来源地址https://www.toymoban.com/news/detail-631776.html

<template>
  <div id="app">
    <H265Player
      @on-error="handleOnError"
      :url="url"
      style="width: 80vw;height:45vw"
    />
  </div>
</template>

<script>
  import H265Player from 'vue-h265-player';

  export default {
    name: 'App',
    components: {
      H265Player,
    },
    data: () => ({
      url: 'a h265 hls url',
    }),
    methods: {
      handleOnError(error) {
        console.log('error: ', error);
      },
    },
  };
</script>

到了这里,关于vue使用vue-h265-player播放h265编码格式视频流的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 各大浏览器对H264、H265编码格式视频的支持情况

    web项目开发时,经常会遇到播放视频的情况,目前主流的视频编码格式有:H264、H265、VP8、VP9、DIVX等,主流的浏览器有:谷歌、火狐、Edge、Safari等,但由于浏览器对各编码的支持程度不一,导致部分视频无法播放,具体支持情况如下图(仅供参考): AVC(h264) HEVC(H265) MPEGS(D

    2024年02月14日
    浏览(30)
  • uniapp 使用 mui-player 插件播放 m3u8/flv 视频流

    背景 :uniapp 开发的h5项目,需要播放m3u8/flv后缀的视频,网上有很多视频插件,但是样式和效果不尽如人意,博主最后选择mui-player插件,定制化稍微强一点以及有官方文档可以阅读,官网文档https://muiplayer.js.org/zh/guide/ tips :建议先阅读官方文档,再在页面进行引入 博主最后

    2023年04月19日
    浏览(36)
  • Web 端支持 h265 硬解 web播放H.265流媒体 网页播放H.265

    1、背景 Web 端实时预览 H.265 需求一直存在,但由于之前 Chrome 本身不支持 H.265 硬解,软解性能消耗大,仅能支持一路播放,该需求被搁置。 去年 9 月份,Chrome 发布 M106 版本,默认开启 H.265 硬解,使得实时预览支持 H.265 硬解具备可行性。 然而 WebRTC 本身支持的视频编码格式

    2024年02月02日
    浏览(57)
  • 基于Python的pyAV读取H265(HEVC)编码的视频文件

            利用海康威视相机拍出来的视频是H265格式的,相比于常规的H264编码,压缩率更高,但因此如果直接用之前的方法读取,会出现无法读取的情况,如下。         可以看到,对于帧间没有改变的部分,H265编码就只保存一份,因此直接解析出来就都是空白的,只

    2024年02月22日
    浏览(35)
  • 基于GB28181-2022实现web无插件播放H265视频

            目前发布的GB28181-2022增加了对前端设备视频H265编码格式的支持,所以实现国标平台通过浏览器对H265视频流的无插件的解码播放将是未来的趋势。         目前大多的方案都是通过平台端把H265转码为H264,再推送到web前端进行解码播放,这种方式因为需要中间的媒体

    2024年02月06日
    浏览(35)
  • H265、VP9、AV1视频编码器性能对比

    目前在视频编解码器中,H264 已经成为绝对的主流,被大部分设备、浏览器所支持。虽然有更先进的编码器推出,但是受限于推广速度和设备支持成本,一直未能成为主流。 今年公司的目标是持续降本增效,现在将”屠刀“指向了视频业务的存储成本。视频文件存储主要两块

    2024年02月03日
    浏览(37)
  • 解决FFmpeg播放RTSP推送的H265码流报错问题

    RTSP(Real Time Streaming Protocol),实时流传输协议,是TCP/IP协议体系中的一个 应用层 协议。 RTP(Real-time Transport Protocol)实时传输协议,是一个网络传输协议,它位于 传输层 ,但通常运行在UDP协议之上。 去年我写过两篇关于使用RTSP推送H265码流并拉流显示的文章。实现HEVC码流R

    2024年02月15日
    浏览(31)
  • 基于rk3568 Android H265推流SRS低延迟网页播放方案

           在音视频领域,融合推流,低码流,低延迟,浏览器H5化是一个降低成本,提升用户体验的重要手段。同时适配现有直播的生态也是一个必要条件。       在满足上述要求的情况下,我做了以下实践,取得了良好的效果。      在实践中,我们选择采用了成熟的rtmp做

    2024年02月01日
    浏览(37)
  • 【音视频处理】转编码H264 to H265,FFmpeg,代码分享讲解

    大家好,欢迎来到停止重构的频道。 本期我们讨论音视频文件 转编码 ,如将视频H264转H265等。 内容中所提及的 代码都会放在GitHub ,感兴趣的小伙伴可以到GitHub下载。 我们按这样的顺序展开讨论:​ 1、  编码的作用  2、  转编码的工作原理 3、  编解码器安装  4、  示

    2024年02月11日
    浏览(37)
  • vue2 组件vue-video-player播放视频,支持hls格式

    参考教程:https://juejin.cn/post/6939898078526881823 官方:https://github.com/surmon-china/videojs-player 安装指令 安装指令要注意带上版本号,如果没有会默认使用最新版,最新版仅支持vue3,因此会出问题。 HLSPlay.vue 自定义组件代码 直接引用,如果组件配置了自动播放,则会自动播放。 更

    2024年02月11日
    浏览(33)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包