一种基于WebRTC的课堂实时视频投影方法及系统与流程

本发明涉及教育信息展示领域，特别是涉及一种基于webrtc的课堂实时视频投影方法及系统。

背景技术：

课堂上，教师采用视频投影方式以增强课堂教学的互动性，采用的方式多是将视频文件保存在笔记本电脑、平板电脑或移动手机本地，通过数据适配线与投影展示端设备相互连接达到投影展示的目的。随着课堂对实时投影的需求增多，人们开始研究如何将在课堂实时采集音视频数据投送到pc电脑上展示，专利“一种应用于教学场景的无线视频投影系统”(申请号：201810669242.8)提出一种解决方案:搭建rtmp流媒体服务器用于视频接收、播放及存储，然而播放器和服务器之间的数据传输对网络环境依赖性强，投屏延迟的问题并不能有效解决，甚至会出现人眼能明显感觉的延迟，再者，网络环境的不稳定无疑会加重投屏的延时，严重影响课堂教学的正常进程，因此急需一种低延迟且传输速度快的实时视频投影技术。

webreal-timecommunication(web实时通信，webrtc)由一组标准、协议和javascriptapi组成，用于实现浏览器之间(端到端)的音频、视频及数据共享。在实时通信中，音视频的采集和处理是一个很复杂的过程。比如音视频流的编解码、降噪和回声消除等，但是在webrtc中，这一切都交由浏览器的底层封装来完成。我们可以直接拿到优化后的媒体流，然后将其输出到本地屏幕和扬声器，或者转发给其对等端。专利“云投影的方法、装置及系统”(申请号：201711292228.2)通过webrtc标准向投影展示端发送图像数据及音频数据，以使投影展示端投影图像数据及播放音频数据。投影发送端与投影展示端统一通过webrtc标准传输图像数据及音频数据，而不需利用各自对应协议的数据适配线，实现了点对点的投影方式，可以降低线程部署及管理难度，同时实现了图像数据及音频数据的同时展示，用户体验佳；然而本专利仅仅是移动端屏幕录制的实时投影，并没有提供关于“视频拍摄和同步投影”更详细的解决细节。

技术实现要素：

本发明所要解决的技术问题是克服现有技术的不足，提供一种基于webrtc的课堂实时视频投影方法及系统。

为解决上述技术问题，本发明提供一种基于webrtc的课堂实时视频投影方法，其特征在于，包括通过应用webrtc标准分别在pc端和移动端配置应用程序，平板端应用负责在投影时开启平板电脑的摄像头和麦克风，用于采集视频和音频数据及数据编码，并基于webrtc建立的点对点数据传输通道，将视频和音频以媒体流传输至pc端，pc端接收音视频数据的媒体流后，一方面执行对媒体流的播放，一方面执行对媒体流的保存和本地存储；同时支持移动端对pc端视频播放的远程且实时控制，具体实现步骤有：

步骤1：建立pc端应用和移动端应用之间的tcp控制命令通道；待移动端和pc端接入无线路由，使两者同处于一个局域网内后，基于tcp协议建立并保持pc端应用和移动端应用之间的tcp通信；具体为：

步骤101：通过pc端应用的tcp服务模块启动tcp服务器，服务端口为第一端口，启动侦听是否有pad端发送的连接请求；

步骤102：启动pc端的udp广播，udp服务端口为第二端口，广播内容为：tcp服务端口(即第一端口)及当前pc端应用登录的用户账户；

步骤103：pad端应用的tcp客户端侦听局域网的udp广播，通过接收广播获取pc端的ip地址、服务端口及pc端应用登录的用户账户；

步骤104：根据ip地址，pad端应用向pc端应用发送包含pc端应用登录账户信息的投屏连接请求；特别地，投屏请求选用protobuf编码为二进制数据；

步骤105：pc端的服务器响应连接请求，将请求中pad端应用登录账号信息与pc端应用登录账号信息进行比对，如一致，反馈连接成功；如不一致，反馈连接失败；

