CN110659092B - 网页截图方法、装置、计算机设备和存储介质 - Google Patents

网页截图方法、装置、计算机设备和存储介质 Download PDF

Info

Publication number
CN110659092B
CN110659092B CN201910745758.0A CN201910745758A CN110659092B CN 110659092 B CN110659092 B CN 110659092B CN 201910745758 A CN201910745758 A CN 201910745758A CN 110659092 B CN110659092 B CN 110659092B
Authority
CN
China
Prior art keywords
webpage
browser
screenshot
screen
page
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
CN201910745758.0A
Other languages
English (en)
Other versions
CN110659092A (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.)
Shenzhen Saiante Technology Service Co Ltd
Original Assignee
Shenzhen Saiante Technology Service 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 Shenzhen Saiante Technology Service Co Ltd filed Critical Shenzhen Saiante Technology Service Co Ltd
Priority to CN201910745758.0A priority Critical patent/CN110659092B/zh
Publication of CN110659092A publication Critical patent/CN110659092A/zh
Application granted granted Critical
Publication of CN110659092B publication Critical patent/CN110659092B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements 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/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本申请涉及一种基于功能优化的网页截图方法、装置、计算机设备和存储介质。所述方法包括:当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件。调用第二浏览器加载页面文件,得到样本页面,第二浏览器的边框元素的透明度被设置为最大值。通过截取第二浏览器中显示的样本页面,得到目标网页的网页截图。由于第二浏览器可加载目标网页的页面文件,无需利用服务器进行传输,在无网络的情况下,仍可根据针对第一浏览器所显示的目标网页进行截图的指令,在第二浏览器中执行截屏操作,且由于将边框元素的透明度设置成最大值,可获得无浏览器边框内容的目标网页截图,进一步提高了截图操作效率。

Description

