这里我们主要介绍后台搭建技术,前端搭建好后，需要后端配置展现,实现的效果就是：网页连接上我们的 websocket服务后，我们就从H264文件中不断的提取出H264帧，然后传递给前端，前端调用webassembly进行解码播放.

视频课程以及源码下载:
https://edu.csdn.net/course/detail/35615

章节列表:

搭建webassembly网页播放器(一)—centeros 虚拟环境搭建
搭建webassembly网页播放器(二)—emcc环境搭建
搭建webassembly网页播放器(三)—emcc编译ffmpeg编译库
搭建webassembly网页播放器(四)—网页调用ffmpeg.js单元测试用例
搭建webassembly网页播放器(五)—网页播放器开发
搭建webassembly网页播放器(六)—websocket后台服务程序

实现效果:

网页播放器后台服务

依赖开源工程
- ffmpeg 编译
- SDL
- libwebsockets
涉及技术点
- 连接池

依赖开源工程

目录结构如下:

对于我们后台程序，主要是 module以及server两个目录，web-clent是网页前端的html以及 webassembly c/c++代码.

module目录主要是我们后台服务程序依靠的第三方开源库;

libwebsockets. 用于帮助我们搭建websocket server.
SDL。
ffmpeg. 使用ffmpeg主要是从h264文件中读取h264 nalu(有点飞机打蚊子的感觉!)

ffmpeg 编译

下载:
git clone https://git.ffmpeg.org/ffmpeg.git ffmpeg

编译:

./configure --prefix=$PWD/../server/ffmpeg --disable-everything --disable-yasm --enable-muxer=h264
make
make install

SDL

官网: http://www.libsdl.org/
介绍:SDL是一个跨平台的库，实现了对windows/linux跨平台的支持，比如:线程,锁,信号量等

./configure --prefix=$PWD/../server/sdl/
make
make install

libwebsockets

官网: https://libwebsockets.org/
介绍: libwebsockets是一个基于C的websocekt开源库,基于它我们制作服务端.

git clone https://libwebsockets.org/repo/libwebsockets
mkdir build
cd build
cmake ..
make

编译后产生的静态库，我们都统一放在了server端目录下:

涉及技术点

连接池

连接池这个技术对于我们做后台并发服务的同学来说，是必须掌握的一个技术!

我们这里运用连接池，主要是为了解决临界问题:

比如这里我们服务停止有2个因素:

文件读完了。
用户关闭了网页，导致websocket服务终端

我们后台有一个会话Session，代表了和网页用户的"通讯",我们会使用std::map存储会话，key就是连接池句柄了!

1和2处于不同的线程，因此必然会导致临界问题，我们使用连接池，我们就可以确保我们的key永远是存活的.

nginx中的http模块对那种高并发情况下的 http请求/关闭，使用连接池还可以解决大量内存动态的分配/释放导致的CPU高负荷的问题.

具体运用，请参考我们的源码和视频讲解!

搭建webassembly网页播放器(六)---websocket后台服务程序相关推荐

搭建webassembly网页播放器(五)---网页播放器开发
在前面的章节中,我们解决emcc环境以及使用emcc来编译ffmpeg得到网页开发中可以使用的js库,本章节,我们就来实现一个简单的播放器. 视频课程以及源码下载: https://edu.csdn. ...
搭建webassembly网页播放器(三)---emcc编译ffmpeg编译库
经过前面的2个部分,我们完成了环境的搭建,接下来我们使用emcc编译ffmpeg库,注意同样由于软链接的缘故,我们不能在windows和linux的共享文件夹里使用emcc编译ffmpeg, 这里我们 ...
搭建webassembly网页播放器(二)---emcc环境搭建
emcc全称 emscripten,最重要的功能就是让网页js调用c/c++ 成为可能,是我们基于webassembly搭建网页播放器必须依赖的编译工具. emcc官网的搭建教程较为简单,安装过程中最 ...
php 在线调用音乐播放器,宅音乐播放器,HTML5网页播放器，带后台管理及API调用，使用thinkphp编写...
宅音乐播放器宅音乐播放器,HTML5网页播放器,集成后台管理及API调用,目前正在开发中,敬请关注技术栈后端:thinkphp 5.1 前端:layui 数据库:mysql 演示整合依赖安装包 ...
php_online_coding,搭建自己的网页播放器——MKOnlinePlayer
MKOnlinePlayer 是一款开源的基于 Meting 的在线音乐播放器.具有音乐搜索.播放.下载.歌词同步显示.个人网易云音乐播放列表同步等功能.界面模仿 QQ 音乐的网页在线播放器,非常好看 ...
H.265网页播放器EasyPlayer实现WebRTC视频实时录像功能
我们在此前的文章中给大家分享过关于EasyPlayer已经实现了实时录像的功能,感兴趣的用户可以戳这篇文章:H5网页播放器EasyPlayer.js如何实现直播视频实时录像? 经过我们不断地摸索和研发 ...
挑选几款开源的、优秀的H.265网页播放器，进行特征整理及使用评价
H265和H264都是视频编码规范,H265是新一代视频编码规范,与H264相比压缩比更高,同样的码率下视频质量更高,或者说同样质量的视频占用的带宽和存储更少.之前由于终端支持有限,h265的推广使用 ...
网吧做直播，制做网页播放器代码全集
<script src="/script/ShowHidden.js" type="text/javascript"></script>
蓝牙耳机被网页播放器关闭问题
蓝牙耳机被网页播放器关闭问题问题描述很长一段时间,电脑连接了蓝牙耳机后,使用谷歌浏览器播放B站视频或者网易云音乐的时候,蓝牙耳机就自动关闭了. 后来试过火狐,edge都是这样的情况,不得已只能使用 ...

搭建webassembly网页播放器(六)---websocket后台服务程序