步骤2：pc端和移动端向websocket服务器请求连接，具体为：通过websocket服务模块启动websocket服务器，服务端口为第三端口，pc端和移动移动端向websocket服务器发起登记请求，websocket服务器接收请求后，分别为pc端和移动端各自生成身份登记id号，作为pc端和移动端的唯一识别；websocket服务器反馈已有的身份登记id号及各客户端应用信息至pc端和移动端；

步骤3：待pc端和移动端接收到对方的身份登记id号后，pc端和移动端通过交换webrtcsdp信息建立实时双向传输视频的通道，即p2p通道；待移动端和pc端之间用于流媒体传输的p2p通道建立后，移动端产生的实时视频数据和音频数据在转化为流媒体数据能通过p2p通道直接传送至pc端；

步骤4：在移动端拍摄视频的过程中，待移动端捕捉到由用户点击“投影”按钮而触发生成“视频投屏”指令时，向pc端发送“视频投屏”指令，指令中明确媒体编号及音量；pc端接收到指令，调用流媒体播放模块将流媒体流转为视频数据进行播放显示；

特别地，在pc端播放显示过程中，pc端流媒体录制模块对接收到的流媒体数据持续获取并记录保存，直至拍摄结束将记录的流媒体数据转为流媒体文件存储至本地；

步骤5:视频回放的实时控制：待需回放视频投屏时，在保证步骤4视频投屏正常的情况下，由移动端向pc端发送“视频回放”指令，告知pc端回放视频的文件名，pc端接收指令，根据文件名在本地数据库中查对应流媒体数据的存储路径，调取流媒体数据在流媒体播放器中播放；在回放视频投屏过程中，移动端通过发送进度控制指令、音量调节指令及播放状态指令，对pc端的视频进度、视频音量及视频状态进行实时控制。

所述步骤2中，待pc端和移动端连接websocket服务器后，pc端和移动端任一方从websocket信令服务器的退出，均会通知另一方，视频投屏自动结束。

所述步骤3的p2p通道建立过程具体包括：

步骤301：移动端应用发起“启动投影”的指令，移动端应用自动开启摄像头及麦克风，采集实时产生的媒体数据，所述媒体数据包括视频数据及音频数据，并通过tcp控制指令通道通知pc端启动投影；移动端的webrtc客户端模块生成sdp信息，消息参数包括媒体信息、传输协议及媒体流传输信息，其中媒体信息包括要交换的媒体类型、媒体格式及采样率；媒体流传输信息包括移动端地址及远程传输端口；

步骤302：移动端向websocket服务器请求获取媒体流传输服务，告知服务器移动端sdp信息及接收媒体数据的pc端身份登记id号；

步骤303：pc端应用接收到“启动投影”指令，pc端应用的webrtc客户端模块生成sdp信息用于描述媒体信息、传输协议及媒体流传输信息，其中媒体信息包括媒体类型、媒体格式、媒体采样率；媒体流传输信息包括pc端地址及远程传输端口；

步骤304：pc端向websocket服务器申请媒体传输服务，告知服务器pc端sdp及接收媒体数据的移动端身份登记id号；

步骤305：websocket服务器响应移动端和pc端的媒体传输服务请求，应用webrtcice协议，通过交换双方的sdp信息完成p2p传输通道的建立；

步骤306：移动端采集的实时视频数据及音频数据按照sdp要求的媒体参数编码转换成p2p传输通道支持的流媒体数据传输格式，并为当前获传输的流媒体数据生成唯一编号，即流媒体编号；pc端接收到流媒体数据后，调用流媒体录制模块对流媒体数据及编号进行记录.

在所述步骤4中，在pc端播放显示过程中，pc端流媒体录制模块对接收到的流媒体数据持续获取并记录保存，直至拍摄结束将记录的流媒体数据转为流媒体文件存储至本地。

