浏览器直播客户端、浏览器直播系统及浏览器直播方法

技术领域

本发明涉及通信领域，具体涉及一种浏览器直播客户端、浏览器直播系统及浏览器直播方法。

背景技术

随着直播的门槛不断降低，越来越多的用户开始尝试做播主。以往的摄像头直播已经不能满足用户对个性化的需求，于是将自己置于虚拟场景中直播成了用户展示自己的个性化手段之一。

为了达到这个目的，通常选取人脸上较少出现的颜色作为底色，例如绿色。可以准备一块绿色的布作为背景置于人物之后，这样在镜头中除了人物就只有绿色的背景。然后在软件中，使绿色的部分变为透明，搭配预先选取的虚拟场景，就可以达到置身于虚拟场景中的效果。

不同于图片的处理，视频的处理对计算机的运算性能提出了更高的挑战。在30帧1280x960分辨率的画面上，每秒钟需要处理的像素点接近3700万个，有些摄像头甚至达到了1920x1080的分辨率，则需要处理更多的像素点。同时用于直播的计算机或手机还要承担视频编码的压力，这对设备的运算能力提出了一个挑战。

发明内容

本发明的目的在于提供一种浏览器直播客户端、浏览器直播系统及浏览器直播方法，能够满足直播实时对画面进行处理的要求，甚至在手机上也能够流畅运行，耗费资源少。

为了达到上述目的，本发明通过以下技术方案实现：一种浏览器直播客户端，其特点是，包含：

摄像头，用于采集视频信息；

画面获取模块，与所述摄像头连接，用于实时截取摄像头的画面；

存储模块，与所述画面获取模块连接，用于将画面获取模块截取到的摄像头画面的每一帧，作为纹理对象进行存储；

渲染模块，与所述存储模块连接，用于渲染存储模块中存储的纹理对象，过滤纹理对象中像素的参考颜色；

场景贴合模块，与所述渲染模块连接，用于将渲染后的纹理对象与预设的虚拟背景进行贴合，获得贴合后的场景画面信息；

编码器，与所述场景贴合模块连接，用于将贴合后的场景画面信息进行编码，生成用于直播的视频流；

数据传输模块，与所述编码器连接，传输用于直播的视频流。

所述的画面获取模块包含依次连接的截图单元、数据格式判断单元及数据格式转换单元，所述的截图单元与所述摄像头连接，用于截取视频信息的画面，获得摄像头图像，所述的数据格式判断单元与所述存储模块连接，用于判断截图单元截取到的摄像头画面的数据格式，若为YUV格式，则直接将截取到的摄像头画面存储至存储模块，若为RGB格式，则经数据格式转换单元将RGB格式的摄像头画面转换成YUV格式后存储至存储模块。

所述的渲染模块包含一颜色过滤单元及分别与之连接的透明度参数设定单元、参考颜色指定单元，所述的颜色过滤单元分别与所述的存储模块及场景贴合模块连接，所述的参考颜色指定单元用于将指定的关键颜色作为参考颜色，所述的透明度参数设定单元，用于设定像素的透明度参数，所述的颜色过滤单元用于过滤存储模块中存储的纹理对象中像素的参考颜色，并设定纹理对象中像素的透明度参数。

一种浏览器直播系统，其特点是，包含浏览器直播客户端及服务器，所述的浏览器直播客户端用于生成直播的视频流，所述的服务器接收浏览器直播客户端推送的视频流，用户向服务器发送观看直播请求，以查看视频流；

所述的浏览器直播客户端包含摄像头，用于采集视频信息；

画面获取模块，与所述摄像头连接，用于截取摄像头的画面；

存储模块，与所述画面获取模块连接，用于将画面获取模块截取到的摄像头画面的每一帧，作为纹理对象进行存储；

渲染模块，与所述存储模块连接，用于渲染存储模块中存储的纹理对象，过滤纹理对象中像素的参考颜色；

场景贴合模块，与所述渲染模块连接，用于将渲染后的纹理对象与预设的虚拟背景进行贴合，获得贴合后的场景画面信息；

编码器，与所述场景贴合模块连接，用于将贴合后的场景画面信息进行编码，生成用于直播的视频流；

数据传输模块，与所述编码器连接，传输用于直播的视频流至服务器。