网页截图方法、装置、计算机设备和存储介质
技术领域
本申请涉及计算机技术领域,特别是涉及一种网页截图方法、装置、计算机设备和存储介质。
背景技术
随着计算机技术的发展,在各个操作平台上,例如:安卓平台、Windows平台等,均出现了大量优质的应用程序,方便日常的生活、工作等。目前,在应用程序中浏览网页时,通常可以对有价值的内容进行标记、批注、截图等操作,目前,在进行截图时,通过向应用程序服务器发送截图指令,服务器接收到截图指令之后,识别到截图范围,对应用程序中指定的内容进行截图操作。
现有的截图方式是通过终端向服务器发送截图指令,基于网络通信来实现截图操作,但在没有网络时,无法针对本地已有的网页进行截图操作,从而导致截图操作效率较低。
发明内容
基于此,有必要针对上述技术问题,提供一种能够提高截图操作效率的网页截图方法、装置、计算机设备和存储介质。
一种网页截图方法,所述方法包括:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
在其中一个实施例中,所述当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件,包括:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,获取所述目标网页的统一资源定位器地址;
根据所述统一资源定位器地址,从本地存储中查找对应的页面文件。
在其中一个实施例中,所述调用第二浏览器加载所述页面文件,得到样本页面,包括:
调用所述第二浏览器,将所述目标网页的页面文件加载至所述第二浏览器;
根据所述页面文件得到对应的样本页面。
在其中一个实施例中,在所述当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件之后,还包括:
在检测到用于对所述第一浏览器显示的目标网页进行截图的指令之后,在预设时间段内接收到与所述指令对应的截屏起始位置信息和截屏截止位置信息时,根据所述截屏起始位置信息和所述截屏截止位置信息确定与所述目标网页对应的截屏范围。
在其中一个实施例中,所述截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图,包括:
当在检测到第二浏览器中加载的是滚动视图,且根据所述网页截屏范围确定所述网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像帧;
将获得的多个图像帧作为相关图像帧,并根据所述相关图像帧,得到所述目标网页的网页截图。
在其中一个实施例中,所述进行多次录屏,获得多个图像帧,包括:
当在所述第二浏览器的样本页面加载过程中,检测到存在滚动控件时,获得与所述滚动控件对应的预设录屏时延;
根据所述预设录屏时延进行多次录屏,获得多个图像帧。
在其中一个实施例中,所述根据所述相关图像帧,得到所述目标网页的网页截图,包括:
在所述相关图像帧包括两个以上的多个图像帧时,对各所述图像帧进行拼接,获得所述目标网页的网页截图;
获取所述网页截图的图像长度,并将所述图像长度与待截屏长度进行比对,获得长度误差,所述待截屏长度根据所述网页截屏范围确定;
当所述长度误差处于预设误差范围外时,重新对各所述图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各所述图像帧进行拼接得到的网页截图的图像长度,与所述待截屏长度之间的长度误差,处于所述预设误差范围内,将得到的拼接图像作为最终获得的所述目标网页的网页截图。
一种网页截图装置,所述装置包括:
页面文件获取模块,用于当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
样本页面生成模块,用于调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
网页截图生成模块,用于截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,所述处理器执行所述计算机程序时实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
上述网页截图方法、装置、计算机设备和存储介质,当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件,因此可在无网络的情况下,从本地存储中获得待执行截屏操作的目标网页的页面文件。通过调用第二浏览器加载页面文件,得到样本页面,其中,第二浏览器的边框元素的透明度被设置为最大值,并截取第二浏览器中显示的样本页面,得到目标网页的网页截图。由于第二浏览器可加载目标网页的页面文件,无需利用服务器进行传输,在无网络的情况下,仍可根据针对第一浏览器所显示的目标网页进行截图的指令,在第二浏览器中执行截屏操作,且由于将边框元素的透明度设置成最大值,可获得无浏览器边框内容的目标网页截图,进一步提高了截图操作效率。
附图说明
图1为一个实施例中网页截图方法的流程示意图;
图2为另一个实施例中网页截图方法的流程示意图;
图3为一个实施例中网页截图装置的结构框图;
图4为一个实施例中计算机设备的内部结构图。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行进一步详细说明。应当理解,此处描述的具体实施例仅仅用以解释本申请,并不用于限定本申请。
本申请提供的网页截图方法,可以应用于用户终端,具体可以是用户终端的浏览器。其中,当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从用户终端本地存储中获取目标网页的页面文件,并调用第二浏览器加载页面文件,得到样本页面。其中,第二浏览器的边框元素的透明度被设置为最大值。通过截取第二浏览器中显示的样本页面,得到目标网页的网页截图。其中,用户终端可以但不限于是各种个人计算机、笔记本电脑、智能手机以及平板电脑。第一浏览器和第二浏览器为设置在用户终端的浏览器,第一浏览器用于显示目标网页,第二浏览器用于加载从用户终端本地存储中获取的与目标网页对应的页面文件,并进行截图操作。
在一个实施例中,如图1所示,提供了一种网页截图,以该方法应于用户终端为例进行说明,包括以下步骤:
步骤S102,当检测用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件。
其中,用于对第一浏览器显示的模目标网页进行截屏的截屏指令,可以是在本终端上触发,或者由其他关联终端触发的用于截取屏幕显示内容的指令。本终端上触发,可以是由用户通过鼠标点击界面上预设的截屏功能按钮触发,或者用户通过输入设备,比如键盘等输入对应的截屏组合热键触发。由其他关联终端触发,可以是本终端与关联终端之间建立特定关联关系,同时向关联终端开放相应的操作权限,由关联终端向本终端触发截屏指令,进而截取本终端屏幕显示内容。
在终端运行情况下,终端的主窗口也处于运行状态,在终端为Windows系统设备时,主窗口可以为Windows桌面窗口,主进程为主窗口对应的进程。当主窗口运行时,对应的主进程处于运行状态,主进程可监控终端在主窗口下输入的指令,即包括用户通过鼠标点击的功能按钮触发得到的指令,或者用户通过输入设备输入已在系统内注册的组合热键触发的指令。
具体地,当检测到用于对第一浏览器显示的目标网页进行截图的指令时,即当检测到根据用户鼠标点击截屏功能按钮、或用户通过输入设备输入截屏组合热键触发的截屏指令时,获取目标网页的统一资源定位器地址,并根据所获得的统一资源定位器地址,从本地存储中查找对应的页面文件。其中,资源统一定位器地址即URL地址,URL是指对可以从互联网上得到的资源的位置和访问方法的简洁表示,是互联网上标准资源的地址。在进行页面渲染时,资源统一定位器的后缀为\index.html,便于在第二浏览器中渲染网页,在本实施例中,资源统一定位器地址对应的待截屏网页是本地页面,通过资源统一定位器地址,可以实现本地页面的截屏操作。
进一步地,当检测到截屏指令后,根据与截屏指令对应的当前待截屏网页,以及网页截屏范围生成截屏事件,并根据截屏事件,从本地浏览器的存储空间中获取与待截屏网页对应的统一资源定位器地址。由于统一资源定位器地址和网页页面之间是一一对应的关系,可通过加载对应的统一资源定位器地址,确定唯一的网页页面。
在一些实施例中,当在检测到截屏指令后,还包括确定网页截屏范围。通过接收预设时间段内,与截屏指令对应的截屏起始位置信息和截屏截止位置信息,并根据截屏起始位置信息和截屏截止位置信息,来确定网页截屏范围。其中,截屏起始位置和截屏截止位置,可通过分别获取用户自主执行拖动操作的起始点和终止点的位置确定,还可以通过浏览器预先设置提示信息,当用户需执行截屏操作时,浏览器分别给出截屏起始点和截屏终止点,用户根据提示信息先后点击截屏起始点和截屏终止点,确定截屏起始位置和截屏截止位置。
在获得与截屏指令对应的截屏起始位置和截屏截止位置后,分别获取截屏起始位置信息和截屏截止位置信息,包括截屏起始位置坐标数据以及截屏截止位置坐标数据。其中,坐标数据包括横坐标和纵坐标,即包括截屏起始位置横坐标数据和纵坐标数据,以及截屏介质位置横坐标数据和纵坐标数据,继而根据截屏起始位置坐标数据和截屏截止位置坐标数据,可确定网页截屏范围。
步骤S104,调用第二浏览器加载页面文件,得到样本页面;第二浏览器的边框元素的透明度被设置为最大值。
具体地,第二浏览器用于加载第一浏览器显示的目标网页对应的页面文件,可通过从本地存储中获取目标网页的统一资源定位器地址,进而根据统一资源定位器地址,从本地存储中可获得与目标网页对应的页面文件。其中,所获得的统一资源定位器地址为已在第一浏览器中显示的本地页面,无需连接服务器进行获取。其中,第二浏览器可基于本地浏览器内核生成,比如IE内核以及Firefox内核等,通过浏览器内核对统一资源定位器地址对应的资源进行渲染,并加载至第二浏览器中,
其中,由于第二浏览器没有边框显示,可通过窗口属性设置,比如透明度等,实现窗口的显示和隐藏。可通过将第二浏览器的边框元素的透明度设置为最大值,以达到隐藏第二浏览器边框的效果,进而在进行截图操作后,得到的页面截图为网页显示的内容,不会显示第二浏览器的边框内容,避免页面部分内容被遮挡的情况。
步骤S106,截取第二浏览器中显示的样本页面,得到目标网页的网页截图。
具体地,可根据网页截屏范围,确定并获取第二浏览器的相关图像帧,并根据相关图像帧,得到待截屏网页的网页截图。当检测第二浏览器中加载的是滚动视图,且根据网页截屏范围确定网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像,将获得的多个图像帧作为第二浏览器的相关图像帧。当未检测到滚动视图,且根据网页截屏范围确定网页截屏范围对应单个图像帧时,将根据网页截屏范围确定的单个图像帧,作为第二浏览器的相关图像帧。
其中,在第二浏览器的网页页面加载过程中,检测到滚动控件时,可判定第二浏览器中加载的是滚动视图,否则,当未检测到滚动控件时,表明第二浏览器中加载的为非滚动视图。当在第二浏览器的网页页面加载过程中,检测到存在滚动控件时,获得与滚动控件对应的预设录屏时延,并根据预设录屏时延进行多次录屏,获得多个图像帧。其中,录屏时延表示两次录屏操作之间的间隔时间,根据预设录屏时延可控制录屏操作的执行次数和执行间隔。
进一步地,当相关图像帧包括两个以上的多个图像帧时,对各图像帧进行拼接,获得待截屏网页的网页截图,通过获取待截屏网页的网页截图的图像长度,并根据网页截屏范围确定待截屏长度,将图像长度和待截屏长度进行对比,得到长度误差。当长度误差处于预设误差范围内时,将获得的待截屏网页的网页截图确定为最终获得的待截屏网页的网页截图。
当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,获取拼接后的网页截图的图像长度,直至图像长度和待截屏长度之间的长度误差处于预设误差范围内,将获得的待截屏网页的网页截图确定为最终获得的待截屏网页的网页截图。
在一些实施例中,当长度误差处于预设误差范围外时,可重新进行多次录屏,获得多个新的图像帧,并对新获得的多个图像帧进行拼接,获得拼接后的网页截图,并将根据拼接得到的网页截图的图像长度,和待截屏长度进行比对,直至图像长度和待截屏长度之间的长度误差,处于预设误差范围内,并将获得的待截屏网页的网页截图确定为最终获得的待截屏网页的网页截图。
其中,当确定相关图像帧只包括一个图像帧时,将该图像帧作为目标网页的网页截图。
上述网页截图方法中,当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件,因此可在无网络的情况下,从本地存储中获得待执行截屏操作的目标网页的页面文件。通过调用第二浏览器加载页面文件,得到样本页面,其中,第二浏览器的边框元素的透明度被设置为最大值,并截取第二浏览器中显示的样本页面,得到目标网页的网页截图。由于第二浏览器可加载目标网页的页面文件,无需利用服务器进行传输,在无网络的情况下,仍可根据针对第一浏览器所显示的目标网页进行截图的指令,在第二浏览器中执行截屏操作,且由于将边框元素的透明度设置成最大值,可获得无浏览器边框内容的目标网页截图,进一步提高了截图操作效率。
在一个实施例中,如图2所示,根据相关图像帧,得到目标网页的网页截图,包括以下步骤:
步骤S202,在相关图像帧包括两个以上的多个图像帧时,对各图像帧进行拼接,获得目标网页的网页截图。
具体地,相关图像帧可以仅包括一个图像帧,也可以包括两个以上的多个图像帧。当相关图像帧包括两个以上的多个图像帧时,需要对得到的各图像帧进行拼接,以得到目标网页的截图。在拼接过程中,需要考虑相关图像帧之间的关联,包括先后顺序,以及各自的重叠部分是否超出允许的范围等情况。
在一些实施例中,当确定相关图像帧仅包括一个图像帧时,将该图像帧作为目标网页的截图,截图操作完成。
步骤S204,获取网页截图的图像长度,并将图像长度与待截屏长度进行比对,获得长度误差,待截屏长度根据网页截屏范围确定。
步骤S206,当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的目标网页的网页截图。
具体地,在拼接过程中,通过将网页截图的图像长度和待截屏长度进行比对,得到相应的长度误差,当确定长度误差处于预设误差范围内时,表示拼接得到的网页截图,可直接作为目标网页的网页截图。而当当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的目标网页的网页截图。
上述根据相关图像帧,得到目标网页的网页截图的步骤中,在相关图像帧包括两个以上的多个图像帧时,通过对各图像帧进行拼接,获得目标网页的网页截图。继而获取网页截图的图像长度,并将图像长度与待截屏长度进行比对,获得长度误差,当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的目标网页的网页截图,有利于获得更为精确清晰的网页截图,提高截图效率。
在一个实施例中,获得与滚动控件对应的预设录屏时延,包括:
获取滚动控件的长度,以及第二浏览器显示框长度,并根据滚动控件长度和第二浏览器显示框长度,计算目标网页实际长度,进而根据第二浏览器显示框长度和滚动控件的长度,确定滚动控件滑动速度,根据滚动控件滑动速度和第二浏览器显示框长度,可确定预设录屏时延。
其中,滚动控件包括水平滚动条控件和垂直滚动条控件,可通过判断滚动控件的类型,并获取对应类型的滚动控件的长度。其中,滚动条中有一个滚动块,用于标识滚动条当前滚动的位置,可以通过拖动滚动块,或用鼠标点击滚动条某一位置使滚动块移动。从滚动条的创建形式来分,包括标准滚动条和滚动条控件两种,其中,标准滚动条不是一个独立的窗口,而是这些窗口的一部分,而滚动条控件是一个独立的窗口,可以获得焦点,并响应用户操作。
具体地,用户可通过对第二浏览器进行窗口属性设置,实现窗口的显示和隐藏,其中当根据窗口属性设置显示当前第二浏览器,并获取用户输入的窗口属性中的窗口显示框长度。通过计算获得的滚动控件的长度,以及第二浏览器显示框长度之间的差值,得到待截屏网页实际长度。其中,待截屏网页实际长度小于第二浏览器显示框长度。
进一步地,根据滚动控件的长度和第二浏览器显示框长度,可确定滚动控件在第二浏览器进行滑动时的速度。在获得滚动控件滑动速度后,根据滚动控件滑动速度,以及第二浏览器显示框长度,判断适合进行录屏操作的时间点,该适合进行录屏操作的时间点表示,多次执行录屏操作得到的图像帧进行拼接时,各图像帧之间重叠部分减少,得到更为精确的网页截图,即两个适合执行录屏操作的时间点之间的间隔,即为预设录屏时延。
上述步骤,通过获取滚动控件的长度,以及第二浏览器显示框长度,并根据滚动控件长度和第二浏览器显示框长度,计算目标网页实际长度,进而根据第二浏览器显示框长度和滚动控件的长度,确定滚动控件滑动速度,根据滚动控件滑动速度和第二浏览器显示框长度,可确定预设录屏时延。根据预设录屏时延可以确定录屏操作执行间隔,实现对待截屏网页的自动截屏,可以提高截屏操作效率。
在一个实施例中,在得到目标网页的网页截图后,还包括:
绘制画布,并将待截屏网页的网页截图显示在绘制的画布中;
为画布设置工具栏;工具栏包括分享、裁剪和本地保存。
具体地,在从第二浏览器中获得图像帧后,通过绘制canvas画布,并将根据获得的图像帧生成的网页截图展示在canvas画布中。通过调用js函数,可为canvas画布设置网页截图处理的工具栏,包括分享栏,可将获得的网页截图分享至微信或者微博等应用软件,或者分享至云端进行存储。裁剪栏用于对获得的网页截图进行裁剪,获得符合用户需求的相应截图大小。本地存储栏可将获得的网页截图保存至本地的存储空间。
上述步骤,通过将待截屏网页的网页截图显示在绘制的画布中,并为画布设置相应的工具栏,实现了屏幕截图对用户的展示过程,方便用户利用工具栏及时对屏幕截图进行进一步操作,避免多次重复进行截屏操作,获得更为符合要求的屏幕截图,进一步提高屏幕截图操作效率。
应该理解的是,虽然图1-2的流程图中的各个步骤按照箭头的指示依次显示,但是这些步骤并不是必然按照箭头指示的顺序依次执行。除非本文中有明确的说明,这些步骤的执行并没有严格的顺序限制,这些步骤可以以其它的顺序执行。而且,图1-2中的至少一部分步骤可以包括多个子步骤或者多个阶段,这些子步骤或者阶段并不必然是在同一时刻执行完成,而是可以在不同的时刻执行,这些子步骤或者阶段的执行顺序也不必然是依次进行,而是可以与其它步骤或者其它步骤的子步骤或者阶段的至少一部分轮流或者交替地执行。
在一个实施例中,如图3所示,提供了一种网页截图装置,包括:页面文件获取模块302、样本页面生成模块304以及网页截图生成模块306,其中:
页面文件获取模块302,用于当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件.
样本页面生成模块304,用于调用第二浏览器加载页面文件,得到样本页面;第二浏览器的边框元素的透明度被设置为最大值。
网页截图生成模块306,用于截取第二浏览器中显示的样本页面,得到目标网页的网页截图。
上述网页截图装置,当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件,因此可在无网络的情况下,从本地存储中获得待执行截屏操作的目标网页的页面文件。通过调用第二浏览器加载页面文件,得到样本页面,其中,第二浏览器的边框元素的透明度被设置为最大值,并截取第二浏览器中显示的样本页面,得到目标网页的网页截图。由于第二浏览器可加载目标网页的页面文件,无需利用服务器进行传输,在无网络的情况下,仍可根据针对第一浏览器所显示的目标网页进行截图的指令,在第二浏览器中执行截屏操作,且由于将边框元素的透明度设置成最大值,可获得无浏览器边框内容的目标网页截图,进一步提高了截图操作效率。
在一个实施例中,提供了一种网页截屏装置,包括网页截屏范围确定模块,用于:
检测到截屏指令;获取截屏指令对应的当前页面的页面范围;将截屏指令对应的当前页面的页面范围,确定为网页截屏范围。
在一个实施例中,网页截屏范围确定模块还用于:
在检测到截屏指令之后,在预设时间段内接收到与截屏指令对应的截屏起始位置信息和截屏截止位置信息时,根据截屏起始位置信息和截屏截止位置信息确定网页截屏范围。
在一个实施例中,相关图像帧获取模块还用于:
在检测到第二浏览器中加载的是滚动视图,且根据网页截屏范围确定网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像帧,并将获得的多个图像帧作为相关图像帧。
在一个实施例中,录屏单元用于:
当在第二浏览器的网页页面加载过程中,检测到存在滚动控件时,获得与滚动控件对应的预设录屏时延;根据预设录屏时延进行多次录屏,获得多个图像帧。
在一个实施例中,预设录屏时延获取单元用于:
获取滚动控件的长度;获取第二浏览器显示框长度,根据滚动控件的长度和第二浏览器显示框长度,计算待截屏网页实际长度;根据第二浏览器显示框长度和滚动控件的长度,确定滚动控件滑动速度;根据滚动控件滑动速度,确定预设录屏时延。
在一个实施例中,网页截图获得模块用于:
在相关图像帧包括两个以上的多个图像帧时,对各图像帧进行拼接,获得待截屏网页的网页截图;获取网页截图的图像长度,并将图像长度与待截屏长度进行比对,获得长度误差,待截屏长度根据网页截屏范围确定;
当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的待截屏网页的网页截图。
在一个实施例中,网页截图装置还包括画布设置模块,用于:
绘制画布,并将待截屏网页的网页截图显示在绘制的画布中;
为画布设置工具栏;工具栏包括分享、裁剪和本地保存。
关于网页截图装置的具体限定可以参见上文中对于网页截图方法的限定,在此不再赘述。上述网页截图装置中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中,也可以以软件形式存储于计算机设备中的存储器中,以便于处理器调用执行以上各个模块对应的操作。
在一个实施例中,提供了一种计算机设备,该计算机设备可以是终端,其内部结构图可以如图4所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口、显示屏和输入装置。其中,该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统和计算机程序。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序被处理器执行时以实现一种网页截图方法。该计算机设备的显示屏可以是液晶显示屏或者电子墨水显示屏,该计算机设备的输入装置可以是显示屏上覆盖的触摸层,也可以是计算机设备外壳上设置的按键、轨迹球或触控板,还可以是外接的键盘、触控板或鼠标等。
本领域技术人员可以理解,图4中示出的结构,仅仅是与本申请方案相关的部分结构的框图,并不构成对本申请方案所应用于其上的计算机设备的限定,具体的计算机设备可以包括比图中所示更多或更少的部件,或者组合某些部件,或者具有不同的部件布置。
在一个实施例中,提供了一种计算机设备,包括存储器和处理器,该存储器存储有计算机程序,该处理器执行计算机程序时实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件;
调用第二浏览器加载页面文件,得到样本页面;第二浏览器的边框元素的透明度被设置为最大值;
截取第二浏览器中显示的样本页面,得到目标网页的网页截图。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,获取目标网页的统一资源定位器地址;
根据统一资源定位器地址,从本地存储中查找对应的页面文件。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
调用第二浏览器,将目标网页的页面文件加载至第二浏览器;
根据页面文件得到对应的样本页面。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
在检测到用于对第一浏览器显示的目标网页进行截图的指令之后,在预设时间段内接收到与指令对应的截屏起始位置信息和截屏截止位置信息时,根据截屏起始位置信息和截屏截止位置信息确定与目标网页对应的截屏范围。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
当在检测到第二浏览器中加载的是滚动视图,且根据网页截屏范围确定网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像帧;
将获得的多个图像帧作为相关图像帧,并根据相关图像帧,得到目标网页的网页截图。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
当在第二浏览器的样本页面加载过程中,检测到存在滚动控件时,获得与滚动控件对应的预设录屏时延;
根据预设录屏时延进行多次录屏,获得多个图像帧。
在一个实施例中,处理器执行计算机程序时还实现以下步骤:
在相关图像帧包括两个以上的多个图像帧时,对各图像帧进行拼接,获得目标网页的网页截图;
获取网页截图的图像长度,并将图像长度与待截屏长度进行比对,获得长度误差,待截屏长度根据网页截屏范围确定;
当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的目标网页的网页截图。
在一个实施例中,提供了一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取目标网页的页面文件;
调用第二浏览器加载页面文件,得到样本页面;第二浏览器的边框元素的透明度被设置为最大值;
截取第二浏览器中显示的样本页面,得到目标网页的网页截图。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,获取目标网页的统一资源定位器地址;
根据统一资源定位器地址,从本地存储中查找对应的页面文件。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
调用第二浏览器,将目标网页的页面文件加载至第二浏览器;
根据页面文件得到对应的样本页面。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
在检测到用于对第一浏览器显示的目标网页进行截图的指令之后,在预设时间段内接收到与指令对应的截屏起始位置信息和截屏截止位置信息时,根据截屏起始位置信息和截屏截止位置信息确定与目标网页对应的截屏范围。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
当在检测到第二浏览器中加载的是滚动视图,且根据网页截屏范围确定网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像帧;
将获得的多个图像帧作为相关图像帧,并根据相关图像帧,得到目标网页的网页截图。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
当在第二浏览器的样本页面加载过程中,检测到存在滚动控件时,获得与滚动控件对应的预设录屏时延;
根据预设录屏时延进行多次录屏,获得多个图像帧。
在一个实施例中,计算机程序被处理器执行时还实现以下步骤:
在相关图像帧包括两个以上的多个图像帧时,对各图像帧进行拼接,获得目标网页的网页截图;
获取网页截图的图像长度,并将图像长度与待截屏长度进行比对,获得长度误差,待截屏长度根据网页截屏范围确定;
当长度误差处于预设误差范围外时,重新对各图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各图像帧进行拼接得到的网页截图的图像长度,与待截屏长度之间的长度误差,处于预设误差范围内,将得到的拼接图像作为最终获得的目标网页的网页截图。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于一非易失性计算机可读取存储介质中,该计算机程序在执行时,可包括如上述各方法的实施例的流程。其中,本申请所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用,均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(ROM)、可编程ROM(PROM)、电可编程ROM(EPROM)、电可擦除可编程ROM(EEPROM)或闪存。易失性存储器可包括随机存取存储器(RAM)或者外部高速缓冲存储器。作为说明而非局限,RAM以多种形式可得,诸如静态RAM(SRAM)、动态RAM(DRAM)、同步DRAM(SDRAM)、双数据率SDRAM(DDRSDRAM)、增强型SDRAM(ESDRAM)、同步链路(Synchlink)DRAM(SLDRAM)、存储器总线(Rambus)直接RAM(RDRAM)、直接存储器总线动态RAM(DRDRAM)、以及存储器总线动态RAM(RDRAM)等。
以上实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本申请的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本申请构思的前提下,还可以做出若干变形和改进,这些都属于本申请的保护范围。因此,本申请专利的保护范围应以所附权利要求为准。