所述步骤4的视频投屏过程中，待移动端捕捉到由用户点击“取消投影显示”按钮而触发生成“停止投屏显示”指令时，向pc端发送“停止投屏显示”的指令，指令内容中明确流媒体编号，移动端拍摄的视频和获取的音频仍旧转为流媒体传输至pc端；pc端调用媒体录制模块对接收到的流媒体数据持续获取并记录保存，但停止调用流媒体播放模块对视频的播放显示；

待移动端捕捉到由用户点击“终止投影”按钮而触发生成“视频传输终止”指令时，向pc端发送“视频传输终止”指令，指令内容中明确流媒体编号，pc端将媒体播放器记录的视频转为流媒体文件，格式为webm，写进本地磁盘，文件名以结束时间命名，精确毫秒，同时记录流媒体文件的存储路径和流媒体编号；pc端将本地保存的流媒体信息反馈至移动端，包括流媒体文件名、录制时长。

所述步骤5的视频回放的实时控制中包括：

所述视频进度实时控制：pc端视频的正常进度变化通过tcp控制指令通道会实时反馈移动端，当移动端出现进度条移动操作进而触发移动端生成“进度变化”指令时，移动端将进度变化状态和当前进度条的位置信息组合成进度控制指令，通过tcp控制指令通道发往pc端；待pc端接收指令后，流媒体播放器模块根据当前进度条位置信息将视频进度移动至相应位置继续播放；

所述视频音量实时控制：音量条移动操作触发移动端生成“音量调节”指令，移动端将音量变化状态和当前音量组合成音量控制指令发往pc端，通过tcp控制指令通道发往pc端；待pc端接收指令后，流媒体播放器模块根据当前音量将音量条移动至相应位置继续播放；

所述视频状态实时控制：点击操作触发移动端生成“视频状态变化”指令，包括视频停止和视频播放，移动端将播放和停止控制指令发往pc端；待pc端接收指令后，流媒体播放器模块按照指令内容控制播放器执行视频暂停和视频播放。

所述步骤3的p2p通道建立过程中，移动端应用产生的sdp信息为：(1)音频数据-opus编码-udp传输协议-采样率48000；(2)视频数据-vp9编码-udp传输协议-采样率：90000。

一种基于webrtc的课堂实时视频投影系统，其特征在于，由pc端应用和平板电脑端应用组成，其中pc端应用的功能模块包括：tcp服务模块、websocket服务模块、websocket客户端模块、webrtc客户端模块、流媒体录制模块、媒体播放模块；平板电脑端应用的功能模块包括：tcp客户端、websocket客户端模块、webrtc客户端模块；

pc端和移动端通过接入同一个无线路由器，使两者同处于一个局域网内；

移动端的tcp客户端连接于pc端的tcp服务模块，用于视频控制指令的传送及接受；移动端的webrtc客户端模块连接于pc端的webrtc客户端模块形成视频传输通道；移动端的websocket客户端模块和pc端的websocket客户端模块均连接于pc端的websocket服务模块进行连接登记，是视频传输通道的建立基础；

所述tcp服务模块，用于响应由tcp客户端发往tcp服务器的连接请求及向tcp客户端发送视频控制指令；

所述websocket服务模块，用于管理接入websocket服务器的websocket客户端；

所述tcp客户端，用于tcp连接服务请求发送及对视频控制指令的响应；

所述websocket客户端模块，通过向websocket服务器请求连接，辅助

点对点视频传输通道的建立；

所述webrtc客户端模块，是点对点视频传输通道的两端，控制视频数据采集编码、实时发送和接收；

所述流媒体录制模块，用于对pc端接收的视频及音频数据流进行录制和播放，并将以流媒体文件保存本地；

所述流媒体播放模块，将流媒体数据转化为视频及音频数据在pc端实时显示。

本发明所达到的有益效果:

(1)本发明在无需搭建额外的流媒体服务器条件下即可实现在局域网内视频实时传输及投影，省去了部署流媒体服务器的繁琐环节，降低了实时投影系统部署的复杂性；

(2)本项目应用webrtc标准建立移动端和pc端的点对点视频传输通道，实现移动端拍摄视频的同时便能在pc端实时投屏，投屏延迟降低至300毫秒，在实时互动中这样的延迟几乎感受不到；