所述的画面获取模块包含依次连接的截图单元、数据格式判断单元及数据格式转换单元，所述的截图单元与所述摄像头连接，用于截取视频信息的画面，获得摄像头图像，所述的数据格式判断单元与所述存储模块连接，用于判断截图单元截取到的摄像头画面的数据格式，若为YUV格式，则直接将截取到的摄像头画面存储至存储模块，若为RGB格式，则经数据格式转换单元将RGB格式的摄像头画面转换成YUV格式后存储至存储模块。

所述的渲染模块包含一颜色过滤单元及分别与之连接的透明度参数设定单元、参考颜色指定单元，所述的颜色过滤单元分别与所述的存储模块及场景贴合模块连接，所述的参考颜色指定单元用于将指定的关键颜色作为参考颜色，所述的透明度参数设定单元，用于设定像素的透明度参数，所述的颜色过滤单元用于过滤存储模块中存储的纹理对象中像素的参考颜色，并设定纹理对象中像素的透明度参数。

一种浏览器直播方法，其特点是，包含以下步骤：

S1、实时截取摄像头采集的视频信息，获得摄像头画面；

S2、将摄像头画面的每一帧作为纹理对象进行存储；

S3、对纹理对象进行渲染，过滤纹理对象中像素的参考颜色；

S4、将经过渲染的纹理对象与预设的虚拟背景进行贴合，获得贴合后的场景画面信息；

S5、将贴合后的场景画面信息进行编码，生成用于直播的视频流。

所述的步骤S1中，还包含，若截取到的摄像头画面为YUV格式，则直接进行存储，若截取到的摄像头画面为RGB格式，则将RGB格式的摄像头画面转换成YUV格式后再进行存储。

所述的步骤S3中包含：

指定一关键颜色作为参考颜色；

对待渲染的像素的颜色与参考颜色求差值，并对该差值进行归一化处理；

将归一化处理后的差值作为系数，与待渲染的像素的颜色值中的阿尔法通道值进行相乘，作为输出的像素的颜色的阿尔法通道值，完成对参考颜色的过滤。

所述的参考颜色为绿色。

本发明一种浏览器直播客户端、浏览器直播系统及浏览器直播方法与现有技术相比具有以下优点：能够满足直播实时对画面进行处理的要求，甚至在手机上也能够流畅运行，耗费资源少。

附图说明

图1为本发明一种浏览器直播系统的整体结构示意图；

图2为本发明一种浏览器直播方法的流程图。

具体实施方式

以下结合附图，通过详细说明一个较佳的具体实施例，对本发明做进一步阐述。

如图1所示，一种浏览器直播系统，包含浏览器直播客户端100及服务器200，所述的浏览器直播客户端100用于生成直播的视频流，所述的服务器200接收浏览器直播客户端100推送的视频流，用户向服务器200发送观看直播请求，以查看视频流；所述的浏览器直播客户端100包含摄像头101，用于采集视频信息；画面获取模块102，与所述摄像头101连接，用于截取摄像头的画面；存储模块103，与所述画面获取模块102连接，用于将画面获取模块102截取到的摄像头画面的每一帧，作为纹理对象进行存储；渲染模块104，与所述存储模块103连接，用于渲染存储模块103中存储的纹理对象，过滤纹理对象中像素的参考颜色；场景贴合模块105，与所述渲染模块104连接，用于将渲染后的纹理对象与预设的虚拟背景进行贴合，获得贴合后的场景画面信息；编码器106，与所述场景贴合模块105连接，用于将贴合后的场景画面信息进行编码，生成用于直播的视频流；数据传输模块107，与所述编码器106连接，传输用于直播的视频流至服务器200。

在本实施例中，所述的画面获取模块102包含依次连接的截图单元1021、数据格式判断单元1022及数据格式转换单元1023，所述的截图单元1021与所述摄像头101连接，用于截取视频信息的画面，获得摄像头图像，所述的数据格式判断单元1021与所述存储模块103连接，用于判断截图单元1021截取到的摄像头画面的数据格式，若为YUV格式，则直接将截取到的摄像头画面存储至存储模块103，若为RGB格式，则经数据格式转换单元1023将RGB格式的摄像头画面转换成YUV格式后存储至存储模块103。

在本实施例中，所述的渲染模块104包含一颜色过滤单元1041及分别与之连接的透明度参数设定单元1042、参考颜色指定单元1043，所述的颜色过滤单元1041分别与所述的存储模块103及场景贴合模块105连接，所述的参考颜色指定单元1042用于将指定的关键颜色作为参考颜色，所述的透明度参数设定单元1043，用于设定像素的透明度参数，所述的颜色过滤单元1041用于过滤存储模块103中存储的纹理对象中像素的参考颜色，并设定纹理对象中像素的透明度参数。