Claims (10)

1.一种网页截图方法,所述方法包括:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
2.根据权利要求1所述的方法,其特征在于,所述当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件,包括:
当检测到用于对第一浏览器显示的目标网页进行截图的指令时,获取所述目标网页的统一资源定位器地址;
根据所述统一资源定位器地址,从本地存储中查找对应的页面文件。
3.根据权利要求1所述的方法,其特征在于,所述调用第二浏览器加载所述页面文件,得到样本页面,包括:
调用所述第二浏览器,将所述目标网页的页面文件加载至所述第二浏览器;
根据所述页面文件得到对应的样本页面。
4.根据权利要求1所述的方法,其特征在于,在所述当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件之后,还包括:
在检测到用于对所述第一浏览器显示的目标网页进行截图的指令之后,在预设时间段内接收到与所述指令对应的截屏起始位置信息和截屏截止位置信息时,根据所述截屏起始位置信息和所述截屏截止位置信息确定与所述目标网页对应的截屏范围。
5.根据权利要求4所述的方法,其特征在于,所述截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图,包括:
当在检测到第二浏览器中加载的是滚动视图,且根据所述网页截屏范围确定所述网页截屏范围对应多个图像帧时,进行多次录屏,获得多个图像帧;
将获得的多个图像帧作为相关图像帧,并根据所述相关图像帧,得到所述目标网页的网页截图。
6.根据权利要求5所述的方法,其特征在于,所述进行多次录屏,获得多个图像帧,包括:
当在所述第二浏览器的样本页面加载过程中,检测到存在滚动控件时,获得与所述滚动控件对应的预设录屏时延;
根据所述预设录屏时延进行多次录屏,获得多个图像帧。
7.根据权利要求5所述的方法,其特征在于,所述根据所述相关图像帧,得到所述目标网页的网页截图,包括:
在所述相关图像帧包括两个以上的多个图像帧时,对各所述图像帧进行拼接,获得所述目标网页的网页截图;
获取所述网页截图的图像长度,并将所述图像长度与待截屏长度进行比对,获得长度误差,所述待截屏长度根据所述网页截屏范围确定;
当所述长度误差处于预设误差范围外时,重新对各所述图像帧进行拼接,或重新进行多次录屏获得多个图像帧,直至对各所述图像帧进行拼接得到的网页截图的图像长度,与所述待截屏长度之间的长度误差,处于所述预设误差范围内,将得到的拼接图像作为最终获得的所述目标网页的网页截图。
8.一种网页截图装置,其特征在于,所述装置包括:
页面文件获取模块,用于当检测到用于对第一浏览器显示的目标网页进行截图的指令时,从本地存储中获取所述目标网页的页面文件;
样本页面生成模块,用于调用第二浏览器加载所述页面文件,得到样本页面;所述第二浏览器的边框元素的透明度被设置为最大值;
网页截图生成模块,用于截取所述第二浏览器中显示的所述样本页面,得到所述目标网页的网页截图。
9.一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至7中任一项所述方法的步骤。
10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至7中任一项所述的方法的步骤。
CN201910745758.0A 2019-08-13 2019-08-13 网页截图方法、装置、计算机设备和存储介质 Active CN110659092B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910745758.0A CN110659092B (zh) 2019-08-13 2019-08-13 网页截图方法、装置、计算机设备和存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910745758.0A CN110659092B (zh) 2019-08-13 2019-08-13 网页截图方法、装置、计算机设备和存储介质