(3)本发明通过局域网实现无线连接，支持移动端对pc端的远程控制，在课堂教学过程中，教师手持移动端任意走动拍摄视频并实时上传pc端展示，同时还能实时控制视频的进度、音量及播放状态，不仅实现拍摄视频与投影视频的同步，也增强了课堂互动性；

(4)本发明通过在pc端配置录播器对实时视频流一边播放一边保存在本地，减少了视频回放时从移动端调用并传送视频的过程，视频从本地调用不仅让投影响应更快，也减少了视频传输投影对网络环境的依赖。

附图说明

图1为本发明实施例中一种基于webrtc的课堂实时投影实现流程示意图；

图2为本发明实施例中一种基于webrtc的课堂实时投影系统的结构图；

图3为本发明实施例中一种基于webrtc的课堂实时投影的系统部署图；

图4为本发明实施例中基于应用账户不匹配的连接失败示意图；

图5为本发明实施例中pc端和pad端之间媒体流传输通道建立过程示意图；

图6本发明实施例中pad端视频状态实时控制的暂定视频示意图；

图7本发明实施例中pad端视频状态实时控制的播放视频示意图。

具体实施方式

下面结合附图和示例性实施例对本发明作进一步的说明：

如图1所示的一种基于webrtc的课堂实时视频投影方法流程示意图，具体步骤包括：

步骤s101：建立pc端应用和移动端(平板电脑、手机等移动设备，此处为pad)应用之间的tcp控制命令通道；基于tcp协议建立并保持pc端应用和pad端端应用之间的tcp通信，具体为：

步骤s101-1：通过pc端应用的tcp服务模块启动tcp服务器，服务端口号设为55088，启动侦听是否有pad端发送的连接请求；

步骤s101-2：启动pc端的udp广播，udp服务端口号为6667，广播内容为：tcp服务端口号及当前pc端应用登录的用户账户；

步骤s101-3：pad端应用的tcp客户端侦听局域网的udp广播，通过接收广播获取pc端的ip地址、服务端口及pc端应用登录的用户账户；

步骤s101-4：根据ip地址，pad端应用向pc端应用发送包含pc端应用登录账户信息的投屏连接请求；特别地，投屏请求选用protobuf编码为二进制数据，以降低传输的数据量；

步骤s101-5：pc端的服务器响应连接请求，将请求中pad端应用登录账号信息与pc端应用登录账号信息进行比对，如若一致，反馈连接成功；如若不一致，反馈连接失败；如图4所示的应用账户不匹配的连接失败示意图，教师用户aa已登入pc端，因此只有登入pad端的教师用户是aa，才能建立成功的连接，否则无法连接，并在pad端提示“pad端和pc端不在同一个网络内”；

步骤s102：pc端和pad端向websocket服务器请求连接，具体为：通过websocket服务模块启动websocket服务器，服务端口是55080，pc端和pad端向websocket服务器发起登记请求，websocket服务器接收请求后，分别为pc端和pad端各自生成身份登记id号，作为pc端和pad端的唯一识别；websocket服务器反馈已有的身份登记id号及各客户端应用信息至pc端和pad端；

特别地，pc端和pad端任一方从websocket信令服务器的退出，均会通知另一方，视频投屏自动结束；

步骤s103：待pc端和移动端接收到对方的身份登记id号后，pc端和移动端通过交换webrtcsdp信息建立实时双向传输视频的通道，即p2p通道；待移动端和pc端之间用于流媒体传输的p2p通道建立后，移动端产生的实时视频数据和音频数据在转化为流媒体数据能通过p2p通道直接传送至pc端；

具体过程见图5为本发明实施例中pc端和pad端之间媒体流传输通道建立过程示意图，包括：

