CN107239546B - 一种网页局部内容跟踪与提醒的方法 - Google Patents
一种网页局部内容跟踪与提醒的方法 Download PDFInfo
- Publication number
- CN107239546B CN107239546B CN201710414148.3A CN201710414148A CN107239546B CN 107239546 B CN107239546 B CN 107239546B CN 201710414148 A CN201710414148 A CN 201710414148A CN 107239546 B CN107239546 B CN 107239546B
- Authority
- CN
- China
- Prior art keywords
- webpage
- plug
- content
- target
- target area
- 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
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
- G06F9/44526—Plug-ins; Add-ons
Abstract
本发明公开了一种网页局部内容跟踪与提醒的方法，用户通过浏览器插件以可视化的方式点选网页局部；插件在后台不间断抓取目标网页；比对目标网页的目标区域内容是否发生变化；若有变化，则调用浏览器提醒机制(Web Notification等)，发送消息提醒给用户。本发明无需配置复杂的运行环境，基于可视化的网页局部内容点选，使用户简单快速地对任意网页的任意局部进行跟踪。运行在后台的插件程序对目标网页进行不间断的抓取与分析，如有更新则提醒给用户。
Description
技术领域
本发明涉及网页内容处理领域，具体涉及一种网页局部内容跟踪与提醒的方法。
背景技术
在生活和工作中，经常会遇到这样一种场景：跟踪某个特定网页的某个局部是否被更新。例如跟踪网上商城中心仪产品的价格，跟踪股票指数或者某支特定股票的交易信息等。对于绝大部分普通人来说，应对此种场景的办法，就是频繁地刷新网页、持续性地盯着电脑屏幕，人眼识别，费时费力。
存在一定编程基础的用户，可以通过写专用的爬虫脚本，对某个特定网页内容进行爬取，分析，跟踪网页中的关键内容。但是要求用户有一定的编程基础，需要编写专门的爬虫脚本对网页进行抓取。对于一般的互联网用户来讲，不太现实。需要对不同的网页做不同的技术处理，不能做到通用化。需要在用户电脑上配置脚本运行环境，易用性差。
相关术语
浏览器：在本说明书中特指“网页浏览器”，是一种用于检索并展示万维网信息资源的应用程序，例如Chrome，Firefox，QQ浏览器等。
插件：在本说明书中特指“浏览器插件”或“浏览器拓展”，是一种电脑程序，基于浏览器提供的接口或特性，为浏览器增加自定义的特定功能。
爬虫：即“网络爬虫”，是一种自动获取网页内容的程序。
Notification API：是HTML5规范中的一部分，实现了此规范的浏览器，可调用Notification API向终端用户发送弹窗等消息通知。
WebSocket：WebSocket规范定义了一种API，可在网络浏览器和服务器之间建立“套接字”连接。简单地说：客户端和服务器之间存在持久的连接，而且双方都可以随时开始发送数据。
发明内容
本发明所要解决的技术问题是提供一种网页局部内容跟踪与提醒的方法，使普通的互联网用户亦可通过简单的数次点击，实现实时、精确的网页局部内容跟踪与更新提醒。
为解决上述技术问题，本发明采用的技术方案是：
一种网页局部内容跟踪与提醒的方法，包括以下步骤：
步骤1：注入插件，即通过调用相应的插件API，将插件API代码注入到用户访问的网页中；
步骤2：激活插件
当点击浏览器扩展工具栏中的插件图标时，插件将显示菜单，从而插件被激活；或者在用户访问网页时，通过鼠标右键弹出的上下文菜单来激活插件；插件激活后，用户可通过鼠标在网页中进行目标区域选中操作；
步骤3：实现页面局部区域的鼠标点选交互
插件将代码注入到网页中时，为网页中的每个DOM元素添加mouseover事件的处理函数，此函数在监听到mouseover事件时，将鼠标所在区域高亮，以供用户点击选中；
或者插件将代码注入到网页中时，为网页中的每个DOM元素添加click事件的处理函数，此函数在监听到右键点击事件时，将鼠标点击的DOM元素选中；
步骤4：将选中的页面元素以可跟踪的方式进行提取
DOM元素在浏览器中完成渲染，以图像的方式呈现；选中的目标区域被点击后，需要将此目标区域进行特征提取，以便后续比对；
DOM元素被点击时，其绑定的事件处理函数对所在的DOM元素进行向上回溯，并结合此元素属性，包括class、id，生成目标DOM元素的JavaScript选择器；提取出的选择器，即为需要跟踪的目标区域特征；
步骤5：数据持久化，即通过调用HTML5 API，将目标网页URL地址、目标区域特征、目标区域现内容，持久化存储在浏览器LocalStorage或IndexedDB中；
步骤6：后台页面轮询
运行在后台的插件代码，间隔一段时间，从浏览器数据库中，读取要跟踪的目标网页URL，调用Fetch API，对目标网页内容进行抓取；
步骤7：目标区域比对
页面抓取后，根据记录中的目标区域特征，对抓取回来的网页进行解构分析，并提取出目标区域内容，同记录中的历史内容进行比对，若本次抓取提取的目标区域内容同历史内容一致，则继续步骤6；若本次抓取提取的目标区域内容同历史内容相比发生了变化，则将此次内容更新推送给用户；
步骤8：消息推送
通过调用HTML5 Notification API，将页面内容更新以弹窗的形式反馈给用户，用户点击此消息后，跳转到目标网页，并将目标区域进行高亮。
进一步的，在步骤6、步骤7中，对目标网页的数据抓取及比对放入服务端进行，服务端与浏览器插件通过WebSocket连接，待目标网页发生更新，服务端通过WebSocket将变更内容推送给浏览器插件。
与现有技术相比，本发明的有益效果是：本发明以后台任务加异步通知的方式提醒用户所关注内容的变化，既做到了较高的实时性，又可避免用户持续刷新页面带来的时间与带宽的浪费。
附图说明
图1是本发明一种网页局部内容跟踪与提醒的方法示意图。
具体实施方式
下面结合附图和具体实施方式对本发明作进一步详细的说明。本发明中，用户通过浏览器插件以可视化的方式点选网页局部→插件在后台不间断抓取目标网页→比对目标网页的目标区域内容是否发生变化→若有变化，则调用浏览器提醒机制(WebNotification等)，发送消息提醒给用户。
本发明基于浏览器的插件机制，在浏览器后台运行，无需配置复杂的运行环境。基于可视化的网页局部内容点选，使用户简单快速地对任意网页的任意局部进行跟踪。运行在后台的插件程序对目标网页进行不间断的抓取与分析，如有更新则提醒给用户。
从架构上来说，的插件分三部分：第一部分即插件的前端操作界面，主要包括插件的菜单等；第二部分是注入到用户网页中的代码，用于为目标网页中的DOM元素绑定事件处理函数，并同插件后台通信；第三部分即插件后台代码，主要功能包括网页区域特征提取，网页数据抓取，目标区域比对，消息通知等，详述如下：
1、插件的注入
多数现代浏览器(Chrome，Firefox，IE Edge等)均提供了API用于插件代码注入，通过调用相应的插件API,将的插件代码注入到用户访问的网页中。
2、插件的激活
插件在安装后，提供两种方式激活使用插件：
A)点击浏览器扩展工具栏中的插件图标，插件将显示菜单，从而插件被激活。
B)在用户访问网页时，用户可点击鼠标右键，通过弹出的上下文菜单来激活插件。
插件激活后，用户可通过鼠标在网页中进行目标区域选中操作。
3、页面局部区域的鼠标点选交互的技术实现
对应上述步骤，分别有以下两种实现方式：
A)插件将代码注入到网页中时，为网页中的每个DOM元素添加mouseover事件的处理函数，此函数在监听到mouseover事件时，将鼠标所在区域高亮，以供用户点击选中。
B)插件将代码注入到网页中时，为网页中的每个DOM元素添加click事件的处理函数，此函数在监听到右键点击事件时，将鼠标点击的DOM元素选中。
4、将选中的页面元素以可跟踪的方式进行提取
DOM元素在浏览器中完成渲染，以图像的方式呈现。选中的目标区域被点击后，需要将此目标区域进行特征提取，以便后续比对。DOM元素被点击时，其绑定的事件处理函数，对所在的DOM元素进行向上回溯，并结合此元素的class、id等属性，生成目标DOM元素的JavaScript选择器。提取出的选择器，即为需要跟踪的目标区域特征。
5、数据持久化
通过调用HTML5 API，将目标网页URL地址、目标区域特征、目标区域现内容，持久化存储在浏览器LocalStorage或IndexedDB中。
6、后台页面轮询
运行在后台的插件代码，间隔一段时间(例如1分钟)，从浏览器数据库中，读取要跟踪的目标网页URL，调用Fetch API，对目标网页内容进行抓取。
7、目标区域比对
页面抓取后，根据记录中的目标区域特征，对抓取回来的网页进行解构分析，并提取出目标区域内容，同记录中的历史内容进行比对，若本次抓取提取的目标区域内容同历史内容一致，则继续步骤6；若本次抓取提取的目标区域内容同历史内容相比发生了变化，则将此次内容更新推送给用户。
8、消息推送
通过调用HTML5 Notification API，将页面内容更新以弹窗等形式反馈给用户，用户点击此消息后，跳转到目标网页，并将目标区域进行高亮。
在第6、第7步中，对目标网页的数据抓取及比对可以放入服务端进行。服务端与浏览器插件通过WebSocket连接，待目标网页发生更新，服务端通过WebSocket将变更内容推送给浏览器插件。
用户端实现过程为：1)用户通过浏览器访问目标网页；2)用户在浏览器界面内激活插件，鼠标点选目标网页的目标区域，浏览器插件将所点选区域加入监控队列；3)插件在后台运行，每隔数(十)秒，从目标服务器抓取页面内容，提取出页面内目标区域，同上次抓取内容进行比对；4)若目标内容发生了变化，则调用浏览器的Notification API，将通知内容加入浏览器的通知队列；5)浏览器将页面内容变化的消息以弹窗等形式推送给用户。
Claims (2)
1.一种网页局部内容跟踪与提醒的方法，其特征在于，包括以下步骤：
步骤1：注入插件，即通过调用相应的插件API，将插件API代码注入到用户访问的网页中；
步骤2：激活插件
当点击浏览器扩展工具栏中的插件图标时，插件将显示菜单，从而插件被激活；或者在用户访问网页时，通过鼠标右键弹出的上下文菜单来激活插件；插件激活后，用户能通过鼠标在网页中进行目标区域选中操作；
步骤3：实现页面局部区域的鼠标点选交互
插件将代码注入到网页中时，为网页中的每个DOM元素添加mouseover事件的处理函数，此函数在监听到mouseover事件时，将鼠标所在区域高亮，以供用户点击选中；
或者插件将代码注入到网页中时，为网页中的每个DOM元素添加click事件的处理函数，此函数在监听到右键点击事件时，将鼠标点击的DOM元素选中；
步骤4：将选中的页面元素以可跟踪的方式进行提取
DOM元素在浏览器中完成渲染，以图像的方式呈现；选中的目标区域被点击后，需要将此目标区域进行特征提取，以便后续比对；
DOM元素被点击时，其绑定的事件处理函数对所在的DOM元素进行向上回溯，并结合此元素属性，包括class、id，生成目标DOM元素的JavaScript选择器；提取出的选择器，即为需要跟踪的目标区域特征；
步骤5：数据持久化，即通过调用HTML5API，将目标网页URL地址、目标区域特征、目标区域现内容，持久化存储在浏览器LocalStorage或IndexedDB中；
步骤6：后台页面轮询
运行在后台的插件代码，间隔一段时间，从浏览器数据库中，读取要跟踪的目标网页URL，调用Fetch API，对目标网页内容进行抓取；
步骤7：目标区域比对
页面抓取后，根据记录中的目标区域特征，对抓取回来的网页进行解构分析，并提取出目标区域内容，同记录中的历史内容进行比对，若本次抓取提取的目标区域内容同历史内容一致，则继续步骤6；若本次抓取提取的目标区域内容同历史内容相比发生了变化，则将此次内容更新推送给用户；
步骤8：消息推送
通过调用HTML5Notification API，将页面内容更新以弹窗的形式反馈给用户，用户点击此消息后，跳转到目标网页，并将目标区域进行高亮。
2.如权利要求1所述的一种网页局部内容跟踪与提醒的方法，其特征在于，在步骤6、步骤7中，对目标网页的数据抓取及比对放入服务端进行，服务端与浏览器插件通过WebSocket连接，待目标网页发生更新，服务端通过WebSocket将变更内容推送给浏览器插件。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710414148.3A CN107239546B (zh) | 2017-06-05 | 2017-06-05 | 一种网页局部内容跟踪与提醒的方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710414148.3A CN107239546B (zh) | 2017-06-05 | 2017-06-05 | 一种网页局部内容跟踪与提醒的方法 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN107239546A CN107239546A (zh) | 2017-10-10 |
| CN107239546B true CN107239546B (zh) | 2021-07-06 |
Family
ID=59984827
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710414148.3A Active CN107239546B (zh) | 2017-06-05 | 2017-06-05 | 一种网页局部内容跟踪与提醒的方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107239546B (zh) |
Families Citing this family (11)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109284045B (zh) * | 2018-09-13 | 2021-11-05 | 武汉轻工大学 | 一种基于浏览器插件的按元素截图方法及装置 |
| CN110428153A (zh) * | 2019-07-19 | 2019-11-08 | 中国建设银行股份有限公司 | 消息聚合方法及装置 |
| CN110471887A (zh) * | 2019-07-29 | 2019-11-19 | 深圳数位传媒科技有限公司 | 一种获取网页内容渲染文件的方法及装置 |
| CN110457024B (zh) * | 2019-07-29 | 2020-09-22 | 南京控维通信科技有限公司 | 基于VUE的前端请求和更新数据的插件iwebData实现方法 |
| CN111324388A (zh) * | 2020-01-21 | 2020-06-23 | 北京三快在线科技有限公司 | 网页信息监控方法和装置、存储介质、电子设备 |
| CN112883253A (zh) * | 2021-05-06 | 2021-06-01 | 药渡经纬信息科技(北京)有限公司 | 数据处理方法、装置、设备及可读存储介质 |
| CN113722640A (zh) * | 2021-08-26 | 2021-11-30 | 长沙博为软件技术股份有限公司 | 一种基于rpa的网页可配置项的采集方法、装置及介质 |
| CN114064144B (zh) * | 2021-11-12 | 2024-03-22 | 南京论之语网络技术有限公司 | 一种跨应用数据获取的通信插件以及通信方法 |
| CN114116731B (zh) * | 2022-01-24 | 2022-04-22 | 北京智象信息技术有限公司 | 一种基于indexedDB存储的数据分离存储展示方法及装置 |
| CN114780164B (zh) * | 2022-02-28 | 2023-04-25 | 深圳开源互联网安全技术有限公司 | 基于浏览器插件筛选网页信息的方法及系统 |
| CN114676330B (zh) * | 2022-03-30 | 2023-12-08 | 南京厚建软件有限责任公司 | 一种互联网平台互动数据统一回收的方法 |
Family Cites Families (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US7593935B2 (en) * | 2006-10-19 | 2009-09-22 | Paxfire | Methods and systems for node ranking based on DNS session data |
| US9015128B2 (en) * | 2012-11-28 | 2015-04-21 | Sharethis, Inc. | Method and system for measuring social influence and receptivity of users |
| US10078575B2 (en) * | 2013-03-13 | 2018-09-18 | Microsoft Technology Licensing, Llc | Diagnostics of state transitions |
| CN106777362A (zh) * | 2017-01-19 | 2017-05-31 | 杭州云灵科技有限公司 | 一种html页面的信息采集方法 |
-
2017
- 2017-06-05 CN CN201710414148.3A patent/CN107239546B/zh active Active
Also Published As
| Publication number | Publication date |
|---|---|
| CN107239546A (zh) | 2017-10-10 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN107239546B (zh) | 一种网页局部内容跟踪与提醒的方法 | |
| US10671692B2 (en) | Uniquely identifying and tracking selectable web page objects | |
| WO2018133452A1 (zh) | 一种网页渲染方法及相关设备 | |
| US20180150771A1 (en) | Multi-dimensional visualization of temporal information | |
| US10067730B2 (en) | Systems and methods for enabling replay of internet co-browsing | |
| US10380197B2 (en) | Network searching method and network searching system | |
| Adar et al. | Resonance on the web: web dynamics and revisitation patterns | |
| US20140304646A1 (en) | Sliding side menu gui with menu items displaying indicia of updated content | |
| US20080115149A1 (en) | System and method for providing context information | |
| CN104243273A (zh) | 即时通讯客户端显示信息的方法及设备和信息显示系统 | |
| CN108595304A (zh) | 网页监控方法及装置 | |
| CN113159807B (zh) | 落地页处理方法、装置、设备和介质 | |
| WO2013091904A1 (en) | Method and system to measure user engagement with content through event tracking on the client side | |
| US20230289511A1 (en) | Mobile device and method | |
| CN113190512A (zh) | 一种基于埋点技术的电力客户行为数据分析方法 | |
| US20140258372A1 (en) | Systems and Methods for Categorizing and Measuring Engagement with Content | |
| US9442620B2 (en) | Navigation systems with event notification | |
| US20130297600A1 (en) | Method and system for chronological tag correlation and animation | |
| US20160283075A1 (en) | Information processing method, apparatus, and system | |
| US10762116B2 (en) | System and method for analyzing and visualizing team conversational data | |
| CN111611476B (zh) | 专题页面的显示方法和装置 | |
| US9361651B2 (en) | Displaying quantitative trending of pegged data from cache | |
| CN113127653A (zh) | 信息显示方法、装置 | |
| CN113378036A (zh) | 页面操作分析、埋点方法、装置、设备及存储介质 | |
| CN103617223A (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 | ||
| CP02 | Change in the address of a patent holder |
Address after: 9/F, Building C, No. 28, North Tianfu Avenue, China (Sichuan) Pilot Free Trade Zone, Hi tech Zone, Chengdu, 610000, Sichuan Patentee after: CHENGDU KNOWNSEC INFORMATION TECHNOLOGY Co.,Ltd. Address before: 610000, 11th floor, building 2, No. 219, Tianfu Third Street, hi tech Zone, Chengdu, Sichuan Province Patentee before: CHENGDU KNOWNSEC INFORMATION TECHNOLOGY Co.,Ltd. |
|
| CP02 | Change in the address of a patent holder |