结合上述的浏览器直播系统，本发明还公开了一种浏览器直播方法，包含以下步骤：

S1、实时截取摄像头采集的视频信息，获得摄像头画面。

Windows电脑下可以使用DirectShow或者Video For Windows来获取摄像头的画面，若为安卓或苹果操作系统的手机上可以直接调用SDK里提供的功能来获取摄像头的画面。

若截取到的摄像头画面为YUV格式，则直接进行存储，若截取到的摄像头画面为RGB格式，则将RGB格式的摄像头画面转换成YUV格式后再进行存储。

S2、将摄像头画面的每一帧作为纹理对象(一张图片)进行存储。

S3、对纹理对象进行渲染，过滤纹理对象中像素的参考颜色。

指定一关键颜色作为参考颜色，比如绿色；

对待渲染的像素的颜色与参考颜色求差值，并对该差值进行归一化处理；

将归一化处理后的差值作为系数，与待渲染的像素的颜色值中的阿尔法通道值进行相乘，作为输出的像素的颜色的阿尔法通道值，完成对参考颜色的过滤。

渲染纹理对象为本发明的关键点，在本发明中使用像素着色器(Pixel Shader)对每一个像素(Pixel)的透明度根据一定的规则，或者根据用户指定的参数进行调整。

用户需要指定一个关键(Key)颜色作为参考颜色，在像素着色器中，对要渲染的像素的颜色和用户指定的参考颜色求差值，该差值进行归一化处理之后，作为系数与要渲染的像素的颜色值中的阿尔法通道值进行相乘，作为最终输出的像素的颜色的阿尔法通道值。

处理之后的纹理对象在渲染到场景中的时候，与用户指定的参考颜色越相近的颜色，阿尔法通道值会越接近于0，以此达到过滤掉用户指定的参考颜色的目的，最终呈现效果背景为透明，只留下前景，即绿色被去掉，留下前景的人物。

现代的显卡都支持“可编程渲染管线”，在渲染流程中可以送入自定义的程序对渲染步骤进行控制。其中在Windows上，通过Direct3D进行渲染，可以在Pixel Shader里自定义渲染逻辑，将人物背后的绿幕设置为透明；在苹果手机或者安卓系统的手机上，可以通过OpenGL ES里的Fragment Shader将背景的绿幕设置为透明。

具体的，可编程渲染管线是指显卡在渲染场景的过程中，程序员可以对显示运算单元中的着色器进行编程的方式，可以控制和管理显卡的渲染效果。着色器分为顶点着色器和像素着色器。其中顶点着色器是在进行坐标变换和光照计算时工作，因为这里渲染摄像头画面的贴图不涉及到3D变换，所以几乎是对输入的顶点不做任何处理就输出了；而像素着色器是在光栅化环节工作，此时可以对每个渲染层面上的“像素”点进行细微调整，此时可以利用显卡运算，将绿色去除。

像素着色器运算的时候能够参考的数据，可以在渲染一帧之前由程序指定。在像素着色器开始工作之前，程序已经将摄像头画面保存在一张专门的“纹理”中供像素着色器参考，也将需要过滤的颜色(例如这里是绿色)保存在属性里，同时顶点着色器又传递参数过来指明现在渲染的是哪个像素。这样像素着色器在工作过程中，可以从保存有摄像头画面的“纹理”中获取这个要渲染的像素，如果摄像头获取的数据是RGB形式，那么可以利用显卡强大的向量运算能力，直接乘以一个变换矩阵转成YUV格式。然后对表示这个像素点颜色的向量和作为参考的需要过滤的颜色的向量求距离：距离越近，那么这个像素点就要越透明；距离越远，那么这个像素点就越不透明，此举通过修改像素的alpha通道分量来实现。

S4、将经过渲染的纹理对象与预设的虚拟背景进行贴合，获得贴合后的场景画面信息。

S5、将贴合后的场景画面信息进行编码，生成用于直播的视频流。

尽管本发明的内容已经通过上述优选实施例作了详细介绍，但应当认识到上述的描述不应被认为是对本发明的限制。在本领域技术人员阅读了上述内容后，对于本发明的多种修改和替代都将是显而易见的。因此，本发明的保护范围应由所附的权利要求来限定。