本发明涉及在线直播视频领域，具体涉及一种直播视频广告遮蔽方法、装置、服务器及存储介质。
背景技术：
随着互联网的高速发展，在线直播视频应用日益广泛，部分主播会在直播时，在直播画面中打各种广告，经审核人员提醒关闭后，效果并不好，但又达不到强制关闭直播的程度，需要一种能在直播画面中添加矩形遮罩(马赛克)来遮蔽广告的方案。
目前现有的技术是审核人员在管理平台中，通过预估广告相对直播画面的位置坐标点，坐标点的值规定是0到1的浮点数，然后填入管理平台的表单中，通过服务器推送这个坐标点，到直播视频流中达到遮蔽的目的，由于这个坐标点是审核人员预估，而且0到1的数值相对直播画面误差较大，并不能直观精准的进行广告的遮挡，而且对视频流的操作消耗服务器资源的同时，这种操作对视频流来说是不可逆的。
技术实现要素：
鉴于现有技术存在的问题，本发明的目的是提供一种直播视频广告遮蔽方法、装置、服务器及存储介质，克服了当前技术方案的缺陷，具有无加载延时，无黑屏，无额外资源消耗，精准直接，应用普适性强。
为了实现上述目的，本发明采用的技术方案为一种直播视频广告遮蔽方法，所述方法包括以下步骤：
s1、在管理平台界面中新建遮蔽区域并输入直播间房间号，通过服务端截取直播间实时直播画面，生成图片；
s2、创建与步骤s1中图片同等宽高的canvas画布元素，将canvas画布元素进行初始化，并通过javascript脚本语言对canvas画布元素进行绘图操作，得出遮蔽区域位置数据；
s3、将步骤s2中得到的遮蔽区域位置数据提交至服务端，服务端接收到数据后自动通过tcp协议与前端播放器通信，最终播放器获取遮蔽区域位置数据，并在目标直播间直播视频画面中添加马赛克矩形图案。
在上述技术方案中，所述步骤s2中所述canvas画布元素进行的初始化分为以下步骤：
s21、将canvas画布元素的宽高按照等比模式进行设置；
s22、将canvas画布元素通过javascript拖拽事件完成矩形绘制，设置矩形边框的宽度及颜色，得出遮蔽区域的坐标数据，并创建确定取消按钮元素，作为获取遮蔽区域的触发节点；
s23、将获取的遮蔽的坐标数据与宽高按照等比模式进行设置，最后输出至服务端。
在上述技术方案中，所述步骤s22中所述javascript拖拽事件完成矩形绘制分为以下步骤：
s221、将canvas画布元素添加mousedown事件、mousemove事件、mouseup事件；
s222、所述mousedown事件记录鼠标移动坐标起始点并命名为origin，记录要绘制矩形的唯一id；
s223、所述mousemove事件记录鼠标移动过程中不断更新的坐标点，并计算得到矩形宽高wh，所述wh为所述canvas画布元素的宽高，同时维护由origin与wh构成的坐标数据队列；
s224、所述mouseup事件绘制由origin、wh、id数据队列构成的矩形。
在上述技术方案中，所述步骤s3中canvas画布元素获取遮蔽位置的数据保存于管理平台，当审核人员需要查看上次编辑的遮蔽坐标的时候，canvas画布元素重新将此数据传输出来进行canvas画布元素的初始化，对遮蔽区域实现增删改查的功能。
本发明还公开一种直播视频广告遮蔽装置，所述装置包括直播视频画面截取模块、绘制图形模块、整合模块；
所述直播视频画面截取模块，用于在管理平台界面中新建遮蔽区域并输入直播间房间号，截取直播间实时直播画面，生成图片；
所述绘制图形模块，用于创建与直播视频画面截取模块生成的图片同等宽高的canvas画布元素，并将canvas画布元素进行初始化，通过javascript脚本语言对canvas画布元素进行绘图操作，得出遮蔽区域位置数据；
所述整合模块，用于将绘制图形模块中得到的遮蔽区域位置数据提交至服务端，服务端接收到数据后自动通过tcp协议与前端播放器通信，最终播放器获取遮蔽区域位置数据，并在目标直播间直播视频画面中添加马赛克矩形图案；
在上述技术方案中，所述绘制图形模块包括以下模块：
初始设置模块，用于将canvas画布元素的宽高按照等比模式进行设置；
绘制矩形模块，用于将canvas画布元素通过javascript拖拽事件完成矩形绘制，设置矩形边框的宽度及颜色，得出遮蔽区域的坐标数据，并创建确定取消按钮元素，用于获取遮蔽区域的触发节点；
调整输出模块，用于将获取的遮蔽的坐标数据与宽高按照等比模式进行设置，最后输出至服务端。
在上述技术方案中，所述绘制矩形模块包括以下模块：
添加事件模块，用于将canvas画布元素添加mousedown事件、mousemove事件、mouseup事件；
记录起始坐标模块，用于将所述mousedown事件记录鼠标移动坐标起始点并命名为origin，记录要绘制矩形的唯一id；
记录移动坐标模块，用于将所述mousemove事件记录鼠标移动过程中不断更新的坐标点，并计算得到矩形宽高wh，所述wh为所述canvas画布元素的宽高，同时构建由origin与wh组成的坐标数据队列；
构建矩形图形模块，用于将所述mouseup事件绘制由origin、wh、id数据队列构成的矩形。
在上述技术方案中，所述整合模块中canvas画布元素获取遮蔽位置的数据保存于管理平台，当审核人员需要查看上次编辑的遮蔽坐标的时候，canvas画布元素重新将此数据传输出来进行canvas画布元素的初始化，对遮蔽区域实现增删改查的功能。
本发明还公开一种直播视频广告遮蔽装置，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述一种直播视频广告遮蔽方法的步骤。
本发明还公开一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现上述任一项所述一种直播视频广告遮蔽方法的步骤。
本发明一种直播视频广告遮蔽方法、装置、服务器及存储介质，具有以下有益效果：本发明运用canvas画布元素进行绘图操作高效遮蔽广告，具有无加载延时，无黑屏，无额外资源消耗，精准直接和应用普适性强，并且此方法可推广至遮蔽直播画面中包含暴力色情引起不适的场景。
附图说明
图1为本发明实施例一提供的一种直播视频广告遮蔽方法的流程图；
图2本发明实施例二提供一种直播视频广告遮蔽方法的anvas画布元素进行的初始化的方法流程图；
图3本发明实施例三提供一种直播视频广告遮蔽方法的avascript拖拽事件完成矩形绘制方法流程图；
图4为本发明实施例四提供一种直播视频广告遮蔽装置模块示意图；
图5为本发明实施例五提供的服务器的结构示意图。
具体实施方式
本发明提供一种直播视频广告遮蔽方法、装置、服务器及存储介质，无额外资源消耗，精准直接。
为使得本发明的发明目的、特征、优点能够更加的明显和易懂，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，下面所描述的实施例仅仅是本发明一部分实施例，而非全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例，都属于本发明保护的范围。
本发明如图1所示实施例一提供一种直播视频广告遮蔽方法，所述方法包括以下步骤，如图1所示：
s1、在管理平台界面中新建遮蔽区域并输入直播间房间号，通过服务端截取直播间实时直播画面，生成图片；
可选的，所述生成的图片宽为960个像素，长为540个像素。
s2、创建与步骤s1中图片同等宽高的canvas画布元素，将canvas画布元素进行初始化，并通过javascript脚本语言对canvas画布元素进行绘图操作，得出遮蔽区域位置数据；
可选的，所述canvas元素用于在网页上绘制图形，该元素标签强大之处在于可以直接在html网页上进行图形操作，具有极大的应用价值，该元素使用javascript脚本语言在网页上绘制图像。画布是一个矩形区域，可以控制其每一像素。canvas拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法，可以创建丰富的图形引用。
s3、将步骤s2中得到的遮蔽区域位置数据提交至服务端，服务端接收到数据后自动通过tcp协议与前端播放器通信，最终播放器获取遮蔽区域位置数据，并在目标直播间直播视频画面中添加马赛克矩形图案。
所述tcp协议为传输控制协议，是一种面向连接、可靠、基于字节流的传输通信协议。
可选的，服务端为后端控制程序。
本发明实施例二提供的步骤s2中所述canvas画布元素进行的初始化，分为以下步骤，如图2所示：
s21、将canvas画布元素的宽高按照等比模式进行设置；
可选的，所述canvas画布元素的宽高与步骤s1中生成图片的宽高一致。
s22、将canvas画布元素通过javascript拖拽事件完成矩形绘制，设置矩形边框的宽度及颜色，得出遮蔽区域的坐标数据，并创建确定取消按钮元素，作为获取遮蔽区域的触发节点；
可选的，通过设置矩形大小边框宽度颜色，用于区别canvas画布元素的各项操作，如“新建图形”、“拖拽图形”、“调整图形大小”，避免使用的误差，使用更精准。
s23、将获取的遮蔽的坐标数据与宽高按照等比模式进行设置，最后输出至移动端。
可选的，所述的移动端为手机端、pc端或电视盒子，输出数据按照等比模式进行设备是为了满足不同的移动端的播放界面，实现各移动端遮蔽位置尽可能小的误差，实现各移动端能精准定位遮蔽区域。
本发明实施例三提供所述步骤s22中所述javascript拖拽事件完成矩形绘制，分为以下步骤，如图3所示：
s221、将canvas画布元素添加mousedown事件、mousemove事件、mouseup事件；
所述mousedown事件是在每一个匹配元素的mousedown事件中绑定一个处理函数，当鼠标指针移动到元素上方，并按下鼠标按键时，会发生mousedown事件。
所述mousemove事件是伴随鼠标指针在对象间移动时连续不断地产生。
所述mouseup事件是在释放鼠标按钮时发生的操作。
s222、所述mousedown事件记录鼠标移动坐标起始点并命名为origin，记录要绘制矩形的唯一id；
s223、所述mousemove事件记录鼠标移动过程中不断更新的坐标点，并计算得到矩形宽高wh，所述wh为所述canvas画布元素的宽高，同时维护由origin与wh构成的坐标数据队列；
s224、所述mouseup事件绘制由origin、wh、id数据队列构成的矩形。
可选的，所述步骤s3中canvas画布元素获取遮蔽位置的数据保存于管理平台，当审核人员需要查看上次编辑的遮蔽坐标的时候，canvas画布元素重新将此数据传输出来进行canvas画布元素的初始化，对遮蔽区域实现增删改查的功能。
本发明实施例四提供一种直播视频广告遮蔽装置，所述装置包括直播视频画面截取模块、绘制图形模块、整合模块，如图4所示；
所述直播视频画面截取模块，用于在管理平台界面中新建遮蔽区域并输入直播间房间号，截取直播间实时直播画面，生成图片；
所述绘制图形模块，用于创建与直播视频画面截取模块生成的图片同等宽高的canvas画布元素，并将canvas画布元素进行初始化，通过javascript脚本语言对canvas画布元素进行绘图操作，得出遮蔽区域位置数据；
所述整合模块，用于将绘制图形模块中得到的遮蔽区域位置数据提交至服务端，服务端接收到数据后自动通过tcp协议与前端播放器通信，最终播放器获取遮蔽区域位置数据，并在目标直播间直播视频画面中添加马赛克矩形图案；
可选的，所述绘制图形模块，包括以下模块：
初始设置模块，用于将canvas画布元素的宽高按照等比模式进行设置；
绘制矩形模块，用于将canvas画布元素通过javascript拖拽事件完成矩形绘制，设置矩形边框的宽度及颜色，得出遮蔽区域的坐标数据，并创建确定取消按钮元素，用于获取遮蔽区域的触发节点；
调整输出模块，用于将获取的遮蔽的坐标数据与宽高按照等比模式进行设置，最后输出至服务端。
可选的，所述绘制矩形模块，包括以下模块：
添加事件模块，用于将canvas画布元素添加mousedown事件、mousemove事件、mouseup事件；
记录起始坐标模块，用于将所述mousedown事件记录鼠标移动坐标起始点并命名为origin，记录要绘制矩形的唯一id；
记录移动坐标模块，用于将所述mousemove事件记录鼠标移动过程中不断更新的坐标点，并计算得到矩形宽高wh，所述wh为所述canvas画布元素的宽高，同时构建由origin与wh组成的坐标数据队列；
构建矩形图形模块，用于将所述mouseup事件绘制由origin、wh、id数据队列构成的矩形。
可选的，所述整合模块中canvas画布元素获取遮蔽位置的数据保存于管理平台，当审核人员需要查看上次编辑的遮蔽坐标的时候，canvas画布元素重新将此数据传输出来进行canvas画布元素的初始化，对遮蔽区域实现增删改查的功能。
如图5所示为本发明实施例五提供一种直播视频广告遮蔽装置的服务器结构示意图，所述实施例的服务器包括：处理器50、存储器51以及存储在所述存储器51中并可在所述处理器50上运行的计算机程序52。所述处理器50执行所述计算机程序52时实现上述各方法实施例中的步骤，所述处理器50执行所述计算机程序52时实现上述装置实施例中各模块的功能。
所述一种直播视频广告遮蔽装置的服务器可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备，所述一种直播视频广告遮蔽装置的服务器可包括，但不限于，处理器50、存储器51。图5仅仅是对此服务器的示例，并不构成对此服务器的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件，所述一种直播视频广告遮蔽装置的服务器还可以包括输入输出设备53、显示设备54和移动端55等。
所述处理器50可以是中央处理单元，还可以是其他通用处理器、数字信号处理器、专用集成电路、现成可编程门阵列或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。
所述存储器51可以是所述一种直播视频广告遮蔽装置的服务器的内部存储单元、硬盘或内存。所述存储器51也可以是所述服务器的外部存储设备，或配备的插接式硬盘，智能存储卡，安全数字卡，闪存卡等。
进一步地，所述存储器51还可以既包括所述服务器的内部存储单元也包括外部存储设备。所述存储器51用于存储所述计算机程序以及所述电子设备所需的其他程序和数据。所述存储器51还可以用于暂时地存储已经输出或者将要输出的数据。
所述的输入输出设备53可用于接收输入的数字或字符信息，具体的，输入输出设备53还可以包括但不限于键盘、鼠标、操作杆等中的一种和多种。
所述的显示设备54可用于显示由用户输入的信息或提供给用户信息以及终端的各种菜单，显示设备54可包括显示面板，可选的，可采用液晶显示器。
所述的移动端55可用于直播视频，移动端55可包括移动设备，pc设备，可选的，可采用手机端设备，平板电脑，电视盒子。
所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。
本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各实施例的模块、方法步骤，能够以电子硬件、或者计算机软件和电子硬件的结合来实现。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。
所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明实现上述实施例方法中的全部或部分流程，也可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一计算机可读存储介质中，该计算机程序在被处理器执行时，可实现上述各个方法实施例的步骤。其中，所述计算机程序包括计算机程序代码，所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质可以包括：能够携带所述计算机程序代码的任何实体或装置、记录介质、u盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(rom，read-onlymemory)、随机存取存储器(ram，randomaccessmemory)、电载波信号、电信信号以及软件分发介质等。需要说明的是，所述计算机可读介质包含的内容可以根据司法管辖区内立法和专利实践的要求进行适当的增减，例如在某些司法管辖区，根据立法和专利实践，计算机可读介质不包括电载波信号和电信信号。
以上所述，以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。