基于 webassembly 的 H265 视频播放器前端 Angular 学习笔记 8:学习源码分享

最新推荐文章于 2024-01-04 16:18:32 发布
最新推荐文章于 2024-01-04 16:18:32 发布
阅读量287 收藏 1
点赞数
分类专栏： 流媒体
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yjkhtddx/article/details/107236050
版权

学习源码分享（gitee，github）欢迎交流

本文基于开源项目decoder_wasm使用Angular开发的前端页面项目，对项目整理结构进行的改动，并使用Typescript重写大部分js源码，便于维护。
着重学习Angular框架下Worker，Wasm的使用，本人非前端开发从业人员，页面简陋请见谅。

文章目录

源码分享

已经把测试源码提交的git仓库，可以通过源码分析笔记，希望能帮助您。

gitee

gitee: https://gitee.com/yjkhtddx/AngularTest

github

github: https://github.com/yjkhtddx/AngularTest

跃龙客
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基于Web Assembly的H265播放器实现
ssnxly的博客
02-05 2786
项目概述 随着视频编码技术的发展，相比H.264，H.265具有同等画质体积一半、画质更清晰细腻、编码效率更高等诸多优势。 但因版权等因素主流浏览器还不支持H.265的解码，因此需要专门的插件实现解码。本项目基于Web Assembly(封装FFmpeg库)、JS解封装、Canvas投影以及AudioContext实现了Web端的H265播放。 播放器显示效果如下： 功能简介 播放器主要分为UI...
webassembly视频无插件播放器
03-04
通过webassembly技术，http-flv拉实流通过ffmpeg.js进行解码。webassembly封装了ffmpeg的c代码通过二进制封装为.js文件进行软解。
基于WebAssembly的H265播放器.pdf
12-18
对直播行业来说，带宽意味着成本，如何降低带宽的占用，是直播行业持续探索的方向。而 WebAssembly 能够以较低成本复用 FFmpeg 成熟的音视频编解码能力。介绍了『基于 WebAssembly+FFmpeg 的 H.265 播放器』的整体设计思路和架构，线上的一些实践，以及对未来的展望。
基于webassembly的H265视频播放器前端Angular学习笔记2:创建Angular组件获取H265文件数据
yjkhtddx的专栏
07-03 489
基于webassembly的H265视频播放器前端Angular学习笔记2:创建Angular组件获取H265文件数据创建简单的界面读取H265文件内容简单的界面读取H265文件内容 本文基于开源项目decoder_wasm使用Angular开发的前端页面项目，对项目整理结构进行的改动，并使用Typescript重写大部分js源码，便于维护。 着重学习Angular框架下Worker，Wasm的使用，本人非前端开发从业人员，页面简陋请见谅。 创建简单的界面读取H265文件内容 简单的界面 创建组件 $ ng
花椒前端基于WebAssembly 的H.265播放器研发
360技术
07-16 4179
奇技指南随着近些年直播技术的不断更新迭代，高画质、低带宽、低成本成为直播行业追求的重要目标之一。本文介绍花椒直播基于WebAssembly 的H.265播放器研发。本文来...
Angular4学习笔记router的简单使用
01-21
router，也就是路由，是前端中一个比较重要的概念。通过router把特定的地址和对应的页面关联后分离出来，以达到解耦的目的。在src/app目录下新建一个detail的文件夹，建立一个名为gundam-detail.component的文件。 ...
angular-video-player:Angular学习项目-视频播放器，实时演示>
05-03
Angular-视频播放器 现场演示： : 要在系统中启动并运行项目，请按照以下说明进行操作。 安装Node.js和npm 如果尚未在计算机上安装最新版本的Node.js，请下载它。 此下载还将包括最新版本的npm。 下载此存储库 将...
Angular学习笔记之angular的$filter服务浅析
01-19
2、AngularJS内置了currency、date、filter、json、limitTo、lowercase、uppercase、number、orderBy这8个filter； 3、filter可以嵌套使用，用管道符号”|”来分隔（有点像linux）； 4、filter可以传递参数； 5、...
Angular学习笔记之集成三方UI框架、控件的示例
11-27
本文介绍了Angular学习笔记之集成三方UI框架、控件的示例，分享给大家，具体如下： 安装 Material UI 方法： Material 官网：https://material.angular.io step 1: npm install --save @angular/material @angular...
Angular js学习视频教程
04-14
前端教程之 Angular 教程
h265播放器
12-03
该播放器可以播放通过HM源码转出来的h265，麻雀虽小，用用还是没有问题的
h265player:一套完整的Web版H.265播放器解决方案，非常适合学习交流和实际应用。基于JS码流解封装、WebAssembly(FFmpeg)视频解码，利用Canvas画布投影、AudioContext播放音频
04-23
简介 随着视频编码技术的发展，相比H.264, H.265同等画质体积仅为一半、带宽占用省一半、画质更细腻等诸多优势。 但Web浏览器还不支持H.265的解码播放，因此基于Web Assembly(封装FFmpeg)、JS解封装、Canvas投影以及AudioContext实现Web端的H265播放。 支持主要浏览器及其版本如下： Chrome（>57） Safari (>11) Firefox (>52) 本项目是一个公开的基础可用版本，并不含有具体的业务代码。业务可基于此项目进行具体业务实现。 安装与测试 下载源码 # 创建根目录 * mkdir goldvideo * cd goldvideo # 下载h265player源码, 创建h265player目录 * git clone https://github.com/goldvideo/h265player.git * cd h2
h265web.js-wasm-decoder::fire:WebAssemblyAPI H.265HEVC解码器，返回YUV帧
05-08
h265web.js-wasm-decoder 底层解码API 可以直接用于自定义开发H.265播放器 Demo 媒资信息 Input #0, hevc, from 'res/video40_265_moov.hevc':  Duration: N/A, bitrate: N/A    Stream #0:0: Video: hevc (Main), yuv420p(tv), 1280x720, 25 fps, 25 tbr, 1200k tbn, 25 tbc 目录 3、其它 捐赠 FFmpeg转码H.265/HEVC编码的265测试文件 0、说明 当前能力 能力 能力 是否支持 其他 HEVC/H.265 Nalu解析 是 ---- HEVC/H.265 帧解码 是 ---- 协议 协议 是否支持 说明 HEVC/H.265 点播 是 ---- HEVC/H.265 点播 是 ---
通过RTMP播放H265 H264 OCX控件
11-21
通过RTMP播放H265,H264控件，最多支持十六路窗口，接口丰富。VC,VB,网页，.net都能调用
基于webassembly的H265视频播放器前端Angular学习笔记7:在WebWorker中解码H265数据
yjkhtddx的专栏
07-09 658
基于webassembly的H265视频播放器前端Angular学习笔记7:在WebWorker中解码H265数据 本文基于开源项目decoder_wasm使用Angular开发的前端页面项目，对项目整理结构进行的改动，并使用Typescript重写大部分js源码，便于维护。 着重学习Angular框架下Worker，Wasm的使用，本人非前端开发从业人员，页面简陋请见谅。 文章目录基于webassembly的H265视频播放器前端Angular学习笔记7:在WebWorker中解码H265数据创建组件与路
通过WebAssembly在移动端解码H.265
LiveVideoStack
03-23 7344
本文转自淘宝技术，文章详细介绍了如何通过WebAssembly在移动Web端实现H.265解码，既享受到了H.265更高的编码效率，又实现了在多种移动端浏览器上兼容。未来...
webassembly环境搭建、编译h265解码器、js调用
jianglei382873012的博客
08-19 1604
一、安装docker环境 1.1、安装docker源 cd /etc/yum.repos.d/ wget -o /etc/yum.repos.d/docker-ce.repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo 1.2、修改源为阿里云 编辑替换https://download.docker.com 为http://mirrors.aliyun.com/docker-ce vi docker-ce.repo
基于WebAssembly无插件解码H264/H265码流播放器
最新发布
qq_44895902的博客
01-04 1916
基于WebAssembly无插件解码H264/H265码流播放。
前端学习笔记 javascript
08-31
对于前端学习笔记，我可以给你一些常见的主题和要点，帮助你开始学习前端开发。 1. HTML基础： - 了解HTML的基本结构和标签 - 学习如何创建和组织网页内容 - 掌握常用的HTML标签，如标题、段落、链接、图像等 2. ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值