Publications (2)

Publication Number Publication Date
CN110659092A CN110659092A (zh) 2020-01-07
CN110659092B true CN110659092B (zh) 2023-05-02

Family

ID=69037690

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910745758.0A Active CN110659092B (zh) 2019-08-13 2019-08-13 网页截图方法、装置、计算机设备和存储介质

Country Status (1)

Country Link
CN (1) CN110659092B (zh)

Families Citing this family (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112380478A (zh) * 2020-11-17 2021-02-19 平安养老保险股份有限公司 网页截图方法、装置、计算机设备及计算机可读存储介质
CN112637624B (zh) * 2020-12-14 2023-07-18 广州繁星互娱信息科技有限公司 直播流处理方法、装置、设备及存储介质
CN112596833B (zh) * 2020-12-21 2024-08-20 三六零数字安全科技集团有限公司 网页截图生成方法、装置、设备以及存储介质
CN113448470B (zh) * 2021-06-07 2024-04-26 多益网络有限公司 一种网页长截图方法、装置、设备和存储介质
CN113254018B (zh) * 2021-07-14 2021-11-02 广州易方信息科技股份有限公司 网页视图的自动化操作方法及装置
CN113805984B (zh) * 2021-08-05 2024-02-06 厦门市美亚柏科信息股份有限公司 一种动态网页截图方法、终端设备及存储介质

Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102142016A (zh) * 2010-01-29 2011-08-03 微软公司 跨浏览器交互活动记录、回放以及编辑
CN103577187A (zh) * 2013-10-15 2014-02-12 中兴通讯股份有限公司 一种实现网页截图的方法及相关设备
WO2017111712A1 (en) * 2015-12-23 2017-06-29 Turkcell Teknoloji Arastirma Ve Gelistirme Anonim Sirketi A system and method for capturing, storing, sharing page contents in the form of screenshot
WO2018041087A1 (zh) * 2016-08-29 2018-03-08 中兴通讯股份有限公司 一种屏幕截图的方法及装置
CN107924420A (zh) * 2015-09-02 2018-04-17 三星电子株式会社 对包括在网页的屏幕截图中的链接进行标记的方法和设备
CN108279966A (zh) * 2018-02-13 2018-07-13 广东欧珀移动通信有限公司 网页截图方法、装置、终端及存储介质
CN108959605A (zh) * 2018-07-13 2018-12-07 彩讯科技股份有限公司 用于网页的截图方法、装置、计算机设备和存储介质
CN110020231A (zh) * 2017-07-25 2019-07-16 阿里巴巴集团控股有限公司 网页截图方法及其装置

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100211865A1 (en) * 2009-02-19 2010-08-19 Microsoft Corporation Cross-browser page visualization generation
US11232250B2 (en) * 2013-05-15 2022-01-25 Microsoft Technology Licensing, Llc Enhanced links in curation and collaboration applications
US20170104818A1 (en) * 2015-10-07 2017-04-13 Calgary Scientific Inc. Methods and systems for selectively sharing content over a communication connection
US10542123B2 (en) * 2016-05-23 2020-01-21 Usabilla B.V. System and method for generating and monitoring feedback of a published webpage as implemented on a remote client
US10783320B2 (en) * 2017-05-16 2020-09-22 Apple Inc. Device, method, and graphical user interface for editing screenshot images

Patent Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102142016A (zh) * 2010-01-29 2011-08-03 微软公司 跨浏览器交互活动记录、回放以及编辑
CN103577187A (zh) * 2013-10-15 2014-02-12 中兴通讯股份有限公司 一种实现网页截图的方法及相关设备
CN107924420A (zh) * 2015-09-02 2018-04-17 三星电子株式会社 对包括在网页的屏幕截图中的链接进行标记的方法和设备
WO2017111712A1 (en) * 2015-12-23 2017-06-29 Turkcell Teknoloji Arastirma Ve Gelistirme Anonim Sirketi A system and method for capturing, storing, sharing page contents in the form of screenshot
WO2018041087A1 (zh) * 2016-08-29 2018-03-08 中兴通讯股份有限公司 一种屏幕截图的方法及装置
CN110020231A (zh) * 2017-07-25 2019-07-16 阿里巴巴集团控股有限公司 网页截图方法及其装置
CN108279966A (zh) * 2018-02-13 2018-07-13 广东欧珀移动通信有限公司 网页截图方法、装置、终端及存储介质
CN108959605A (zh) * 2018-07-13 2018-12-07 彩讯科技股份有限公司 用于网页的截图方法、装置、计算机设备和存储介质

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
搜狗浏览器快速截图离线截图方法;未知;《https://www.liulanqi.net/sogou/189.html》;20140912;全文 *

Also Published As

Publication number Publication date
CN110659092A (zh) 2020-01-07

Similar Documents

Publication Publication Date Title
CN110659092B (zh) 网页截图方法、装置、计算机设备和存储介质
CN110209652B (zh) 数据表迁移方法、装置、计算机设备和存储介质
WO2020151333A1 (zh) 页面加载方法、装置、计算机设备和存储介质
CN110209966B (zh) 一种网页刷新方法、网页系统及电子设备
CN107590228B (zh) 一种页面内容处理方法及移动终端
CN105786352A (zh) 快速定位页面内容的方法、装置及移动终端
CN107679214B (zh) 链接定位方法、装置、终端与计算机可读存储介质
CN111898336B (zh) 弹幕显示方法、装置、计算机设备及存储介质
WO2020258650A1 (zh) 页面信息显示方法、装置、计算机设备和存储介质
CN107038194B (zh) 一种页面跳转方法和装置
CN110888709A (zh) 监控屏的智能操作方法、装置、计算机设备和存储介质
CN111859224A (zh) 基于节点服务器的服务端渲染方法、装置和计算机设备
CN111090797B (zh) 数据获取方法、装置、计算机设备和存储介质
CN107045546B (zh) 一种网页处理方法、装置及智能终端
CN110704095A (zh) 基于工作流的配置处理方法、装置、计算机设备和存储介质
CN112612988A (zh) 页面处理方法、装置、计算机设备及存储介质
CN104881273A (zh) 一种网页渲染的分析方法和终端设备
CN111431767B (zh) 多浏览器资源同步方法、装置、计算机设备和存储介质
CN110659435A (zh) 页面数据采集处理方法、装置、计算机设备和存储介质
US10152546B2 (en) Method, system and terminal for performing search in a browser
CN112130729A (zh) 页面处理方法、装置、计算机设备和存储介质
CN112667326A (zh) 弹窗页面的展示方法、装置、计算机设备和存储介质
CN107102937B (zh) 一种用户界面测试方法和装置
CN110659188A (zh) 页面画像数据处理方法、装置、计算机设备和存储介质
CN113032078A (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
TA01 Transfer of patent application right

Effective date of registration: 20210128

Address after: 518066 Room 201, building A, No. 1, Qian Wan Road, Qianhai Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong (Shenzhen Qianhai business secretary Co., Ltd.)

Applicant after: Shenzhen saiante Technology Service Co.,Ltd.

Address before: 1-34 / F, Qianhai free trade building, 3048 Xinghai Avenue, Mawan, Qianhai Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong 518000

Applicant before: Ping An International Smart City Technology Co.,Ltd.

TA01 Transfer of patent application right
GR01 Patent grant
GR01 Patent grant