步骤s103-1：教师用户点击“投影”按钮，启动pad端应用发起“启动投影”的指令，pad应用自动开启摄像头及麦克风，采集实时产生的视频数据及音频数据，并通过tcp控制指令通道通知pc端启动投影；pad端的webrtc客户端模块生成sdp信息，消息参数包括媒体信息、传输协议及流媒体传输信息，其中媒体信息包括要交换的媒体类型、媒体格式及采样率；流媒体传输信息包括pad端地址及远程传输端口；

步骤s103-2：pad端向websocket服务器请求获取媒体流传输服务，告知服务器pad端sdp信息及接收媒体数据的pc端身份登记id号；

步骤s103-3：pc端应用接收到“启动投影”指令，pc端应用的webrtc客户端模块生成sdp信息用于描述媒体信息、传输协议及媒体流传输信息，其中媒体信息包括媒体类型、媒体格式、媒体采样率；媒体流传输信息包括pc端地址及远程传输端口；

步骤s103-4：pc端向websocket服务器申请媒体传输服务，告知服务器pc端sdp及接收媒体数据的移动端身份登记id号；

步骤s103-5：websocket服务器响应pad端和pc端的媒体传输服务请求，应用webrtcice协议，通过交换双方的sdp信息完成p2p传输通道的建立；

步骤s103-6：pad端采集的实时视频数据及音频数据按照sdp要求的媒体参数编码转换成p2p传输通道支持的流媒体数据传输格式，并为当前传输的流媒体数据生成唯一编号；pc端接收到流媒体数据后，调用流媒体录制模块对流媒体数据及流媒体编号进行记录。

在pc端播放显示过程中，pc端流媒体录制模块对接收到的流媒体数据持续获取并记录保存，直至拍摄结束将记录的流媒体数据转为流媒体文件存储至本地；

pc端媒体录制模块对接收到的流媒体数据持续获取并记录保存，直至拍摄结束将记录的视频数据转为流媒体文件存储至本地；

特别地：pad端应用产生的sdp信息为：(1)音频数据-opus编码-udp传输协议-采样率：

48000；(2)视频数据-vp9编码-udp传输协议-采样率：90000；

步骤s104：在pad端拍摄视频的过程中，待移动端捕捉到由教师用户点击“投影”按钮而触发生成“视频投屏”指令时，向pc端发送“视频投屏”指令，指令中明确视频编号及视频音量；pc端接收到指令，调用流媒体播放模块将流媒体直接转化为视频数据进行播放；

特别地，待pad端捕捉到由用户点击“取消投影显示”按钮而触发生成“停止投屏显示”指令时，向pc端发送“停止投屏显示”的指令，指令内容中明确视频编号，pad端拍摄的视频仍旧传输至pc端；pc端调用媒体录制模块对接收到的视频数据持续获取并记录保存，但停止调用媒体播放模块对视频的播放显示；

特别地，待pad端捕捉到由用户点击“终止投影”按钮而触发生成“视频传输终止”指令时，向pc端发送“视频传输终止”指令，指令内容中明确视频编号，pc端将媒体播放器记录的视频转为视频文件，格式为webm，写进本地磁盘，文件名以结束时间命名，精确毫秒，同时记录视频文件的存储路径和视频编号；pc端将本地保存的视频信息反馈至pad端，包括视频文件名、视频录制时长；

步骤s105:视频回放的实时控制：待需回放视频投屏时，在保证步骤4视频投屏正常的情况下，由pad端向pc端发送“视频回放”指令，告知pc端回放视频的文件名，pc端接收指令，根据文件名在本地数据库中查找到视频的存储路径，调取视频在媒体播放器中播放；

在回放视频投屏过程中，pad端通过发送进度控制指令、音量调节指令及播放状态指令，对pc端的视频进度、视频音量及视频状态进行实时控制；

视频进度实时控制：pc端视频的正常进度变化通过tcp控制指令通道会实时反馈pad端，当pad端出现进度条移动操作进而触发pad端生成“进度变化”指令时，pad端将进度变化状态和当前进度条的位置信息组合成进度控制指令，通过tcp控制指令通道发往pc端；待pc端接收指令后，媒体播放器模块根据当前进度条位置信息将视频进度移动至相应位置继续播放；

视频音量实时控制：音量条移动操作触发pad端生成“音量调节”指令，pad端将音量变化状态和当前音量组合成音量控制指令发往pc端，通过tcp控制指令通道发往pc端；待pc端接收指令后，媒体播放器模块根据当前音量将视频音量条移动至相应位置继续播放；

视频状态实时控制：如图6所示，点击操作触发pad端生成“视频状态变化”指令，包括视频停止和视频播放，pad端将播放和停止控制指令发往pc端；待pc端接收指令后，按照停止指令控制流媒体播放器执行视频暂停，如图7所示，按照播放指令控制流媒体播放器执行视频暂停和视频播放。

图2为本发明实施例中一种基于webrtc的课堂实时投影系统的结构图；由pc端应用和pad端应用组成，pad端和pc端均接入同一个无线路由器，使两者同处于一个局域网内后，建立基于tcp协议的tcp控制指令通道。图3为本发明实施例中一种基于webrtc的课堂实时投影的系统部署图；在教学课堂场景中，部署pad端、pc端和无线路由；pad端和pc端安装用于实现视频实时投影的应用软件，教师用户需要完成在pad端和pc端的应用登录；pc端的视频投影展示及视频控制，均通过pad端发送指令远程控制。

如图2所示，pc端应用的功能模块包括：tcp服务模块、websocket服务模块、websocket客户端模块、webrtc客户端模块、流媒体录制模块、媒体播放模块；平板电脑端应用的功能模块包括：tcp客户端、websocket客户端模块、webrtc客户端模块。

pc端和移动端通过接入同一个无线路由器，使两者同处于一个局域网内；移动端的tcp客户端连接于pc端的tcp服务模块，用于视频控制指令的传送及接受；移动端的webrtc客户端模块连接于pc端的webrtc客户端模块形成视频传输通道；移动端的websocket客户端模块和pc端的websocket客户端模块均连接于pc端的websocket服务模块进行连接登记，是视频传输通道的建立基础；

所述tcp服务模块，用于响应由tcp客户端发往tcp服务器的连接请求及tcp客户端发送的视频控制指令；

所述websocket服务模块，用于管理接入websocket服务器的websocket客户端；

所述tcp客户端，用于tcp连接服务请求发送及发送视频控制指令；

所述websocket客户端模块，通过向websocket服务器请求连接，辅助

点对点视频传输通道的建立；

所述webrtc客户端模块，是点对点视频传输通道的两端，控制视频数据采集编码、实时发送和接收；

所述流媒体录制模块，用于对pc端接收的视频及音频数据流进行录制，并将以流媒体文件保存本地；

所述流媒体播放模块，将流媒体数据转化为视频及音频数据在pc端实时显示。

本发明主要用于提供一种基于webrtc的课堂实时视频投影方法及系统，本发明所达到的有益效果:

(1)本发明在无需搭建额外的流媒体服务器条件下即可实现在局域网内视频实时传输及投影，省去了部署流媒体服务器的繁琐环节，降低了实时投影系统部署的复杂性；

(2)本项目应用webrtc标准建立移动端和pc端的点对点视频传输通道，实现移动端拍摄视频的同时便能在pc端实时投屏，投屏延迟降低至300毫秒，在实时互动中这样的延迟几乎感受不到；

(3)本发明通过局域网实现无线连接，支持移动端对pc端的远程控制，在课堂教学过程中，教师手持移动端任意走动拍摄视频并实时上传pc端展示，同时还能实时控制视频的进度、音量及播放状态，不仅实现拍摄视频与投影视频的同步，也增强了课堂互动性；

(4)本发明通过在pc端配置录播器对实时视频流一边播放一边保存在本地，减少了视频回放时从移动端调用并传送视频的过程，视频从本地调用不仅让投影响应更快，也减少了视频传输投影对网络环境的依赖。

以上实施例不以任何方式限定本发明，凡是对以上实施例以等效变换方式做出的其它改进与应用，都属于本发明的保护范围。