本发明属于互联网技术领域，具体涉及一种网页浏览器广告标记和拦截的系统及方法。
背景技术：
网页浏览器(webbrowser)是一种用于检索并展示万维网(worldwideweb)信息资源的应用程序。这些信息资源可为网页、图片、影音或其他内容，它们由统一资源标识符标识。信息资源中的超链接可使用户方便地浏览相关信息。
主流网页浏览器有mozillafirefox、internetexplorer、microsoftedge、googlechrome、opera及safari。万维网是信息时代发展的核心，也是数十亿人在互联网上进行互动的主要工具。网页主要是将文本格式化的超文本标记语言(html)。除了格式化文本之外，网页还可能包含图片、影片、声音和软件元件，这些元件在网页浏览器中以多媒体形式的连贯页面呈现。
随着网页技术的发展和广泛应用，网页广告也随之产生。然而大多数的网页广告，为了制造最大的视觉吸引效果，往往会选择放置在网页的显眼位置或者直接遮挡覆盖网页主体内容，对网页浏览者的体验造成极大的影响。因此，也诞生了许多种去除和拦截网页广告的技术。
在技术上层面，网页广告本身与普通网页元素相比并没有明确定义的边界，它们是使用完全相同的技术来实现的。甚至在产品层面，网页广告也无法与普通的网页信息进行明确地划分，有些人认为不影响使用的网页内容，而有些人却很不喜欢。因此，如何有选择性地拦截网页上的广告元素，是所有网页广告拦截方案最核心要解决的问题。
公告号为cn106227847a、名称为一种去广告系统及方法的中国专利公开了一种通过对网页请求的url进行检查并拦截含有广告资源的url从而实现拦截的网页广告的方法。
adblockplus(https://adblockplus.org/)是一种被广泛应用的浏览器广告拦截插件，支持网页元素拦截的拦截。可以支持简单的网页图片的鼠标右键去除。
而以上两种方法均需要有服务端为客户端提供在线的拦截规则信息，并且需要专业人士识别跟踪网站广告并向客户端发布拦截规则，因此只能拦截一些主流网站的主要的网页广告。如果网页广告资源发生变化，而服务端又不能及时更新拦截规则，就会导致拦截失效甚至误拦截。当用户访问一些不被支持的网站时，也只能看着广告在眼前随意游走，逍遥法外，在实际应用存在着诸多不足。adblockplus虽然支持图片的鼠标右键去除，然而只有极少的简单的固定链接的图片元素可以被成功去除，也不支持移动端浏览器的标记。
技术实现要素：
为了解决上述技术问题，本发明提出了一种强大的、可应用于移动端浏览器的、支持用户自主可视化操作进行广告标记和拦截的系统及方法。
本发明的系统所采用的技术方案是：一种网页广告可视化标记和拦截系统，其特征在于：由可视化标记系统、规则管理系统和拦截系统组成；所述可视化标记系统用来生成用户自定义的拦截规则，所述规则管理系统负责维护和提供拦截规则，所述拦截系统负责根据拦截规则拦截网页广告。
本发明的方法所采用的技术方案是：一种网页广告可视化标记和拦截方法，
其特征在于，包括以下步骤：
步骤1：在网页层，操作者点击网页，网页产生响应；
步骤2：标记控制器根据迭代特征算法寻找特征元素；
步骤3：在标记层，提取并转换特征元素的坐标，绘制特征元素的高亮边界；
步骤4：操作者对预览效果是否满意；
若是，则执行下述步骤5；
若否，则回转执行步骤1；
步骤5：标记控制器按照拦截规则进行拦截测试；
步骤6：操作者对拦截测试效果是否满意；
若是，保存拦截规则，并按照拦截规则执行广告拦截；
若否，则标记控制器撤销拦截测试，并回转执行步骤1。
本发明相对于现有技术，能够做到让不具有专业知识的普通用户也能够自己轻松完成对网页广告的标记和拦截。尤其是在网站广告发生变化时，也能够通过自主标记的方式及时去除新的网页广告，而不用等待漫长的维护人员适配和发布过程。
本发明除了能够标记和拦截网页广告，也能用来标记拦截网页中用户不喜欢的模块，把网页内容的选择权真正交到普通用户手中。
本发明也完全支持移动端网页的可视化标记。
附图说明
图1是本发明实施例的系统结构简图；
图2是本发明实施例的可视化标记系统的视图结构图；
图3是本发明实施例的方法流程图；
图4是本发明实施例的方法中迭代特征算法的流程图；
图5是本发明实施例的方法中拦截过程的流程图。
具体实施方式
为了便于本领域普通技术人员理解和实施本发明，下面结合附图及实施例对本发明作进一步的详细描述，应当理解，此处所描述的实施示例仅用于说明和解释本发明，并不用于限定本发明。
请见图1和图2，本发明提供的一种网页广告可视化标记和拦截系统，由可视化标记系统、规则管理系统和拦截系统组成；可视化标记系统用来生成用户自定义的拦截规则，规则管理系统负责维护和提供拦截规则，拦截系统负责根据拦截规则拦截网页广告。
本实施例的可视化标记系统由两个视图层和一个标记控制器组成；两个视图层为网页层和标记层；网页层用于提供网页内容及其变化的预览，标记层用于提供用户选中操作的预览，标记控制器用于管理操作记录并处理用户指令，并根据迭代特征算法寻找特征元素，提取特征元素的标签和属性，按照css标准生成css选择器代码，该css选择器代码就是特征元素对应的拦截规则。
本实施例的网页层提供了网页内容及其变化的预览。区别于正常显示的网页，标记控制器会在其加载初期注入工具脚本，工具脚本会执行拦截网页的点击事件，禁用默认点击事件的操作，并保留网页滚动浏览的能力。因此，在操作者执行点击选取的标记操作时，网页不会产生自动跳转，而在执行拖拽滚动的操作时，网页可以正常滚动。
本实施例的标记层提供了用户点击选中等操作的预览。在用户执行点击选取的操作时，网页中的工具脚本会产生响应事件，并携带响应元素的信息将事件传递给标记控制管理器。
本实施例的标记控制器管理操作记录并处理用户指令。在接收了由工具脚本传递过来的事件后，会根据迭代特征算法寻找符合标准的特征元素(特征元素)。并将特征元素的尺寸和位置信息传递给标记层。标记层对特征元素的区域生成预览效果。操作者根据预览效果调整自己的选择，重复上述操作，直到选中自己满意的特征元素。在最终输出拦截规则前，标记管理器将会对特征元素进行拦截测试，当操作者确认拦截测试的效果是自己期望的效果，才会根据特征元素的特征输出拦截规则，否则将会撤销拦截测试重新开始。元素区域预览和拦截测试共同保障了可视化标记系统的可行性和可靠性。
本实施例的标记层提供了用户点击选中等操作的预览。在接收标记控制器传递来的元素尺寸和位置信息后，将网页坐标转换为设备坐标，然后在标记层绘制出上述区域的高亮边界，标记层本身的背景是透明的，高亮边界对齐叠加在网页元素上，从而使操作者产生选中网页元素的视觉效果。
本实施例的规则管理系统由规则数据库、缓存控制器、脚本工厂组成；规则数据库为系统提供了域名-规则的增、删、查的能力；缓存控制器通过对规则进行内存缓存来提升查询效率；脚本工厂将拦截规则转换为javascript脚本，并交给拦截系统执行。
本实施例的规则数据库为系统提供了域名-规则的增、删、查的能力。其中域名-规则的关系是一对多的关系，即一个域名下对应了多个规则。其接收从可视化标记系统输出的拦截规则，按照域名进行分类存储。并为其他模块提供按照域名进行分类查询的接口。也提供规则删除的能力和拦截统计数据写入的能力。
本实施例的缓存控制器通过对规则进行内存缓存来提升查询效率。缓存控制器通过对已经查询的规则进行内存缓存，来减少数据库查询的次数，使用者在访问一个同一个域名下的多个网页时，只会在第一次时进行数据库查询，而后续的请求都会直接命中内存缓存。
本实施例的脚本工厂将拦截规则转换为拦截脚本，并交给拦截系统执行。通过规则数据库和缓存控制器的协作查询，已经可以获得一个网站的所有拦截规则。而拦截规则是不能直接应用于广告拦截的，脚本工厂会使用css选择器的语法，生成一段用于移除元素的javascript脚本代码。该脚本代码首先使用css选择器从网页结构中选出所有符合拦截规则的元素，然后将这些元素及其子元素一起从网页结构中移除。
本实施例的拦截系统由脚本注入器、网页监听器、统计工具组成；脚本注入器用于将javascript脚本注入正在加载的网页，并通过执行其函数移除网页中的广告元素；网页监听器用于监听网页加载过程并在合适的时机通过规则管理系统查询拦截规则和脚本并调用脚本注入器进行广告拦截；统计工具用于在移除广告元素时统计其数量并展示在用户界面上供使用者参考。
本实施例的脚本注入器可以将拦截脚本注入正在加载的网页，并执行其函数移除网页中的广告元素。各种平台的浏览器都提供了脚本注入的接口。最基本的用法就是直接load一段以javascript:开头的代码。脚本注入器控制了调用拦截函数的频率，每两次调用的间隔不会少于一个阈值。
本实施例的网页监听器监听网页加载过程并在合适的时机向规则管理系统查询拦截规则和拦截脚本，然后调用脚本注入器进行广告拦截。系统会在网页加载domcontentloaded事件之后开始执行拦截脚本，由于网页在加载过程中也会不断地改变结构，拦截脚本会在每次网页加载进度更新时再次执行，直到网页完全加载完成。
请见图3，本发明提供的一种网页广告可视化标记和拦截方法，包括以下步骤：
步骤1：在网页层，操作者点击网页，网页产生响应；
步骤2：标记控制器根据迭代特征算法寻找特征元素；
步骤3：在标记层，提取并转换特征元素的坐标，绘制特征元素的高亮边界；
步骤4：操作者对预览效果是否满意；
若是，则执行下述步骤5；
若否，则回转执行步骤1；
步骤5：标记控制器按照拦截规则进行拦截测试；
步骤6：操作者对拦截测试效果是否满意；
若是，保存拦截规则，并按照拦截规则执行广告拦截；
若否，则标记控制器撤销拦截测试，并回转执行步骤1。
请见图4，步骤2中所述迭代特征算法，具体实现包括以下步骤：
步骤2.1：将顶层响应元素设为当前元素；
步骤2.2：判断当前元素是否拥有id、class这种能直接标识元素分类的属性；
若是，则生成标签名及该类特征的css选择器规则；
若否，则执行下述步骤2.3；
步骤2.3：判断当前元素是否拥有href、src、title、alt这种能通过内容信息来标识元素的属性；
若是，则生成标签名及该类特征的css选择器规则；
若否，则执行下述步骤2.4；
步骤2.4：判断当前元素是否拥有其他属性；
若是，则生成标签名及该类特征的css选择器规则；
若否，则执行下述步骤2.5；
步骤2.5：判断当前元素是否有底层元素；
若是，则获取当前元素的底层元素，将该底层元素设为当前元素，并回转执行步骤2.2；
若否，则没有任何特征的元素，没有规则，不可标记。
本实施例的迭代特征算法，是一种用来在网页结构中选取指定区域拥有明显特征的元素的算法。最简单的选取特征元素的方式就是直接选取用户选中的顶层元素，但用户直接选中的顶层元素很多时候都不具有明显的特征，或者并不符合操作者的真实意愿。迭代特征算法对这个过程进行改进。迭代特征算法采用标签和属性结合的标准进行特征选取，采用自顶向下的顺序迭代访问其底层元素并寻找最合适的特征元素。
本实施例的迭代特征算法采用的标准，按照标签和属性两种特性将元素特征分为三类：一类、二类、三类。一类特征是指拥有id、class这种可以直接标识元素分类的属性；二类特征是指拥有href、src、title、alt这种可以通过内容信息来标识元素的属性；三类特征是指拥有其他属性。其中，一类特征和二类特征都可以直接用来作为标识元素的标准，而三类属性虽然指向性较弱，但如果能够将一个元素的多个三类属性组合成为一个特征，也能起到明显的标识效果。
请见图5，步骤6中所述按照拦截规则执行广告拦截，具体实现包括以下步骤：
步骤6.1：网页开始加载；
步骤6.2：响应domcontentloaded事件；
步骤6.3：向规则管理器查询拦截规则和拦截脚本；
步骤6.4：向网页中注入拦截脚本；
步骤6.5：判断网页是否加载完成；
若是，则网页加载完成，则停止调用拦截函数；
若否，则调用拦截脚本函数，并回转执行步骤6.5。
下面通过具体实施例，对本发明作进一步具体的说明。
在访问网页地址为https://www.xxxxx.com/index.html的网页时，在网页加载完成后，发现网页中有严重遮挡操作的弹出式广告a1，广告元素a1内有一个图片元素img1和一个按钮元素button1。为了避免每次浏览该网页时都弹出显示广告a1。用户选择通过本系统标记和拦截广告。用户点击标记按钮进入广告标记模式，此时网页上层会覆盖一层新的视图层，即上述标记层，此时本实施例把原本的网页所在的层称为网页层。系统会创建一个标记管理器，此时，标记管理器会自动向网页中注入并执行工具脚本。工具脚本将会拦截网页的点击事件，禁用网页默认点击事件的操作，并保留网页滚动浏览的能力。因此，在操作者执行点击选取的标记操作时，网页不会产生自动跳转，而在执行拖拽滚动的操作时，网页可以正常滚动。广告a1是一个网页元素，其也可以拥有很多子元素。此时，用户点击弹出式广告a1的任意区域，根据点击位置的不同，广告a1及其中的子元素(img1、button1)都有可能会响应点击事件。本实施例大致分2种情况，对该流程进行描述：
情况1：用户点击了a1，如果a1本身是特征元素，那么本实施例就直接找到了目标。如果a1不是特征元素，那么本实施例用相同的方法继续寻找a1底层的特征元素。
情况2：用户点击了img1或者button1，如果img1或者button1本身就是特征元素，那本实施例就直接返回img1或者button1。如果img1或者button1不是特征元素，那本实施例就会用相同的方法继续寻找其底层的元素，其底层元素就是a1，那么就会回到情况1。
如果本实施例得到的特征元素是a1，例如a1的特征是id＝ad_wnd，a1在网页层中的当前位置和大小会被传递给标记层，标记层按照设备的dpi信息对对坐标进行换算，并绘制出一个红色的边框。这个边框正好能够叠加在a1的区域，因此，用户就感知到自己选中了a1，并认为就是要拦截的广告，在确认拦截该区域时，标记管理器根据a1的特征(id＝ad_wnd)生成一份css选择器规则，然后按照该规则采用拦截系统的方法进行拦截测试，实际效果是a1及其子元素一起被从网页中移除掉了，用户得到了期望的结果，然后确认保存规则。
如果本实施例得到的特征元素是img1或者button1，按照上述相同的方法生成选中预览后，用户感知并不是自己真正期望的区域，于是重新点击更大范围的区域，再重新生成预览，直到最终选中a1。
按照这种方法，用户只需要不断地尝试点击，并根据预览效果调整自己的点击区域，就能够选中自己想要标记的元素。
对于特征元素，例如id＝ad_wnd，class＝wnd的div元素(一类)，href＝http://www.xxxx.com的a超链接元素(二类)，src＝http://www.xxxx.com/x.png的img图片元素(二类)，甚至style＝width:200；height:300；的p段落元素(三类)都可以成为特征元素。
以上过程就是整个可视化标记系统的对网页https://www.xxxxx.com/index.html中的a1广告实施实例。
当本实施例为网页https://www.xxxxx.com/index.html生成了一个id＝ad_wnd的规则时，首先提取网页的域名，即www.xxxxx.com，然后和id＝ad_wnd一起存入数据库。
在https://www.xxxxx.com/index.html网页再次加载时，拦截系统的网页监听器首先监听到了进行可视化标记的domcontentloaded事件，然后开始向规则管理系统查询www.xxxxx.com域名下的拦截规则和拦截脚本，规则管理器首先在缓存管理器中查询，未查询到该域名对应的拦截脚本，于是便从数据库中查询，查询到id＝ad_wnd以及其他的若干拦截规则，然后向脚本工厂生这些规则的拦截脚本，脚本工厂会合并这些规则生成一个该域名对应的唯一拦截脚本，并缓存在一个字典容器中。然后由脚本注入器将拦截脚本注入网页中。网页监听器监听每一次网页加载进度更新事件，调用拦截函数进行广告拦截，直到网页完全加载完成。在这个过程中，一旦a1元素出现在dom结构中，就会被拦截脚本移除。在继续加载www.xxxxx.com域名的其他网页时，无需再请求数据库便可以从规则管理器的缓存控制器中直接取得该域名的对应的拦截脚本。
以上过程，就是规则管理系统和拦截系统对网页https://www.xxxxx.com/index.html中用户使用可视化标记系统标记的a1广告进行拦截的实施实例。
应当理解的是，本说明书未详细阐述的部分均属于现有技术。
应当理解的是，上述针对较佳实施例的描述较为详细，并不能因此而认为是对本发明专利保护范围的限制，本领域的普通技术人员在本发明的启示下，在不脱离本发明权利要求所保护的范围情况下，还可以做出替换或变形，均落入本发明的保护范围之内，本发明的请求保护范围应以所附权利要求为准。