CN114064144A - 一种跨应用数据获取的通信插件以及通信方法 - Google Patents
一种跨应用数据获取的通信插件以及通信方法 Download PDFInfo
- Publication number
- CN114064144A CN114064144A CN202111340217.3A CN202111340217A CN114064144A CN 114064144 A CN114064144 A CN 114064144A CN 202111340217 A CN202111340217 A CN 202111340217A CN 114064144 A CN114064144 A CN 114064144A
- Authority
- CN
- China
- Prior art keywords
- page
- user
- picture
- module
- event
- 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.)
- Granted
Links
- 238000004891 communication Methods 0.000 title claims abstract description 53
- 238000000034 method Methods 0.000 title claims description 50
- 230000006399 behavior Effects 0.000 claims abstract description 61
- 238000012545 processing Methods 0.000 claims abstract description 7
- 230000003068 static effect Effects 0.000 claims description 36
- 238000012544 monitoring process Methods 0.000 claims description 21
- 238000005096 rolling process Methods 0.000 claims description 18
- 238000009877 rendering Methods 0.000 claims description 12
- 230000000007 visual effect Effects 0.000 claims description 12
- 230000009191 jumping Effects 0.000 claims description 10
- 230000001960 triggered effect Effects 0.000 claims description 6
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000009434 installation Methods 0.000 description 1
- 210000001503 joint Anatomy 0.000 description 1
Images
Classifications
-
- 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
-
- 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
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
-
- 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/46—Multiprogramming arrangements
- G06F9/54—Interprogram communication
- G06F9/542—Event management; Broadcasting; Multicasting; Notifications
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Multimedia (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明提出一种跨应用数据获取的通信插件，所述插件安装于浏览器上，该插件包括浏览路径追踪模块、DOM元素采集模块、图片截取模块及应用通信模块；路径追踪模块，用于在页面中注入DOM采集的事件代码以及在页面中注入图片截取的事件代码以追踪浏览器行为及事件；DOM元素采集模块，用于在用户浏览被追踪页面时，由用户主动触发该页面的DOM采集事件，对指定位置的DOM元素信息采集；图片截取模块，用于在用户浏览被追踪页面时，可由用户主动触发或系统自动触发该页面的图片截取事件，对指定位置的图片信息截取；应用通信模块，获取路径追踪模块、DOM元素采集模块及图片截取模块的处理结果数据，将各个模块的结果数据发送至特定应用。
Description
技术领域
本发明属于浏览器插件技术领域，尤其涉及一种跨应用数据获取的通信插件以及通信方法。
背景技术
针对存在多应用系统的工作环境，用户在开展一项事务型工作时，需要访问不同的应用系统，在不同的应用系统上开展同一项工作任务，并且分别将各个应用系统中的工作成果数据导出到本地后再进行融合。如需要打通工作环境中的各个应用系统，按照现有技术则需要求各个应用厂家分别开发一套用于对接的接口体系，以供特定应用系统对接，该方法存才大量问题：1、接口体系标准难以确定，各个应用都有独特的数据体系及应用方式，难以实现标准统一；2、改造成本投入巨大，各个应用都需要进行定制化开发，涉及应用越多，成本投入越巨大；3、扩展性能极其低效，每次增加应用或扩展接口功能都需要各个应用厂家同步修改，延迟长、反馈慢。
在这种情况下，迫切需要一种不同过接口的跨应用数据获取及通信方法以记录用户在各个应用之间的访问路径及对各个应用内容信息的自动+手动记录功能。本发明将提供一种基于浏览器插件的跨应用数据获取及通信方法，在用户因工作访问各个应用时，自动记录用户的浏览的应用及跳转关系，并同步截取网页截图及XPATH信息，完整保存应用当前数据，同时提供手动的截图及页面元素的截取功能。
发明内容
发明目的：本发明提出一种跨应用数据获取的通信插件以及通信方法，通过浏览器插件的方式，融合各个应用系统，记录应用访问路径及其结果数据。以解用户工作环境各个应用系统孤立，无法协同工作的问题。通过本方法实现对工作中浏览应用的路径流程及内容的全面记录。该方法包括浏览路径追踪模块、DOM元素采集模块、图片截取模块及应用通信模块。该插件为即插即用式插件，即在使用时，直接通过浏览器选择已经封装好的插件目录即可，自动在浏览器中生成插件图标。
技术方案：为了解决本发明的技术问题，本发明提出一种跨应用数据获取的通信插件，所述插件安装于浏览器上，该插件包括浏览路径追踪模块、DOM元素采集模块、图片截取模块及应用通信模块；
路径追踪模块，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，对用户所浏览页面进行追踪，并记录用户的当前访问的页面以及用户的网络浏览行为信息；
DOM元素采集模块，用于对用户所浏览的追踪页面注入DOM采集的事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息进行采集；
图片截取模块，用于对用户所浏览的追踪页面注入图片截取事件代码，用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信进行截取；
应用通信模块，将用户的网络浏览行为信息数据、采集的OM元素信息数据、截取的图片数据发送至应用系统进行处理。
所述应用系统的目标是通过收集不同应用的信息，贯通应用、工作留痕、并尽可能的减少用户工作量，跟踪用户在工作过程中的操作流程，并以图的形式直观展示，主要展示信息包括用户工作过程中使用过的应用、使用应用的具体功能、过程中关注的DOM信息，关注的页面截图信息等。
优选的，所述路径追踪模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)路径追踪模块接收到该广播及页面ID后，路径追踪模块主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则向路径追踪模块发送该事件信息；
(5)路径追踪模块再次接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并将各个页面的跳转信息发送给应用通信模块。
优选的，所述DOM元素采集模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)DOM元素采集模块接收到该广播及页面ID后，DOM元素采集模块主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM元素的整个内容，对抓取DOM元素的进行解析，将解析完成的DOM元素信息发送给应用通信模块。
优选的，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)图片截取模块抓取浏览器当前应用页面可视区域的静态截图，作为初始截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，并将截取的图片信息发送给应用通信模块。
优选的，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，图片截取模块抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：
所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
另一方面，本发明还提出一种跨应用数据获取的通信方法，该方法如下：
(1)追踪用户的网络浏览行为信息，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，并记录用户的当前访问的页面；
(2)对用户所浏览的追踪页面，注入DOM采集的事件代码和注入图片截取事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息的采集；用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信息进行截取；
(3)将用户追踪的数据、DOM元素信息的采集数据、截取的图片信息发送至应用系统进行处理。
优选的，追踪用户的网络浏览行为信息的方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序首先获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则发送记录该事件信息；
(5)接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并记录跳转信息。
优选的，所述DOM元素信息的采集的方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到该广播及页面ID后，主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM整个内容；抓取DOM元素后，对解析DOM元素进行解析，并记录将解析完成的DOM元素信息。
优选的，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)抓取浏览器当前应用页面可视区域的静态截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接后获取截图；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，记录拼接后的图片信息。
优选的，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
有益效果：与现有技术相比，本发明的技术方案具有以下有益技术效果：
1、基于插件式的设计，通过安装浏览器插件，可将全部功能都添加到浏览器中，安装方便随装随用。
2、全自动的浏览路径追踪能力，可全程记录浏览网站信息，并依据访问时间、跳转关系信息进行规整，实现网站浏览全流程的回溯。
3、全自动的页面元素采集能力，将自动抓取访问过程中的各个网页信息，包括网页的各DOM元素、排版样式。
4、全自动的页面截图能力，将自动截取浏览过程中的网页信息，包括未能展示在屏幕上的隐藏页面的截图。
5、手动截图及页面抓取能力，可手动采集网站页面中重点的内容信息。
6、无需当前应用系统进行任何开发及配合工作，各个应用系统无感知。
附图说明
图1是本发明基于插件的系统架构图；
图2路径追踪模块；
图3DOM元素采集模块；
图4图片截取模块；
图5应用通信模块通信。
具体实施方式
下面结合附图对本发明进一步详细说明。
本发明提出一种跨应用数据获取的通信插件，所述插件安装于浏览器上，该插件包括浏览路径追踪模块、DOM元素采集模块、图片截取模块及应用通信模块；
路径追踪模块，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，对用户所浏览页面进行追踪，并记录用户的当前访问的页面以及用户的网络浏览行为信息；
DOM元素采集模块，用于对用户所浏览的追踪页面注入DOM采集的事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息进行采集；
图片截取模块，用于对用户所浏览的追踪页面注入图片截取事件代码，用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信进行截取；
应用通信模块，将用户的网络浏览行为信息数据、采集的OM元素信息数据、截取的图片数据发送至应用系统进行处理。
优选的，所述路径追踪模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)路径追踪模块接收到该广播及页面ID后，路径追踪模块主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则向路径追踪模块发送该事件信息；
(5)路径追踪模块再次接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并将各个页面的跳转信息发送给应用通信模块。
优选的，所述DOM元素采集模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)DOM元素采集模块接收到该广播及页面ID后，DOM元素采集模块主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM元素的整个内容，对抓取DOM元素的进行解析，将解析完成的DOM元素信息发送给应用通信模块。
优选的，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)图片截取模块抓取浏览器当前应用页面可视区域的静态截图，作为初始截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，并将截取的图片信息发送给应用通信模块。
优选的，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，图片截取模块抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：
所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
另一方面，本发明还提出一种跨应用数据获取的通信方法，该方法如下：
(1)追踪用户的网络浏览行为信息，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，并记录用户的当前访问的页面；
(2)对用户所浏览的追踪页面，注入DOM采集的事件代码和注入图片截取事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息的采集；用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信息进行截取；
(3)将用户追踪的数据、DOM元素信息的采集数据、截取的图片信息发送至应用系统进行处理。
优选的，追踪用户的网络浏览行为信息的方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序首先获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则发送记录该事件信息；
(5)接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并记录跳转信息。
优选的，所述DOM元素信息的采集的方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到该广播及页面ID后，主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM整个内容；抓取DOM元素后，对解析DOM元素进行解析，并记录将解析完成的DOM元素信息。
优选的，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)抓取浏览器当前应用页面可视区域的静态截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接后获取截图；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，记录拼接后的图片信息。
优选的，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
如图1所述，在工作环境中，首先需要在浏览器中安装该方法的插件，安装完成后可直接到各个应用系统中直接开展相关工作。如附图1所示：用户浏览了应用A、应用B、应用C，3个应用系统，插件将自动记录工作过程中用户对各个应用的访问顺序及跳转关系，同时自动获取DOM元素信息及截取页面图片信息，将采集到的用户浏览路径信息、页面截图信息、DOM元素信息融合后，通过应用通信模块发送至特定应用系统。
应用：即用户使用的业务系统，通常此类应用系统分为B/S架构及C/S架构，在本专利中所指的应用都为B/S架构。用户通过浏览器访问业务应用系统，在应用系统完成工作任务。图中出现的应用A、应用B、应用C即指用户使用的多个B/S端的业务应用系统。
除了自动DOM元素获取、截图外，用户可直接操作已经安装的插件，进行手动的DOM元素选择采集及手动页面图片截取，手动DOM元素采集与页面图片截取整体流程与自动相同，但触发角色变为用户主动触发，用户触发完成的DOM元素采集与页面截图结果，同样将有应用通信模块由各个应用系统中，传递到特定应用系统。
Claims (10)
1.一种跨应用数据获取的通信插件，其特征在于，所述插件安装于浏览器上，该插件包括浏览路径追踪模块、DOM元素采集模块、图片截取模块及应用通信模块；
路径追踪模块，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，对用户所浏览页面进行追踪，并记录用户的当前访问的页面以及用户的网络浏览行为信息；
DOM元素采集模块，用于对用户所浏览的追踪页面注入DOM采集的事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息进行采集；
图片截取模块，用于对用户所浏览的追踪页面注入图片截取事件代码，用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信进行截取；
应用通信模块，将用户的网络浏览行为信息数据、采集的OM元素信息数据、截取的图片数据发送至应用系统进行处理。
2.根据权利要求1所述的一种跨应用数据获取的通信插件，其特征在于，所述路径追踪模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)路径追踪模块接收到该广播及页面ID后，路径追踪模块主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则向路径追踪模块发送该事件信息；
(5)路径追踪模块再次接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并将各个页面的跳转信息发送给应用通信模块。
3.根据权利要求1所述的一种跨应用数据获取的通信插件，其特征在于，所述DOM元素采集模块的具体功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)DOM元素采集模块接收到该广播及页面ID后，DOM元素采集模块主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM元素的整个内容，对抓取DOM元素的进行解析，将解析完成的DOM元素信息发送给应用通信模块。
4.根据权利要求1所述的一种跨应用数据获取的通信插件，其特征在于，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)图片截取模块抓取浏览器当前应用页面可视区域的静态截图，作为初始截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，并将截取的图片信息发送给应用通信模块。
5.根据权利要求1所述的一种跨应用数据获取的通信插件，其特征在于，所述图片截取模块的功能如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID，并对各个模块发送携带该页面ID的事件广播；
(2)图片截取模块接收到该广播及页面ID后，图片截取模块将向该ID页面主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，图片截取模块抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：
所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
6.一种跨应用数据获取的通信方法，其特征在于，该方法如下：
(1)追踪用户的网络浏览行为信息，在用户打开新页面或发生页面跳转时，注入路径追踪的事件代码，并记录用户的当前访问的页面；
(2)对用户所浏览的追踪页面，注入DOM采集的事件代码和注入图片截取事件代码，用户主动触发该页面的DOM采集事件时，对指定位置的DOM元素信息的采集；用户主动触发或系统自动触发该页面的图片截取事件时，对指定位置的图片信息进行截取；
(3)将用户追踪的数据、DOM元素信息的采集数据、截取的图片信息发送至应用系统进行处理。
7.根据权利要求6所述的一种跨应用数据获取的通信方法，其特征在于，追踪用户的网络浏览行为信息的方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入追踪用户行为的js代码，并对用户的浏览行为进行监听；
(3)监听程序首先获取当前页面的标识信息，同时监听用户是否存在从当前页面链接跳转新页面的行为信息；
(4)在当前的监听页面中，如果触发了页面跳转的行为事件，则发送记录该事件信息；
(5)接收到页面跳转的信息后，则对跳转到的新页面注入追踪用户行为的js代码，并对新页面的用户浏览行为进行监听，并记录跳转信息。
8.根据权利要求6所述的一种跨应用数据获取的通信方法，其特征在于，所述DOM元素信息的采集的方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到该广播及页面ID后，主动注入DOM元素采集的js代码，并对用户DOM元素采集事件行为进行监听；
(3)当监听程序收到DOM采集事件被触发时，将跟踪鼠标位置，当鼠标移动到某个DOM元素内，渲染高亮半透明元素，遮盖这个DOM元素；
(4)当鼠标点击时，抓取这个DOM整个内容；抓取DOM元素后，对解析DOM元素进行解析，并记录将解析完成的DOM元素信息。
9.根据权利要求6所述的一种跨应用数据获取的通信方法，其特征在于，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并由系统自动触发该页面的图片截取事件；
(3)抓取浏览器当前应用页面可视区域的静态截图；
(4)将抓取的截图渲染到浏览器窗口，判断是否存在超出屏幕部分的区域，不存在，则直接截取图片；存在时，则进行隐藏区计算、滚动截取、图片拼接后获取截图；
隐藏区计算：
通过浏览器调取得到网页的总尺寸以及调取得到网页可见尺寸；
总尺寸去掉可见尺寸即为隐藏区尺寸，再依据可见尺寸大小，将隐藏区拆分为多个可见尺寸，即可获得拆分坐标；
滚动截取：设置取景框为浏览器可见尺寸，按照隐藏区域拆分坐标，对页面进行滚动，对拆分完的隐藏区域进行截图；
图片拼接：获取初始截图及隐藏区域的各个截图，按照坐标对各个截图进行拼接获取拼接后的图片，记录拼接后的图片信息。
10.根据权利要求6所述的一种跨应用数据获取的通信方法，其特征在于，所述图片截取方法如下：
(1)用户使用浏览器打开新的应用界面时，生成该页面的页面ID；
(2)接收到页面ID后，主动注入图片截取的js代码，并对用户的图片截取行为进行监听；
(3)当用户触发截图事件时，抓取浏览器当前应用页面可视区域的静态截图；
(4)将静态截图渲染到浏览器窗口，通过取景框对静态截图进行截取，将截取后的图片发送给应用通信模块：所述取景框对静态截图进行截取的方法为：获取鼠标起始坐标，结束点坐标，以鼠标起始坐标和结束点的连线作为对角线构建矩形绘制取景框，将处于取景框内的静态截图作为最终的截取图片。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111340217.3A CN114064144B (zh) | 2021-11-12 | 2021-11-12 | 一种跨应用数据获取的通信插件以及通信方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111340217.3A CN114064144B (zh) | 2021-11-12 | 2021-11-12 | 一种跨应用数据获取的通信插件以及通信方法 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN114064144A true CN114064144A (zh) | 2022-02-18 |
| CN114064144B CN114064144B (zh) | 2024-03-22 |
Family
ID=80275562
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111340217.3A Active CN114064144B (zh) | 2021-11-12 | 2021-11-12 | 一种跨应用数据获取的通信插件以及通信方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN114064144B (zh) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114676330A (zh) * | 2022-03-30 | 2022-06-28 | 南京厚建软件有限责任公司 | 一种互联网平台互动数据统一回收的方法 |
| CN115277396A (zh) * | 2022-08-04 | 2022-11-01 | 北京智慧星光信息技术有限公司 | 一种用于模拟浏览器操作的消息驱动方法和系统 |
| CN116070053A (zh) * | 2023-03-29 | 2023-05-05 | 杭州实在智能科技有限公司 | 用于信创体系的跨平台rpa浏览器数据采集方法及系统 |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2002244961A (ja) * | 2001-02-19 | 2002-08-30 | Nec System Technologies Ltd | アクセス経路情報取得方法、トラッキングサーバプログラム及びコンピュータ |
| CN105550187A (zh) * | 2014-11-03 | 2016-05-04 | 阿里巴巴集团控股有限公司 | 单页应用中浏览记录的管理方法及装置 |
| CN107239546A (zh) * | 2017-06-05 | 2017-10-10 | 成都知道创宇信息技术有限公司 | 一种网页局部内容跟踪与提醒的方法 |
| CN107239389A (zh) * | 2017-06-07 | 2017-10-10 | 网易（杭州）网络有限公司 | 一种在混合app中确定用户操作记录的方法及装置 |
| CN107450900A (zh) * | 2016-06-01 | 2017-12-08 | 广州市动景计算机科技有限公司 | 一种截图方法及装置 |
| CN107967169A (zh) * | 2017-11-22 | 2018-04-27 | 北京搜狐新媒体信息技术有限公司 | 页面跳转监听方法及装置 |
| CN108536589A (zh) * | 2018-03-26 | 2018-09-14 | 广州小鹏汽车科技有限公司 | 一种应用程序埋点方法及系统 |
| CN110647438A (zh) * | 2019-08-13 | 2020-01-03 | 平安科技（深圳）有限公司 | 事件监控方法、装置、计算机设备和存储介质 |
| CN111901192A (zh) * | 2020-07-15 | 2020-11-06 | 腾讯科技（深圳）有限公司 | 一种页面访问数据的统计方法及装置 |
-
2021
- 2021-11-12 CN CN202111340217.3A patent/CN114064144B/zh active Active
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2002244961A (ja) * | 2001-02-19 | 2002-08-30 | Nec System Technologies Ltd | アクセス経路情報取得方法、トラッキングサーバプログラム及びコンピュータ |
| CN105550187A (zh) * | 2014-11-03 | 2016-05-04 | 阿里巴巴集团控股有限公司 | 单页应用中浏览记录的管理方法及装置 |
| CN107450900A (zh) * | 2016-06-01 | 2017-12-08 | 广州市动景计算机科技有限公司 | 一种截图方法及装置 |
| CN107239546A (zh) * | 2017-06-05 | 2017-10-10 | 成都知道创宇信息技术有限公司 | 一种网页局部内容跟踪与提醒的方法 |
| CN107239389A (zh) * | 2017-06-07 | 2017-10-10 | 网易（杭州）网络有限公司 | 一种在混合app中确定用户操作记录的方法及装置 |
| CN107967169A (zh) * | 2017-11-22 | 2018-04-27 | 北京搜狐新媒体信息技术有限公司 | 页面跳转监听方法及装置 |
| CN108536589A (zh) * | 2018-03-26 | 2018-09-14 | 广州小鹏汽车科技有限公司 | 一种应用程序埋点方法及系统 |
| CN110647438A (zh) * | 2019-08-13 | 2020-01-03 | 平安科技（深圳）有限公司 | 事件监控方法、装置、计算机设备和存储介质 |
| CN111901192A (zh) * | 2020-07-15 | 2020-11-06 | 腾讯科技（深圳）有限公司 | 一种页面访问数据的统计方法及装置 |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114676330A (zh) * | 2022-03-30 | 2022-06-28 | 南京厚建软件有限责任公司 | 一种互联网平台互动数据统一回收的方法 |
| CN114676330B (zh) * | 2022-03-30 | 2023-12-08 | 南京厚建软件有限责任公司 | 一种互联网平台互动数据统一回收的方法 |
| CN115277396A (zh) * | 2022-08-04 | 2022-11-01 | 北京智慧星光信息技术有限公司 | 一种用于模拟浏览器操作的消息驱动方法和系统 |
| CN115277396B (zh) * | 2022-08-04 | 2024-03-26 | 北京智慧星光信息技术有限公司 | 一种用于模拟浏览器操作的消息驱动方法和系统 |
| CN116070053A (zh) * | 2023-03-29 | 2023-05-05 | 杭州实在智能科技有限公司 | 用于信创体系的跨平台rpa浏览器数据采集方法及系统 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN114064144B (zh) | 2024-03-22 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN114064144B (zh) | 一种跨应用数据获取的通信插件以及通信方法 | |
| US7559053B2 (en) | Program and system performance data correlation | |
| US8127000B2 (en) | Method and apparatus for monitoring and synchronizing user interface events with network data | |
| CN107239389B (zh) | 一种在混合app中确定用户操作记录的方法及装置 | |
| WO2001069386A2 (en) | Monitoring operation of and interaction with services provided over a network | |
| CN108874268B (zh) | 用户行为数据的采集方法及装置 | |
| EP1540519A2 (en) | Capturing and presenting site visitation path data | |
| US10084637B2 (en) | Automatic task tracking | |
| CN111752793A (zh) | 系统异常的监控方法、装置、计算机设备及存储介质 | |
| CN111813629A (zh) | 一种Web页面的监控数据生成方法、装置及设备 | |
| CN110163654A (zh) | 一种广告投放数据追踪方法和系统 | |
| CN111177623A (zh) | 信息处理方法及装置 | |
| CN113190512A (zh) | 一种基于埋点技术的电力客户行为数据分析方法 | |
| CN114692049A (zh) | 基于浏览器的录屏方法及装置、电子设备、存储介质 | |
| CN110515821A (zh) | 基于埋点的事件处理方法、电子设备及计算机存储介质 | |
| CN113254320A (zh) | 记录用户网页操作行为的方法及装置 | |
| CN111736740B (zh) | 图片热区生成方法、装置、设备和存储介质 | |
| CN112148606A (zh) | 埋点测试方法、装置、设备及计算机可读介质 | |
| CN112817817B (zh) | 埋点信息查询方法、装置、计算机设备和存储介质 | |
| CN111581067A (zh) | 一种数据采集方法和装置 | |
| KR102054896B1 (ko) | 동적 웹 페이지의 방문자 행동 분석 정보 제공 장치 및 이를 이용한 웹 사이트의 방문자 행동 분석 정보 제공 방법 | |
| CN112905936A (zh) | 页面录制动画生成、页面操作日志查询方法和计算机设备 | |
| CN112905935A (zh) | 页面录制方法、页面录制动画生成方法、设备和存储介质 | |
| CN110674045A (zh) | 信息追踪检测方法、装置以及电子设备、存储介质 | |
| CN115809390A (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 |