CN111741348B - 网页视频播放的控制方法、***、设备和存储介质 - Google Patents

网页视频播放的控制方法、***、设备和存储介质 Download PDF

Info

Publication number
CN111741348B
CN111741348B CN201910447017.4A CN201910447017A CN111741348B CN 111741348 B CN111741348 B CN 111741348B CN 201910447017 A CN201910447017 A CN 201910447017A CN 111741348 B CN111741348 B CN 111741348B
Authority
CN
China
Prior art keywords
target
image
pixel
video
playing
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201910447017.4A
Other languages
English (en)
Other versions
CN111741348A (zh
Inventor
单开元
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Jingdong Century Trading Co Ltd
Beijing Jingdong Shangke Information Technology Co Ltd
Original Assignee
Beijing Jingdong Century Trading Co Ltd
Beijing Jingdong Shangke Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Jingdong Century Trading Co Ltd, Beijing Jingdong Shangke Information Technology Co Ltd filed Critical Beijing Jingdong Century Trading Co Ltd
Priority to CN201910447017.4A priority Critical patent/CN111741348B/zh
Publication of CN111741348A publication Critical patent/CN111741348A/zh
Application granted granted Critical
Publication of CN111741348B publication Critical patent/CN111741348B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4318—Generation of visual interfaces for content selection or interaction; Content or additional data rendering by altering the content in the rendering process, e.g. blanking, blurring or masking an image region
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/20—Servers specifically adapted for the distribution of content, e.g. VOD servers; Operations thereof
    • H04N21/23—Processing of content or additional data; Elementary server operations; Server middleware
    • H04N21/234—Processing of video elementary streams, e.g. splicing of video streams or manipulating encoded video stream scene graphs
    • H04N21/23424—Processing of video elementary streams, e.g. splicing of video streams or manipulating encoded video stream scene graphs involving splicing one content stream with another content stream, e.g. for inserting or substituting an advertisement
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/20—Servers specifically adapted for the distribution of content, e.g. VOD servers; Operations thereof
    • H04N21/25—Management operations performed by the server for facilitating the content distribution or administrating data related to end-users or client devices, e.g. end-user or client device authentication, learning user preferences for recommending movies
    • H04N21/266—Channel or content management, e.g. generation and management of keys and entitlement messages in a conditional access system, merging a VOD unicast channel into a multicast channel
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
    • H04N21/44—Processing of video elementary streams, e.g. splicing a video clip retrieved from local storage with an incoming video stream or rendering scenes according to encoded video stream scene graphs
    • H04N21/44016—Processing of video elementary streams, e.g. splicing a video clip retrieved from local storage with an incoming video stream or rendering scenes according to encoded video stream scene graphs involving splicing one content stream with another content stream, e.g. for substituting a video clip
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47—End-user applications
    • H04N21/478—Supplemental services, e.g. displaying phone caller identification, shopping application
    • H04N21/4782—Web browsing, e.g. WebTV

Landscapes

  • Engineering & Computer Science (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Business, Economics & Management (AREA)
  • Marketing (AREA)
  • Databases & Information Systems (AREA)
  • Information Transfer Between Computers (AREA)
  • Television Signal Processing For Recording (AREA)
  • Two-Way Televisions, Distribution Of Moving Picture Or The Like (AREA)

Abstract

本发明公开了一种网页视频播放的控制方法、***、设备和存储介质，所述控制方法包括：预先在网页中设置一个绘制图像标签，并根据绘制图像标签获取画布；预先确定第一目标图像、第一目标图像对应的目标时间点和目标背景图；获取目标视频对应的播放时间点；判断播放时间点是否属于目标时间点，若是，则获取第一目标图像对应的目标背景区域，并将其设置为透明状态；获取第二目标图像；将第二目标图像和与播放时间点对应的目标背景图进行重叠，获取与播放时间点对应的目标播放图像并控制播放。本发明中采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力。

Description

网页视频播放的控制方法、***、设备和存储介质
技术领域
本发明涉及视频播放技术领域，特别涉及一种网页视频播放的控制方法、***、设备和存储介质。
背景技术
随着网络的日益普及，信息技术的不错发展，多媒体信息交流达到了前所未有的深度和广度，多媒体数据发布的形式愈加丰富。在手机端，通常通过视频的形式向用户传递信息，但往往视频播放的效果比较单一，展示内容主要是以视频内容为主。当需要对同一视频的不同时间点的背景图进行更换，达到同一视频展示不同的播放效果时，现有的方式是通过制作多个视频来满足该需求，显然地该方式一定程度上增加了运营人员的负担，且易造成资源浪费等问题。
因此，现有的网页视频播放存在同一视频无法做到灵活更换背景图，难以满足给不同用户基于同一个视频展示不同的播放需求。
发明内容
本发明要解决的技术问题是现有技术中网页视频播放存在同一视频无法做到灵活更换背景图，难以满足给不同用户基于同一个视频展示不同的播放需求等缺陷，目的在于提供一种网页视频播放的控制方法、***、设备和存储介质。
本发明是通过下述技术方案来解决上述技术问题：
本发明提供一种网页视频播放的控制方法，所述控制方法包括：
预先在网页中设置一个绘制图像标签，其中所述绘制图像标签用于提供播放目标视频的画布；
预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
控制所述目标视频在所述画布中播放，并获取所述目标视频对应的播放时间点；
判断所述播放时间点是否属于所述目标时间点，若是，则将所述播放时间点对应的所述第一目标图像放置至所述画布中，获取所述第一目标图像对应的目标背景区域，并将所述目标背景区域设置为透明状态；
获取所述第一目标图像中除所述目标背景区域之外的第二目标图像；
将所述第二目标图像和与所述播放时间点对应的所述目标背景图进行重叠，获取与所述播放时间点对应的目标播放图像；
控制所述目标视频在所述播放时间点播放所述目标播放图像。
较佳地，所述获取所述第一目标图像对应的目标背景区域的步骤包括：
获取所述第一目标图像中每个像素点的像素值；
根据所述像素值确定所述第一目标图像对应的目标背景区域。
较佳地，所述根据所述像素值确定所述第一目标图像对应的目标背景区域的步骤包括：
获取所述第一目标图像对应的数据长度；
根据所述数据长度获取所述第一目标图像对应的像素点数量；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点；
将所述目标像素点形成的区域作为所述目标背景区域；
所述将所述目标背景区域设置为透明状态的步骤包括：
将所述目标背景区域内的所述目标像素点设置为透明状态。
较佳地，当所述第一目标图像的背景图中包括一种颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置一个第一设定阈值；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与所述第一设定阈值，当所述像素值与所述第一设定阈值相等时，则确定所述像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括一种颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置一个第一设定阈值；
选择所述第一目标图像中任意一个像素点作为第一像素点；
判断所述第一像素点周围设定数量的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点；或，
判断所述第一像素点的设定半径范围内的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括两种以上颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
将所述第一目标图像中每一个像素点的所述像素值与所述第二设定阈值进行比较，当所述像素值与任意一个所述第二设定阈值相等时，则确定所述像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括两种以上颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
选择所述第一目标图像中任意一个像素点作为第二像素点；
判断所述第二像素点周围设定数量的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点；或，
判断所述第二像素点的设定半径范围内的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点。
较佳地，所述预先在网页中设置一个绘制图像标签的步骤之前还包括：
获取与网页视频的播放操作对应的目标页面脚本；
将所述目标页面脚本与视频播放事件监听函数进行绑定；
所述控制所述目标视频在所述画布中播放的步骤包括：
当接收到点击网页视频的播放按钮的触发操作时，更新所述目标页面脚本；
当所述视频播放事件监听函数监听到更新后的所述目标页面脚本时，确定所述目标视频开始播放。
较佳地，所述获取与网页视频的播放操作对应的目标页面脚本的步骤之前包括：
对网页的脚本进行初始化处理；和/或，
所述预先在网页中设置一个绘制图像标签的步骤包括：
在网页的DOM(Document Object Model，文档对象模型)树中预先***一个绘制图像标签。
较佳地，所述预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图的步骤包括：
从后台服务器中获取不同用户的用户画像数据；
根据所述用户画像数据确定用户的观看喜好；
根据所述观看喜好预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述控制所述目标视频在所述画布中播放的步骤之前还包括：
获取目标用户的目标用户画像数据；
获取与所述目标用户画像数据对应的目标观看喜好；
获取所述目标视频中与所述目标观看喜好对应的需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图。
本发明还提供一种网页视频播放的控制***，所述控制***包括第一预设模块、第二预设模块、播放时间点获取模块、判断模块、目标背景区域获取模块、状态设置模块、目标图像获取模块、目标播放图像获取模块和控制模块；
所述第一预设模块用于预先在网页中设置一个绘制图像标签，其中所述绘制图像标签用于提供播放目标视频的画布；
所述第二预设模块用于预先确定目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述播放时间点获取模块用于控制所述目标视频在所述画布中播放，并获取所述目标视频对应的播放时间点；
所述判断模块用于判断所述播放时间点是否属于所述目标时间点，若是，则调用所述目标背景区域获取模块将所述播放时间点对应的所述第一目标图像放置至所述画布中，获取所述第一目标图像对应的目标背景区域；
所述状态设置模块用于将所述目标背景区域设置为透明状态；
所述目标图像获取模块用于获取所述第一目标图像中除所述目标背景区域之外的第二目标图像；
所述目标播放图像获取模块用于将所述第二目标图像和与所述播放时间点对应的所述目标背景图进行重叠，获取与所述播放时间点对应的目标播放图像；
所述控制模块用于控制所述目标视频在所述播放时间点播放所述目标播放图像。
较佳地，所述目标背景区域获取模块包括像素值获取单元和目标背景区域确定单元；
所述像素值获取单元用于获取所述第一目标图像中每个像素点的像素值；
所述目标背景区域确定单元用于根据所述像素值确定所述第一目标图像对应的目标背景区域。
较佳地，所述目标背景区域确定单元包括数据长度获取子单元、像素点数量获取子单元、目标像素点确定子单元和目标背景区域确定子单元；
所述数据长度获取子单元用于获取所述第一目标图像对应的数据长度；
所述像素点数量获取子单元用于根据所述数据长度获取所述第一目标图像对应的像素点数量；
所述目标像素点确定子单元用于根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点；
所述目标背景区域确定子单元用于将所述目标像素点形成的区域作为所述目标背景区域；
所述状态设置模块还用于将所述目标背景区域内的所述目标像素点设置为透明状态。
较佳地，当所述第一目标图像的背景图中包括一种颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置一个第一设定阈值；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与所述第一设定阈值，当所述像素值与所述第一设定阈值相等时，则确定所述像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括一种颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置一个第一设定阈值；
选择所述第一目标图像中任意一个像素点作为第一像素点；
判断所述第一像素点周围设定数量的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点；或，
判断所述第一像素点的设定半径范围内的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括两种以上颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
将所述第一目标图像中每一个像素点的所述像素值与所述第二设定阈值进行比较，当所述像素值与任意一个所述第二设定阈值相等时，则确定所述像素点为目标像素点。
较佳地，当所述第一目标图像的背景图中包括两种以上颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
选择所述第一目标图像中任意一个像素点作为第二像素点；
判断所述第二像素点周围设定数量的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点；或，
判断所述第二像素点的设定半径范围内的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点。
较佳地，所述控制***还包括页面脚本获取模块、绑定模块、更新模块和播放确定模块；
所述页面脚本获取模块用于获取与网页视频的播放操作对应的目标页面脚本；
所述绑定模块用于将所述目标页面脚本与视频播放事件监听函数进行绑定；
所述更新模块用于当接收到点击网页视频的播放按钮的触发操作时，更新所述目标页面脚本；
所述播放确定模块用于当所述视频播放事件监听函数监听到更新后的所述目标页面脚本时，确定所述目标视频开始播放。
较佳地，所述控制***还包括初始化模块；
所述初始化模块用于对网页的脚本进行初始化处理；和/或，
所述第一预设模块用于网页的DOM树中预先***一个绘制图像标签。
较佳地，所述第二预设模块包括画像数据获取单元、观看喜好确定单元和预设单元；
所述画像数据获取单元用于从后台服务器中获取不同用户的用户画像数据；
所述观看喜好确定单元用于根据所述用户画像数据确定用户的观看喜好；
所述预设单元用于根据所述观看喜好预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述控制***还包括画像数据获取模块、目标喜好获取模块和目标数据获取模块；
所述画像数据获取模块用于获取目标用户的目标用户画像数据；
所述目标喜好获取模块用于获取与所述目标用户画像数据对应的目标观看喜好；
所述目标数据获取模块用于获取所述目标视频中与所述目标观看喜好对应的需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图。
本发明还提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行计算机程序时实现上述的网页视频播放的控制方法。
本发明还提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述的网页视频播放的控制方法的步骤。
本发明的积极进步效果在于：
本发明中，通过在后台服务器中添加目标视频中需要替换背景图的不同时间点，以及每个时间点对应的用于替换原始背景图的目标背景图；在对目标视频进行播放时，根据时间点对视频中的背景图进行替换，从而实现采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力，提升了用户体验；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
附图说明
图1为本发明实施例1的网页视频播放的控制方法的流程图。
图2为本发明实施例2的网页视频播放的控制方法的第一流程图。
图3为本发明实施例2的网页视频播放的控制方法的第二流程图。
图4为本发明实施例3的网页视频播放的控制方法中第一目标图像的示意图。
图5为本发明实施例5的网页视频播放的控制方法的流程图。
图6为本发明实施例6的网页视频播放的控制***的模块示意图。
图7为本发明实施例7的网页视频播放的控制***的模块示意图。
图8为本发明实施例7的网页视频播放的控制***中目标背景区域获取模块的模块示意图。
图9为本发明实施例10的网页视频播放的控制***的模块示意图。
图10为本发明实施例11的实现网页视频播放的控制方法的电子设备的结构示意图。
具体实施方式
下面通过实施例的方式进一步说明本发明，但并不因此将本发明限制在所述的实施例范围之中。
实施例1
如图1所示，本实施例的网页视频播放的控制方法包括：
S101、预先在网页中设置一个绘制图像标签；
其中，绘制图像标签为Canvas(画布)标签，Canvas标签用于在网页中生成图像，提供播放目标视频的画布。
具体地，通过在网页的DOM树中预先***一个Canvas标签，采用document.getElementById(一种获取Canvas标签的程序语言)方法获取Canvas标签，并采用getContext(一种初始化程序语言)方法对Canvas标签进行初始化来得到对应的画布。
S102、预先确定目标视频中需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图；
具体地，可以根据实际需求，在互联网平台的后台服务器中预先确定需要替换背景图的视频，每个视频中需要替换背景图的不同时间点以及每个时间点对应的用于替换原始背景图的目标背景图(例如，将视频中某几帧图像中原始的纯色背景图分别替换为婚纱照图像等)。
其中，目标背景图以及替换背景图的时间点可以根据实际需求灵活配置。
S103、控制目标视频在画布中播放；
S104、获取目标视频对应的播放时间点；
其中，在开始播放目标视频后，即开始计时，此时记录的时间点即为目标视频对应的播放时间点。
S105、判断播放时间点是否属于目标时间点，若是，则执行步骤S106；
S106、将播放时间点对应的第一目标图像放置至画布中，获取第一目标图像对应的目标背景区域；
其中，采用drawImage(一种Canvas标签中用于画图的程序语言)方法将当前帧(播放时间点)对应第一目标图像放置至画布中。
S107、将目标背景区域设置为透明状态；
S108、获取第一目标图像中除目标背景区域之外的第二目标图像；
S109、将第二目标图像和与播放时间点对应的目标背景图进行重叠，获取与播放时间点对应的目标播放图像；
此时，目标播放图像中既保留显示非背景区域的第二目标图像，也将目标背景图通过透明状态的目标背景区域进行显示，完成了背景图的替换操作。
具体地，采用JavaScript(一张脚本语言)中的方法设置该Canvas标签的CSS(Cascading Style Sheets，层叠样式表)属性background-image(背景图)为需要替换的目标背景图的链接，实现将第二目标图像和与播放时间点对应的目标背景图进行重叠，得到最终的目标播放图像。
S1010、控制目标视频在播放时间点播放目标播放图像。
本实施例的网页视频播放的控制方法可跨平台支持，如支持但不限于Windows、Mac、Linux、Android、IOS(Windows、Mac、Linux、Android、IOS均为操作***)等。
本实施例中，通过在后台服务器中添加目标视频中需要替换背景图的不同时间点，以及每个时间点对应的用于替换原始背景图的目标背景图；在对目标视频进行播放时，根据时间点对视频中的背景图进行替换，从而实现采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。另外，可以将同一视频对应的多种播放内容缓存至本地来提高视频加载展示的速度。
实施例2
如图2所示，本实施例的网页视频播放的控制方法是对实施例1的进一步改进，具体地：
步骤S101之前还包括：
S10101、对网页的脚本进行初始化处理；
S10102、获取与网页视频的播放操作对应的目标页面脚本；
其中，目标页面脚本为用于表征网页视频播放、停止等操作的程序代码。
S10103、将目标页面脚本与视频播放事件监听函数进行绑定；
具体地，当接收到点击网页视频的播放按钮的触发操作时，更新目标页面脚本；
当视频播放事件监听函数监听到更新后的目标页面脚本时，确定目标视频开始播放。
如图3所示，步骤S106包括：
S1061、获取第一目标图像中每个像素点的像素值；
S1062、获取第一目标图像对应的数据长度；
S1063、根据数据长度获取第一目标图像对应的像素点数量；
S1064、根据像素点数量遍历比较第一目标图像中每一个像素点的像素值与设定阈值，若像素值与设定阈值相匹配，则确定像素点为目标像素点；
S1065、将目标像素点形成的区域作为目标背景区域。
具体地，采用RGBA(分别表示该像素点的红、绿、蓝、透明度)四个值代表一个像素点，第一目标图像对应的数据长度为L，则该第一目标图像对应的像素点数量N＝L/4。遍历比较第一目标图像中每一个像素点时，获取每个像素点的RGB值，并将该RGB值与设定阈值比较。
步骤S107包括：
S1071、将目标背景区域内的目标像素点设置为透明状态。
本实施例中，通过在后台服务器中添加目标视频中需要替换背景图的不同时间点，以及每个时间点对应的用于替换原始背景图的目标背景图；通过事件监听函数监听目标视频播放，并根据时间点对视频中的背景图进行替换，从而实现采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例3
本实施例的网页视频播放的控制方法是对实施例2的进一步改进，具体地：
当第一目标图像的背景图中包括一种颜色时，步骤S1064包括：
根据第一目标图像的背景图设置一个第一设定阈值；
根据像素点数量遍历比较第一目标图像中每一个像素点的像素值与第一设定阈值，当像素值与第一设定阈值相等时，则确定像素点为目标像素点。或，步骤S1064包括：
根据第一目标图像的背景图设置一个第一设定阈值；
选择第一目标图像中任意一个像素点作为第一像素点；
判断第一像素点周围设定数量的像素点对应的像素值是否均等于第一设定阈值，若是，则确定第一像素点为目标像素点；或，
判断第一像素点的设定半径范围内的像素点对应的像素值是否均等于第一设定阈值，若是，则确定第一像素点为目标像素点。
下面结合实例具体说明：
如图4所示，为目标视频中某一帧图像，其中a区域表示背景区域，b区域表示非背景区域。
具体地，假设a区域为纯黑色。可以事先获取需要替换的背景图的RGB值，第一设定阈值即为该RGB值。遍历比较该图像中的每一个像素点的像素值与第一设定阈值，只要该图像的像素点的RGB值与设定的RGB值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。
为了防止b区域中的存在与a区域同样颜色的像素点，通过判断第一目标图像中任意一个像素点周围的设定数量的像素点对应的像素值是否均等于设定的RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。或者，判断第一目标图像中任意一个像素点的设定半径范围内的像素点对应的像素值是否均等于设定的RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态，从而保证仅将背景区域内的像素点设置为透明状态，且不影响非背景区域的图像显示。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同的实际需求，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例4
本实施例的网页视频播放的控制方法是对实施例2的进一步改进，具体地：
当第一目标图像的背景图中包括两种以上颜色时，步骤S1064包括：
根据第一目标图像的背景图设置多个不同的第二设定阈值，其中第二设定阈值的数量与第一目标图像的背景图中包括的颜色种类数量相等；
将第一目标图像中每一个像素点的像素值与第二设定阈值进行比较，当像素值与任意一个第二设定阈值相等时，则确定像素点为目标像素点。或，步骤S1064包括：
根据第一目标图像的背景图设置多个不同的第二设定阈值，其中第二设定阈值的数量与第一目标图像的背景图中包括的颜色种类数量相等；
选择第一目标图像中任意一个像素点作为第二像素点；
判断第二像素点周围设定数量的像素点对应的像素值是否等于第二设定阈值，若是，则确定第二像素点为目标像素点；或，
判断第二像素点的设定半径范围内的像素点对应的像素值是否等于第二设定阈值，若是，则确定第二像素点为目标像素点。
下面结合实例具体说明：
如图4所示，为目标视频中某一帧图像，其中a区域表示背景区域，b区域表示非背景区域。
假设a区域包括三种RGB值的像素点(即包括三种颜色)，此时，根据该三种RGB值设定三个第二设定阈值，三个第二设定阈值分别与三种RGB值相等。
遍历比较该图像中的每一个像素点的像素值与第二设定阈值，若某一像素点的像素值与第一个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；若该像素点的像素值与第一个第二设定阈值不相等，否则继续比较该像素点的像素值与第二个第二设定阈值是否相等，若该像素点的像素值与第二个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；否则，继续比较该像素点的像素值与第三个第二设定阈值是否相等，若该像素点的像素值与第三个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；否则，确定该像素点不是目标像素点。
为了防止b区域中的存在与a区域同样颜色的像素点，判断第一目标图像中任意一个像素点周围的设定数量的像素点对应的像素值是否等于三个第二设定阈值中的任意一个RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。或者，判断第一目标图像中任意一个像素点的设定半径范围内的像素点对应的像素值是否均等于三个第二设定阈值中的任意一个RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态，从而保证仅将背景区域内的像素点设置为透明状态，且不影响非背景区域的图像显示。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同的实际需求，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例5
如图5所示，本实施例的网页视频播放的控制方法是对实施例1的进一步改进，具体地：
步骤S102包括：
S1021、从后台服务器中获取不同用户的用户画像数据；
S1022、根据用户画像数据确定用户的观看喜好；
S1023、根据观看喜好预先确定目标视频中需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图；
步骤S103之前还包括：
S10301、获取目标用户的目标用户画像数据；
S10302、获取与目标用户画像数据对应的目标观看喜好；
S10303、获取目标视频中与目标观看喜好对应的需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图。
例如，对于希望视频背景展示婚纱照的情况，采用不同的婚纱照图像替换当前的目标视频中不同时间点的背景图，从而达到针对不同类型的用户展示不同的视频播放效果的目的，提升用户观看体验。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同用户的观看喜好，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力，提高了用户体验；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例6
如图6所示，本实施例的网页视频播放的控制***包括第一预设模块1、第二预设模块2、播放时间点获取模块3、判断模块4、目标背景区域获取模块5、状态设置模块6、目标图像获取模块7、目标播放图像获取模块8和控制模块9。
第一预设模块1用于预先在网页中设置一个绘制图像标签，其中Canvas标签用于提供播放目标视频的画布；
其中，绘制图像标签为Canvas标签，Canvas标签用于在网页中生成图像，提供播放目标视频的画布。
具体地，通过在网页的DOM树中预先***一个Canvas标签，采用document.getElementById方法获取Canvas标签，并采用getContext方法对Canvas标签进行初始化来得到对应的画布。
第二预设模块2用于预先确定目标视频中需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图；
具体地，可以根据实际需求，在互联网平台的后台服务器中预先确定需要替换背景图的视频，每个视频中需要替换背景图的不同时间点以及每个时间点对应的用于替换原始背景图的目标背景图(例如，将视频中某几帧图像中原始的纯色背景图分别替换为婚纱照图像等)。
其中，目标背景图以及替换背景图的时间点可以根据实际需求灵活配置。
播放时间点获取模块3用于控制目标视频在画布中播放，并获取目标视频对应的播放时间点；
其中，在开始播放目标视频后，即开始计时，此时记录的时间点即为目标视频对应的播放时间点。
判断模块4用于判断播放时间点是否属于目标时间点，若是，则调用目标背景区域获取模块5将播放时间点对应的第一目标图像放置至画布中，获取第一目标图像对应的目标背景区域；
其中，采用drawImage方法将当前帧对应第一目标图像放置至画布中。
状态设置模块6用于将目标背景区域设置为透明状态；
目标图像获取模块7用于获取第一目标图像中除目标背景区域之外的第二目标图像；
目标播放图像获取模块8用于将第二目标图像和与播放时间点对应的目标背景图进行重叠，获取与播放时间点对应的目标播放图像；
此时，目标播放图像中既保留显示非背景区域的第二目标图像，也将目标背景图通过透明状态的目标背景区域进行显示，完成了背景图的替换操作。
具体地，采用JavaScript中的方法设置该Canvas标签的CSS属性background-image为需要替换的目标背景图的链接，实现将第二目标图像和与播放时间点对应的目标背景图进行重叠，得到最终的目标播放图像。控制模块9用于控制目标视频在播放时间点播放目标播放图像。
本实施例的网页视频播放的控制方法可跨平台支持，如支持但不限于Windows、Mac、Linux、Android、IOS等。
本实施例中，通过在后台服务器中添加目标视频中需要替换背景图的不同时间点，以及每个时间点对应的用于替换原始背景图的目标背景图；在对目标视频进行播放时，根据时间点对视频中的背景图进行替换，从而实现采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例7
如图7所示，本实施例的网页视频播放的控制***是对实施例6的进一步改进，具体地：
控制***还包括初始化模块10、页面脚本获取模块11、绑定模块12、更新模块13和播放确定模块14。
初始化模块10用于对网页的脚本进行初始化处理。
页面脚本获取模块11用于获取与网页视频的播放操作对应的目标页面脚本；
其中，目标页面脚本为用于表征网页视频播放、停止等操作的程序代码。
绑定模块12用于将目标页面脚本与视频播放事件监听函数进行绑定；
更新模块13用于当接收到点击网页视频的播放按钮的触发操作时，更新目标页面脚本；
播放确定模块14用于当视频播放事件监听函数监听到更新后的目标页面脚本时，确定目标视频开始播放。
如图8所示，目标背景区域获取模块5包括像素值获取单元15和目标背景区域确定单元16。
像素值获取单元15用于获取第一目标图像中每个像素点的像素值；
目标背景区域确定单元16用于根据像素值确定第一目标图像对应的目标背景区域。
具体地，目标背景区域确定单元16包括数据长度获取子单元17、像素点数量获取子单元18、目标像素点确定子单元19和目标背景区域确定子单元20。
数据长度获取子单元17用于获取第一目标图像对应的数据长度；
像素点数量获取子单元18用于根据数据长度获取第一目标图像对应的像素点数量；
目标像素点确定子单元19用于根据像素点数量遍历比较第一目标图像中每一个像素点的像素值与设定阈值，若像素值与设定阈值相匹配，则确定像素点为目标像素点；
目标背景区域确定子单20元用于将目标像素点形成的区域作为目标背景区域；
具体地，采用RGBA(分别表示该像素点的红、绿、蓝、透明度)四个值代表一个像素点，第一目标图像对应的数据长度为L，则该第一目标图像对应的像素点数量N＝L/4。遍历比较第一目标图像中每一个像素点时，获取每个像素点的RGB值，并将该RGB值与设定阈值比较。
状态设置模块6还用于将目标背景区域内的目标像素点设置为透明状态。
本实施例中，通过在后台服务器中添加目标视频中需要替换背景图的不同时间点，以及每个时间点对应的用于替换原始背景图的目标背景图；通过事件监听函数监听目标视频播放，并根据时间点对视频中的背景图进行替换，从而实现采用自定义的背景图对网页视频中的不同时间点的背景图进行灵活替换，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例8
本实施例的网页视频播放的控制***是对实施例7的进一步改进，具体地：
当第一目标图像的背景图中包括一种颜色时，目标背景区域确定单元16包括数据长度获取子单元、像素点数量获取子单元、第一比较子单元、目标像素点确定子单元和目标背景区域确定子单元；
数据长度获取子单元用于获取第一目标图像对应的数据长度；
像素点数量获取子单元用于根据数据长度获取第一目标图像对应的像素点数量；
第一比较子单元用于根据像素点数量遍历比较第一目标图像中每一个像素点的像素值与第一设定阈值，当像素值与第一设定阈值相等时，则调用目标像素点确定子单元确定像素点为目标像素点；
目标背景区域确定子单元用于将目标像素点形成的区域作为目标背景区域。或，
当第一目标图像的背景图中包括一种颜色时，目标背景区域确定单元16包括选择子单元、第一判断子单元、目标像素点确定子单元和目标背景区域确定子单元；
选择子单元用于选择第一目标图像中任意一个像素点作为第一像素点；
第一判断子单元用于判断第一像素点周围设定数量的像素点对应的像素值是否均等于第一设定阈值，若是，则确定第一像素点为目标像素点；或，
第一判断子单元用于判断第一像素点的设定半径范围内的像素点对应的像素值是否均等于第一设定阈值，若是，则调用目标像素点确定子单元确定第一像素点为目标像素点；
目标背景区域确定子单元用于将目标像素点形成的区域作为目标背景区域。
下面结合实例具体说明：
如图4所示，为目标视频中某一帧图像，其中a区域表示背景区域，b区域表示非背景区域。
具体地，假设a区域为纯黑色。可以事先获取需要替换的背景图的RGB值，第一设定阈值即为该RGB值。遍历比较该图像中的每一个像素点的像素值与第一设定阈值，只要该图像的像素点的RGB值与设定的RGB值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。
为了防止b区域中的存在与a区域同样颜色的像素点，通过判断第一目标图像中任意一个像素点周围的设定数量的像素点对应的像素值是否均等于设定的RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。或者，判断第一目标图像中任意一个像素点的设定半径范围内的像素点对应的像素值是否均等于设定的RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态，从而保证仅将背景区域内的像素点设置为透明状态，且不影响非背景区域的图像显示。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同的实际需求，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例9
本实施例的网页视频播放的控制***是对实施例7的进一步改进，具体地：
当第一目标图像的背景图中包括两种以上颜色时，目标背景区域确定单元16包括阈值设置子单元、第二比较子单元、目标像素点确定子单元和目标背景区域确定子单元；
阈值设置子单元用于设置多个不同的第二设定阈值；
第二比较子单元用于将第一目标图像中每一个像素点的像素值分别与多个第二设定阈值进行比较，当像素点与任意一个第二设定阈值相等时，调用目标像素点确定子单元确定像素点为目标像素点；
目标背景区域确定子单元用于将目标像素点形成的区域作为目标背景区域。或，当第一目标图像的背景图中包括两种以上颜色时，目标背景区域确定单元16包括阈值设置子单元、第二判断子单元、目标像素点确定子单元和目标背景区域确定子单元；
阈值设置子单元用于设置多个不同的第二设定阈值；
选择第一目标图像中任意一个像素点作为第二像素点；
第二判断子单元用于判断第二像素点周围设定数量的像素点对应的像素值是否等于第二设定阈值，若是，则确定第二像素点为目标像素点；或，
第二判断子单元用于判断第二像素点的设定半径范围内的像素点对应的像素值是否等于第二设定阈值，若是，则调用目标像素点确定子单元确定第二像素点为目标像素点；
目标背景区域确定子单元用于将目标像素点形成的区域作为目标背景区域。
下面结合实例具体说明：
如图4所示，为目标视频中某一帧图像，其中a区域表示背景区域，b区域表示非背景区域。
假设a区域包括三种RGB值的像素点(即包括三种颜色)，此时，根据该三种RGB值设定三个第二设定阈值，三个第二设定阈值分别与三种RGB值相等。
遍历比较该图像中的每一个像素点的像素值与第二设定阈值，若某一像素点的像素值与第一个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；若该像素点的像素值与第一个第二设定阈值不相等，否则继续比较该像素点的像素值与第二个第二设定阈值是否相等，若该像素点的像素值与第二个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；否则，继续比较该像素点的像素值与第三个第二设定阈值是否相等，若该像素点的像素值与第三个第二设定阈值相等，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态；否则，确定该像素点不是目标像素点。
为了防止b区域中的存在与a区域同样颜色的像素点，判断第一目标图像中任意一个像素点周围的设定数量的像素点对应的像素值是否等于三个第二设定阈值中的任意一个RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态。或者，判断第一目标图像中任意一个像素点的设定半径范围内的像素点对应的像素值是否均等于三个第二设定阈值中的任意一个RGB值，若是，则确定该像素点为目标像素点，并将该像素点的RGB值置为0，即透明状态，从而保证仅将背景区域内的像素点设置为透明状态，且不影响非背景区域的图像显示。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同的实际需求，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例10
如图9所示，本实施例的网页视频播放的控制***是对实施例6的进一步改进，具体地：
第二预设模块2包括画像数据获取单元21、观看喜好确定单元22和预设单元23；
画像数据获取单元21用于从后台服务器中获取不同用户的用户画像数据；
观看喜好确定单元22用于根据用户画像数据确定用户的观看喜好；
预设单元23用于根据观看喜好预先确定目标视频中需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图；
控制***还包括画像数据获取模块24、目标喜好获取模块25和目标数据获取模块26；
画像数据获取模块24用于获取目标用户的目标用户画像数据；
目标喜好获取模块25用于获取与目标用户画像数据对应的目标观看喜好；
目标数据获取模块26用于获取目标视频中与目标观看喜好对应的需要替换背景图的第一目标图像、第一目标图像对应的目标时间点和目标背景图。
例如，对于希望视频背景展示婚纱照的情况，采用不同的婚纱照图像替换当前的目标视频中不同时间点的背景图，从而达到针对不同类型的用户展示不同的视频播放效果的目的，提升用户观看体验。
本实施例中，通过在网页的DOM树中***一个Canvas标签，得到用于播放视频的画布；然后根据不同用户的观看喜好，设置目标视频中需要替换背景图的图像、替换的时间节点以及目标背景图；当该目标视频播放至需要更换背景图的时间节点时，获取该时间节点的对应帧图像中的目标背景区域，并将其设置为透明状态；最后将对应帧图像中剩余的图像与目标背景图进行重叠，获取播放时间点对应的目标播放图像，并控制在播放时间点播放目标播放图像，从而实现网页视频自定义播放，极大地增强了视频播放内容的多样性，提高了网页展示视频的能力，提高了用户体验；同时，降低了人力运营成本，提高了工作效率且减小了服务器存储视频的压力。
实施例11
图10为本发明实施例11提供的一种电子设备的结构示意图。电子设备包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，处理器执行程序时实现实施例1至5中任意一实施例中的网页视频播放的控制方法。图10显示的电子设备30仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。
如图10所示，电子设备30可以以通用计算设备的形式表现，例如其可以为服务器设备。电子设备30的组件可以包括但不限于：上述至少一个处理器31、上述至少一个存储器32、连接不同***组件(包括存储器32和处理器31)的总线33。
总线33包括数据总线、地址总线和控制总线。
存储器32可以包括易失性存储器，例如随机存取存储器(RAM)321和/或高速缓存存储器322，还可以进一步包括只读存储器(ROM)323。
存储器32还可以包括具有一组(至少一个)程序模块324的程序/实用工具325，这样的程序模块324包括但不限于：操作***、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。
处理器31通过运行存储在存储器32中的计算机程序，从而执行各种功能应用以及数据处理，例如本发明实施例1至5中任意一实施例中的网页视频播放的控制方法。
电子设备30也可以与一个或多个外部设备34(例如键盘、指向设备等)通信。这种通信可以通过输入/输出(I/O)接口35进行。并且，模型生成的设备30还可以通过网络适配器36与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。如图10所示，网络适配器36通过总线33与模型生成的设备30的其它模块通信。应当明白，尽管图中未示出，可以结合模型生成的设备30使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理器、外部磁盘驱动阵列、RAID(磁盘阵列)***、磁带驱动器以及数据备份存储***等。
应当注意，尽管在上文详细描述中提及了电子设备的若干单元/模块或子单元/模块，但是这种划分仅仅是示例性的并非强制性的。实际上，根据本发明的实施方式，上文描述的两个或更多单元/模块的特征和功能可以在一个单元/模块中具体化。反之，上文描述的一个单元/模块的特征和功能可以进一步划分为由多个单元/模块来具体化。
实施例12
本实施例提供了一种计算机可读存储介质，其上存储有计算机程序，程序被处理器执行时实现实施例1至5中任意一实施例中的网页视频播放的控制方法中的步骤。
其中，可读存储介质可以采用的更具体可以包括但不限于：便携式盘、硬盘、随机存取存储器、只读存储器、可擦拭可编程只读存储器、光存储器件、磁存储器件或上述的任意合适的组合。
在可能的实施方式中，本发明还可以实现为一种程序产品的形式，其包括程序代码，当程序产品在终端设备上运行时，程序代码用于使终端设备执行实现实施例1至5中任意一实施例中的网页视频播放的控制方法中的步骤。
其中，可以以一种或多种程序设计语言的任意组合来编写用于执行本发明的程序代码，程序代码可以完全地在用户设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户设备上部分在远程设备上执行或完全在远程设备上执行。
虽然以上描述了本发明的具体实施方式，但是本领域的技术人员应当理解，这些仅是举例说明，本发明的保护范围是由所附权利要求书限定的。本领域的技术人员在不背离本发明的原理和实质的前提下，可以对这些实施方式作出多种变更或修改，但这些变更和修改均落入本发明的保护范围。

Claims (22)

1.一种网页视频播放的控制方法，其特征在于，所述控制方法包括：
预先在网页中设置一个绘制图像标签，其中所述绘制图像标签用于提供播放目标视频的画布；
预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
控制所述目标视频在所述画布中播放，并获取所述目标视频对应的播放时间点；
判断所述播放时间点是否属于所述目标时间点，若是，则将所述播放时间点对应的所述第一目标图像放置至所述画布中，获取所述第一目标图像对应的目标背景区域，并将所述目标背景区域设置为透明状态；
获取所述第一目标图像中除所述目标背景区域之外的第二目标图像；
将所述第二目标图像和与所述播放时间点对应的所述目标背景图进行重叠，获取与所述播放时间点对应的目标播放图像；
控制所述目标视频在所述播放时间点播放所述目标播放图像。
2.如权利要求1所述的网页视频播放的控制方法，其特征在于，所述获取所述第一目标图像对应的目标背景区域的步骤包括：
获取所述第一目标图像中每个像素点的像素值；
根据所述像素值确定所述第一目标图像对应的目标背景区域。
3.如权利要求2所述的网页视频播放的控制方法，其特征在于，所述根据所述像素值确定所述第一目标图像对应的目标背景区域的步骤包括：
获取所述第一目标图像对应的数据长度；
根据所述数据长度获取所述第一目标图像对应的像素点数量；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点；
将所述目标像素点形成的区域作为所述目标背景区域；
所述将所述目标背景区域设置为透明状态的步骤包括：
将所述目标背景区域内的所述目标像素点设置为透明状态。
4.如权利要求3所述的网页视频播放的控制方法，其特征在于，当所述第一目标图像的背景图中包括一种颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置一个第一设定阈值；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与所述第一设定阈值，当所述像素值与所述第一设定阈值相等时，则确定所述像素点为目标像素点。
5.如权利要求3所述的网页视频播放的控制方法，其特征在于，当所述第一目标图像的背景图中包括一种颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置一个第一设定阈值；
选择所述第一目标图像中任意一个像素点作为第一像素点；
判断所述第一像素点周围设定数量的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点；或，
判断所述第一像素点的设定半径范围内的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点。
6.如权利要求3所述的网页视频播放的控制方法，其特征在于，当所述第一目标图像的背景图中包括两种以上颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
将所述第一目标图像中每一个像素点的所述像素值与所述第二设定阈值进行比较，当所述像素值与任意一个所述第二设定阈值相等时，则确定所述像素点为目标像素点。
7.如权利要求3所述的网页视频播放的控制方法，其特征在于，当所述第一目标图像的背景图中包括两种以上颜色时，所述根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点的步骤包括：
根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
选择所述第一目标图像中任意一个像素点作为第二像素点；
判断所述第二像素点周围设定数量的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点；或，
判断所述第二像素点的设定半径范围内的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点。
8.如权利要求1所述的网页视频播放的控制方法，其特征在于，所述预先在网页中设置一个绘制图像标签的步骤之前还包括：
获取与网页视频的播放操作对应的目标页面脚本；
将所述目标页面脚本与视频播放事件监听函数进行绑定；
所述控制所述目标视频在所述画布中播放的步骤包括：
当接收到点击网页视频的播放按钮的触发操作时，更新所述目标页面脚本；
当所述视频播放事件监听函数监听到更新后的所述目标页面脚本时，确定所述目标视频开始播放。
9.如权利要求8所述的网页视频播放的控制方法，其特征在于，所述获取与网页视频的播放操作对应的目标页面脚本的步骤之前包括：
对网页的脚本进行初始化处理；和/或，
所述预先在网页中设置一个绘制图像标签的步骤包括：
在网页的DOM树中预先***一个绘制图像标签。
10.如权利要求1所述的网页视频播放的控制方法，其特征在于，所述预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图的步骤包括：
从后台服务器中获取不同用户的用户画像数据；
根据所述用户画像数据确定用户的观看喜好；
根据所述观看喜好预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述控制所述目标视频在所述画布中播放的步骤之前还包括：
获取目标用户的目标用户画像数据；
获取与所述目标用户画像数据对应的目标观看喜好；
获取所述目标视频中与所述目标观看喜好对应的需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图。
11.一种网页视频播放的控制***，其特征在于，所述控制***包括第一预设模块、第二预设模块、播放时间点获取模块、判断模块、目标背景区域获取模块、状态设置模块、目标图像获取模块、目标播放图像获取模块和控制模块；
所述第一预设模块用于预先在网页中设置一个绘制图像标签，其中所述绘制图像标签用于提供播放目标视频的画布；
所述第二预设模块用于预先确定目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述播放时间点获取模块用于控制所述目标视频在所述画布中播放，并获取所述目标视频对应的播放时间点；
所述判断模块用于判断所述播放时间点是否属于所述目标时间点，若是，则调用所述目标背景区域获取模块将所述播放时间点对应的所述第一目标图像放置至所述画布中，获取所述第一目标图像对应的目标背景区域；
所述状态设置模块用于将所述目标背景区域设置为透明状态；
所述目标图像获取模块用于获取所述第一目标图像中除所述目标背景区域之外的第二目标图像；
所述目标播放图像获取模块用于将所述第二目标图像和与所述播放时间点对应的所述目标背景图进行重叠，获取与所述播放时间点对应的目标播放图像；
所述控制模块用于控制所述目标视频在所述播放时间点播放所述目标播放图像。
12.如权利要求11所述的网页视频播放的控制***，其特征在于，所述目标背景区域获取模块包括像素值获取单元和目标背景区域确定单元；
所述像素值获取单元用于获取所述第一目标图像中每个像素点的像素值；
所述目标背景区域确定单元用于根据所述像素值确定所述第一目标图像对应的目标背景区域。
13.如权利要求12所述的网页视频播放的控制***，其特征在于，所述目标背景区域确定单元包括数据长度获取子单元、像素点数量获取子单元、目标像素点确定子单元和目标背景区域确定子单元；
所述数据长度获取子单元用于获取所述第一目标图像对应的数据长度；
所述像素点数量获取子单元用于根据所述数据长度获取所述第一目标图像对应的像素点数量；
所述目标像素点确定子单元用于根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与设定阈值，若所述像素值与所述设定阈值相匹配，则确定所述像素点为目标像素点；
所述目标背景区域确定子单元用于将所述目标像素点形成的区域作为所述目标背景区域；
所述状态设置模块还用于将所述目标背景区域内的所述目标像素点设置为透明状态。
14.如权利要求13所述的网页视频播放的控制***，其特征在于，当所述第一目标图像的背景图中包括一种颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置一个第一设定阈值；
根据所述像素点数量遍历比较所述第一目标图像中每一个像素点的所述像素值与所述第一设定阈值，当所述像素值与所述第一设定阈值相等时，则确定所述像素点为目标像素点。
15.如权利要求13所述的网页视频播放的控制***，其特征在于，当所述第一目标图像的背景图中包括一种颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置一个第一设定阈值；
选择所述第一目标图像中任意一个像素点作为第一像素点；
判断所述第一像素点周围设定数量的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点；或，
判断所述第一像素点的设定半径范围内的像素点对应的所述像素值是否均等于所述第一设定阈值，若是，则确定所述第一像素点为目标像素点。
16.如权利要求13所述的网页视频播放的控制***，其特征在于，当所述第一目标图像的背景图中包括两种以上颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
将所述第一目标图像中每一个像素点的所述像素值与所述第二设定阈值进行比较，当所述像素值与任意一个所述第二设定阈值相等时，则确定所述像素点为目标像素点。
17.如权利要求13所述的网页视频播放的控制***，其特征在于，当所述第一目标图像的背景图中包括两种以上颜色时，所述目标像素点确定子单元用于根据所述第一目标图像的背景图设置多个不同的第二设定阈值，其中所述第二设定阈值的数量与所述第一目标图像的背景图中包括的颜色种类数量相等；
选择所述第一目标图像中任意一个像素点作为第二像素点；
判断所述第二像素点周围设定数量的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点；或，
判断所述第二像素点的设定半径范围内的像素点对应的所述像素值是否等于所述第二设定阈值，若是，则确定所述第二像素点为目标像素点。
18.如权利要求11所述的网页视频播放的控制***，其特征在于，所述控制***还包括页面脚本获取模块、绑定模块、更新模块和播放确定模块；
所述页面脚本获取模块用于获取与网页视频的播放操作对应的目标页面脚本；
所述绑定模块用于将所述目标页面脚本与视频播放事件监听函数进行绑定；
所述更新模块用于当接收到点击网页视频的播放按钮的触发操作时，更新所述目标页面脚本；
所述播放确定模块用于当所述视频播放事件监听函数监听到更新后的所述目标页面脚本时，确定所述目标视频开始播放。
19.如权利要求18所述的网页视频播放的控制***，其特征在于，所述控制***还包括初始化模块；
所述初始化模块用于对网页的脚本进行初始化处理；和/或，
所述第一预设模块用于网页的DOM树中预先***一个绘制图像标签。
20.如权利要求11所述的网页视频播放的控制***，其特征在于，所述第二预设模块包括画像数据获取单元、观看喜好确定单元和预设单元；
所述画像数据获取单元用于从后台服务器中获取不同用户的用户画像数据；
所述观看喜好确定单元用于根据所述用户画像数据确定用户的观看喜好；
所述预设单元用于根据所述观看喜好预先确定所述目标视频中需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图；
所述控制***还包括画像数据获取模块、目标喜好获取模块和目标数据获取模块；
所述画像数据获取模块用于获取目标用户的目标用户画像数据；
所述目标喜好获取模块用于获取与所述目标用户画像数据对应的目标观看喜好；
所述目标数据获取模块用于获取所述目标视频中与所述目标观看喜好对应的需要替换背景图的第一目标图像、所述第一目标图像对应的目标时间点和目标背景图。
21.一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行计算机程序时实现权利要求1-10中任一项所述的网页视频播放的控制方法。
22.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-10中任一项所述的网页视频播放的控制方法的步骤。
CN201910447017.4A 2019-05-27 2019-05-27 网页视频播放的控制方法、***、设备和存储介质 Active CN111741348B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910447017.4A CN111741348B (zh) 2019-05-27 2019-05-27 网页视频播放的控制方法、***、设备和存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910447017.4A CN111741348B (zh) 2019-05-27 2019-05-27 网页视频播放的控制方法、***、设备和存储介质

Publications (2)

Publication Number Publication Date
CN111741348A CN111741348A (zh) 2020-10-02
CN111741348B true CN111741348B (zh) 2022-09-06

Family

ID=72645883

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910447017.4A Active CN111741348B (zh) 2019-05-27 2019-05-27 网页视频播放的控制方法、***、设备和存储介质

Country Status (1)

Country Link
CN (1) CN111741348B (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN115706819A (zh) * 2021-08-17 2023-02-17 鸿富锦精密工业（深圳）有限公司 网页视频播放方法、装置、电子设备及存储介质

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101686338A (zh) * 2008-09-26 2010-03-31 索尼株式会社 分割视频中的前景和背景的***和方法
CN106254784A (zh) * 2016-09-29 2016-12-21 宇龙计算机通信科技(深圳)有限公司 一种视频处理的方法及装置
CN107529096A (zh) * 2017-09-11 2017-12-29 广东欧珀移动通信有限公司 图像处理方法及装置
CN108234825A (zh) * 2018-01-12 2018-06-29 广州市百果园信息技术有限公司 视频处理方法及计算机存储介质、终端
CN109670427A (zh) * 2018-12-07 2019-04-23 腾讯科技（深圳）有限公司 一种图像信息的处理方法、装置及存储介质

Family Cites Families (15)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9386303B2 (en) * 2013-12-31 2016-07-05 Personify, Inc. Transmitting video and sharing content via a network using multiple encoding techniques
CN104978750B (zh) * 2014-04-04 2018-02-06 诺基亚技术有限公司 用于处理视频文件的方法和装置
CN105118082B (zh) * 2015-07-30 2019-05-28 科大讯飞股份有限公司 个性化视频生成方法及***
CN105142017B (zh) * 2015-08-12 2019-01-22 北京金山安全软件有限公司 一种图片视频播放时的图片切换方法及图片切换装置
CN105744338B (zh) * 2016-02-18 2019-01-01 腾讯科技（深圳）有限公司 一种视频处理方法及其设备
WO2017143392A1 (en) * 2016-02-22 2017-08-31 GenMe Inc. A video background replacement system
CN106534683B (zh) * 2016-11-09 2019-10-25 尚云(广州)信息科技有限公司 智能化相机实时置换背景图的方法及其***
CN106954034A (zh) * 2017-03-28 2017-07-14 宇龙计算机通信科技(深圳)有限公司 一种图像处理方法及装置
CN108737891B (zh) * 2017-04-19 2021-07-30 阿里巴巴（中国）有限公司 视频素材处理方法及装置
CN107943363B (zh) * 2017-11-21 2020-10-02 广州视睿电子科技有限公司 背景图像的配置方法及装置、交互智能平板及存储介质
CN108124194B (zh) * 2017-12-28 2021-03-12 北京奇艺世纪科技有限公司 一种视频直播方法、装置及电子设备
CN108549663B (zh) * 2018-03-20 2021-12-14 厦门星罗网络科技有限公司 视频相册的绘制方法及装置
WO2020056690A1 (zh) * 2018-09-20 2020-03-26 太平洋未来科技（深圳）有限公司 一种视频内容关联界面的呈现方法、装置及电子设备
CN109379623A (zh) * 2018-11-08 2019-02-22 北京微播视界科技有限公司 视频内容生成方法、装置、计算机设备和存储介质
CN109729417B (zh) * 2019-03-28 2019-09-10 深圳市酷开网络科技有限公司 一种视频透明播放处理方法、智能电视及存储介质

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101686338A (zh) * 2008-09-26 2010-03-31 索尼株式会社 分割视频中的前景和背景的***和方法
CN106254784A (zh) * 2016-09-29 2016-12-21 宇龙计算机通信科技(深圳)有限公司 一种视频处理的方法及装置
CN107529096A (zh) * 2017-09-11 2017-12-29 广东欧珀移动通信有限公司 图像处理方法及装置
CN108234825A (zh) * 2018-01-12 2018-06-29 广州市百果园信息技术有限公司 视频处理方法及计算机存储介质、终端
CN109670427A (zh) * 2018-12-07 2019-04-23 腾讯科技（深圳）有限公司 一种图像信息的处理方法、装置及存储介质

Also Published As

Publication number Publication date
CN111741348A (zh) 2020-10-02

Similar Documents

Publication Publication Date Title
US20210127159A1 (en) Dynamic Video Overlays
EP3780637A1 (en) Webpage video playback method and apparatus, electronic device and storage medium
CN110764850A (zh) 界面显示方法、参数赋值方法、***及设备
US20140337753A1 (en) System and method for editing the appearance of a user interface
CN109840879B (zh) 图像渲染方法、装置、计算机存储介质及终端
CN107864384B (zh) 重定向云桌面上互联网视频播放的方法及装置
CN105072461A (zh) 一种数据处理方法和装置
CN108829486B (zh) 一种背景设置方法、装置、设备和存储介质
US10558504B1 (en) Systems and methods for automatically detecting desktop applications
CN112612436A (zh) 一种投屏切换方法、装置、设备及存储介质
CN112256990A (zh) 一种图像处理方法及装置、计算机可读存储介质
CN111294651A (zh) 基于播放数据流的静止画面防残影方法、装置及存储介质
CN114399437A (zh) 一种图像处理方法、装置、电子设备及存储介质
CN111741348B (zh) 网页视频播放的控制方法、***、设备和存储介质
CN110109591B (zh) 一种图片编辑方法和装置
CN111258434A (zh) 在聊天界面***图片的方法、装置、设备及存储介质
CN114237481A (zh) 书写笔迹显示处理方法、***、装置、设备和存储介质
CN112528177B (zh) 连接等待页切换内容页的方法、电子设备及存储介质
CN112188294A (zh) 一种信号源显示方法及装置
JP5303534B2 (ja) 体裁情報処理装置及び方法
CN107862035B (zh) 会议记录的网络读取方法、装置、智能平板和存储介质
AU2020288833A1 (en) Techniques for text rendering using font patching
CN116578795A (zh) 网页页面的生成方法及装置、存储介质、电子设备
CN112367295B (zh) 插件展示方法及装置、存储介质及电子设备
CN113919997A (zh) 一种水印处理方法、装置、电子设备及存储介质

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant