CN113448470A - 一种网页长截图方法、装置、设备和存储介质 - Google Patents
一种网页长截图方法、装置、设备和存储介质 Download PDFInfo
- Publication number
- CN113448470A CN113448470A CN202110629401.3A CN202110629401A CN113448470A CN 113448470 A CN113448470 A CN 113448470A CN 202110629401 A CN202110629401 A CN 202110629401A CN 113448470 A CN113448470 A CN 113448470A
- Authority
- CN
- China
- Prior art keywords
- browser
- webpage
- screen
- screenshot
- size
- 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
- 238000000034 method Methods 0.000 title claims abstract description 40
- 230000004044 response Effects 0.000 claims abstract description 7
- 238000004590 computer program Methods 0.000 claims description 22
- 238000001514 detection method Methods 0.000 claims description 3
- 230000006870 function Effects 0.000 description 7
- 230000006872 improvement Effects 0.000 description 6
- 230000008569 process Effects 0.000 description 6
- 238000010586 diagram Methods 0.000 description 5
- 230000011218 segmentation Effects 0.000 description 5
- 230000008859 change Effects 0.000 description 4
- 238000005192 partition Methods 0.000 description 4
- 230000001413 cellular effect Effects 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 238000009792 diffusion process Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000012806 monitoring device Methods 0.000 description 1
- 238000012544 monitoring process Methods 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
Images
Classifications
-
- 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/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
- G06F3/0483—Interaction with page-structured environments, e.g. book metaphor
-
- 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
- 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/0485—Scrolling or panning
Abstract
本发明公开了一种网页长截图方法,包括:响应于网页长截图指令,获取浏览器中网页的网页尺寸;将浏览器的页面窗口的尺寸设置为网页尺寸,以使网页完全展示在页面窗口;响应于浏览器的滑动操作,控制浏览器随着滑动操作滑动;在浏览器滑动时,按照预设的截图规则对浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;将局部网页图像按照预设的拼接规则对局部网页图像进行拼接,得到网页的长截图。本发明还公开了一种网页长截图装置、设备和存储介质。采用本发明实施例,无需通过自动滚屏接口就能实现网页的长截屏,适用性广。
Description
技术领域
本发明涉及图像处理技术领域,尤其涉及一种网页长截图方法、装置、设备和存储介质。
背景技术
用户在使用终端浏览器浏览网页时,基于自身需求,需要对网页进行长截图以实现对网页中的信息记录保存,以便后续对网页中信息的查看或使用。目前的长截图方式为通过自动滚屏接口实现网页的自动滑动截屏并拼接所有图片,得到网页长截屏图像,实现同一网页的信息存放在长截屏图片中以便后续对网页信息的查看或使用,但是这种方式需要终端设备配备自动滚屏接口才能实现,适用性较低,对于不具备自动滚屏接口的终端设备,比如IOS系统设备,则无法实现网页长截屏功能。
发明内容
本发明实施例的目的是提供一种网页长截图方法、装置、设备和存储介质,无需通过自动滚屏接口就能实现网页的长截屏,适用性广。
为实现上述目的,本发明实施例提供了一种网页长截图方法,包括:
响应于网页长截图指令,获取浏览器中网页的网页尺寸;
将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
作为上述方案的改进,所述控制所述浏览器随着所述滑动操作滑动,具体包括:
获取所述浏览器呈现在屏幕上的当前位置;
以所述当前位置为滑动起点,按照所述滑动操作进行滑动;其中,所述滑动操作包括全方位滑动操作、纵向滑动和横向滑动。
作为上述方案的改进,所述截图规则包括:
获取屏幕可用尺寸,以所述屏幕可用尺寸作为参考尺寸对所述浏览器进行分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
以所述屏幕的初始显示界面进行截图操作;
根据所述浏览器的滑动操作采用对应的截图操作。
作为上述方案的改进,所述截图规则还包括:
获取所述屏幕可用尺寸;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
基于所述网页尺寸和所述屏幕可用尺寸,将所述浏览器进行均等分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述分割窗口的尺寸小于或等于所述屏幕可用尺寸。
以所述屏幕的初始显示界面进行截图操作;
根据所述浏览器的滑动操作采用对应的截图操作。
作为上述方案的改进,当所述浏览器纵向滑动时,所述根据所述浏览器的滑动操作采用对应的截图操作,包括:
检测在所述屏幕中出现的横向分割线,当所述横向分割线与所述屏幕的可用区域的底部重合时,以所述屏幕的当前显示界面进行截图操作;
当所述屏幕的可用区域的底部和所述浏览器的横向边界线重合时,以所述屏幕的当前显示界面进行截图操作;则,所述长截图停止条件为:接收到长截图停止指令,或者所述浏览器滑动到所述浏览器的底部。
作为上述方案的改进,当所述浏览器横向滑动时,所述根据所述浏览器的滑动操作采用对应的截图操作,包括:
检测在所述屏幕中出现的纵向分割线,当所述纵向分割线与所述屏幕的可用区域的右侧重合时,以所述屏幕的当前显示界面进行截图操作;
当所述屏幕的可用区域的右侧和所述浏览器的纵向边界线重合时,以所述屏幕的当前显示界面进行截图操作;其中,所述长截图停止条件为:接收到长截图停止指令或所述浏览器滑动到所述浏览器的右侧纵向边界线。
作为上述方案的改进,所述拼接规则包括:
对所述局部网页图像的内容进行重复性检测;
当检测到重复的图像区域时,采用图像覆盖拼接的方式对存在重复的图像区域的局部网页图像进行拼接;
当没有检测到重复的图像区域时,直接拼接。
为实现上述目的,本发明实施例还提供一种网页长截图装置,包括:
网页尺寸获取模块,用于响应于网页长截图指令,获取浏览器中网页的网页尺寸;
页面窗口尺寸设置模块,用于将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
浏览器滑动控制模块,用于响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
局部网页图像生成模块,用于在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
局部网页图像拼接模块,用于将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
为实现上述目的,本发明实施例还提供一种网页长截图设备,其特征在于,包括处理器、存储器以及存储在所述存储器中且被配置为由所述处理器执行的计算机程序,所述处理器执行所述计算机程序时实现如上述任一实施例所述的网页长截图方法。
为实现上述目的,本发明实施例还提供一种计算机可读存储介质,其特征在于,所述计算机可读存储介质包括存储的计算机程序,其中,在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行如上述任一实施例所述的网页长截图方法。
相比于现有技术,本发明实施例公开的一种网页长截图方法、装置、设备和存储介质,通过响应网页长截图指令,来获取浏览器中网页的网页尺寸,进而将所述浏览器的页面窗口的尺寸设置成所述网页尺寸,使得所述网页完全展示在所述页面窗口,通过响应浏览器的滑动操作,来控制所述浏览器随着滑动操作滑动,并在所述浏览器滑动时,通过按照预设的截图规则对所述浏览器进行截图,以生成局部网页图像,直至达到预设的长截图停止条件,再通过将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。由此可见,本发明实施例能够根据待截图的网页的网页尺寸对浏览器的大小进行调节,使得该网页的内容能够完整地展示在浏览器中,无需滑动网页,而是通过滑动浏览器,再对浏览器进行滑动截屏后进行图片的拼接,从而实现了不具备自动滚屏接口的设备也能够对网页进行长截图,同时,也解决了现有技术中通过网页滑动来实现长截屏所带来的对浏览器的工具栏或者浮窗等非网页内容被多次捕捉的问题。
附图说明
图1是本发明实施例提供的一种网页长截图方法的流程图;
图2是本发明实施例提供的一种网页长截图装置的结构示意图;
图3是本发明实施例提供的一种网页长截图设备的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
参见图1,图1是本发明实施例提供的一种网页长截图方法的流程图。
所述网页长截图方法可以通过用户端执行,所述用户端可以为电脑、手机、平板等用户终端设备;其中,所述用户端上可以装载有各种应用程序,包括图片处理类的应用程序,并用于屏幕画面的截取。作为举例,所述用户端可以包括显示屏和处理器,该显示屏用于呈现浏览器的界面,该浏览器的界面用于呈现网页内容,以及与玩家进行交互;该处理器用于获取网页内容,在浏览器的界面中呈现网页内容以及控制浏览器在显示屏上的显示。
具体地,所述网页长截图方法包括:
S11、响应于网页长截图指令,获取浏览器中网页的网页尺寸;
S12、将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
S13、响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
S14、在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
S15、将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
值得说明的是,一个网页的展示,从外到内的容器为:屏幕、浏览器和网页本身,浏览器包括页面窗口,进一步地,浏览器还可包括工具栏,在此不作限定;网页内容展现在网页内,网页展现在浏览器的页面窗口内,而浏览器展现在屏幕内;网页尺寸为待截图的整个网页的页面尺寸,从所述网页的顶部到所述网页的底部的距离为网页高度,从所述网页的左侧边缘到所述网页的右侧边缘的距离为网页宽度,所述网页尺寸包括所述网页高度和所述网页宽度。
浏览器的尺寸可以与屏幕可用尺寸可以相同,也可以不同,网页尺寸与浏览器的页面窗口的尺寸可以相同,也可以不相同,在实际应用中,大多数的网页尺寸大于浏览器的页面窗口的尺寸,因此,在使用浏览器浏览页面时,通常采用浏览器中的滚动条来控制网页在浏览器中的滑动来进行展示。
屏幕包括屏幕可用区域和屏幕任务栏区域,当屏幕任务栏隐藏时,屏幕的整个区域都是屏幕可用区域,屏幕可用尺寸等于屏幕尺寸,当屏幕任务栏不隐藏时,屏幕尺寸包括屏幕可用尺寸和屏幕任务栏尺寸;为了提高用户的使用体验感,一般情况下,现有的手机设备的浏览器的尺寸与屏幕可用尺寸是相同的,但是并不排除存在浏览器的尺寸与屏幕可用尺寸不相同的情况,在使用现有的手机设备中的浏览器浏览网页时,一般情况下,浏览器的尺寸与屏幕可用尺寸相匹配,并且通常会自动将网页尺寸进行调整,使得网页宽度与浏览器的宽度相匹配,只需上下滑动网页即可通过屏幕浏览网页内容。
可以理解的是,本发明中的所有尺寸指的是当前分辨率下的高度和宽度,而不是物理上的高度和宽度。
在步骤S11中,作为举例地,网页长截图指令的输入可通过触屏操作输入,可以通过按键输入,也可以通过手势识别输入等,在此不作限定;
示例性的,在步骤S12中,设定浏览器的页面窗口的原先的尺寸为1284×2778,网页尺寸为1284×4000;根据网页尺寸1284×4000,将浏览器的页面窗口的尺寸从1284×2778重新设置成1284×4000,以使整个网页能够完整地展示在浏览器的页面窗口处。
在步骤S13中,可以理解的,当屏幕可用尺寸小于浏览器的尺寸时,浏览器不能在屏幕中完全展示出来,只能通过滑动浏览器,以改变浏览器的位置,才能使得浏览器通过屏幕被完全展示,但是在每一个时刻,浏览器都不能被完整展示。
在步骤S14中,通过滑动浏览器,使得完全展示在浏览器中的网页随着浏览器的滑动而在屏幕中展示,并且在浏览器滑动过程中进行截图,生成了局部网页图像。可以理解的,相对于屏幕,浏览器滑动了,浏览器的位置随着滑动发生了变化;相对于浏览器,网页并没有发生滑动,浏览器和网页之间的位置关系没有发生变化。
本发明实施例公开的一种网页长截图方法,通过响应网页长截图指令,来获取浏览器中网页的网页尺寸,进而将所述浏览器的页面窗口的尺寸设置成所述网页尺寸,使得所述网页完全展示在所述页面窗口,通过响应浏览器的滑动操作,来控制所述浏览器随着滑动操作滑动,并在所述浏览器滑动时,通过按照预设的截图规则对所述浏览器进行截图,以生成局部网页图像,直至达到预设的长截图停止条件,再通过将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。由此可见,本发明实施例能够根据待截图的网页的网页尺寸对浏览器的大小进行调节,使得该网页的内容能够完整地展示在浏览器中,无需滑动网页,而是通过滑动浏览器,再对浏览器进行滑动截屏后进行图片的拼接,从而实现了不具备自动滚屏接口的设备也能够对网页进行长截图,同时,也解决了现有技术中通过网页滑动来实现长截屏所带来的对浏览器的工具栏或者浮窗等非网页内容被多次捕捉的问题。
在一种实施方式中,基于步骤S11~S15,步骤S13中的所述控制所述浏览器随着所述滑动操作滑动,具体包括步骤S131~S132:
S131、获取所述浏览器呈现在屏幕上的当前位置;
S132、以所述当前位置为滑动起点,按照所述滑动操作进行滑动;其中,所述滑动操作包括全方位滑动操作、纵向滑动和横向滑动。
可以理解的,当用户需要对网页中的信息进行截图保存时,一般情况下,屏幕当前显示的内容是用户需要进行保存的内容的起点,而屏幕当前显示的内容之前的内容不是用户需要保存的内容,因此,以浏览器呈现在屏幕上的当前位置作为滑动起点进行滑动。
在一种实施方式中,基于步骤S11~S15,步骤S14中的截图规则包括步骤S141a~S143a:
S141a、获取屏幕可用尺寸,以所述屏幕可用尺寸作为参考尺寸对所述浏览器进行分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
S142a、以所述屏幕的初始显示界面进行截图操作;
S143a、根据所述浏览器的滑动操作采用对应的截图操作。
可以理解的,若以所述浏览器的左上角为分割起点,按照从左到右、从上而下的分割顺序进行所述浏览器的分割,则:当所述浏览器的高度是所述屏幕的可用高度的整数倍,且所述浏览器的宽度是所述屏幕的可用宽度的整数倍时,以所述屏幕可用尺寸作为参考尺寸对所述浏览器进行分割,得到的所有分割窗口的尺寸是相同的,都等于屏幕可用尺寸;当所述浏览器的高度不是所述屏幕的可用高度的整数倍时,得到的分割窗口中,浏览器的最底的一排分割窗口的高度小于屏幕的可用高度,当所述浏览器的宽度不是所述屏幕的可用宽度的整数倍时,得到的分割窗口中,浏览器的最右侧的一排分割窗口的宽度小于屏幕的可用宽度;可选的,除了以所述浏览器的左上角为分割起点,按照从左到右、从上而下的分割顺序进行所述浏览器的分割外,还可以以所述屏幕当前的显示的浏览器部分为分割起点进行扩散分割,在此不作限定。
在一种实施方式中,基于步骤S11~S15,步骤S14中的截图规则包括步骤S141b~S144b:
S141b、获取所述屏幕可用尺寸;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
S142b、基于所述网页尺寸和所述屏幕可用尺寸,将所述浏览器进行均等分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述分割窗口的尺寸小于或等于所述屏幕可用尺寸。
S143b、以所述屏幕的初始显示界面进行截图操作;
S144b、根据所述浏览器的滑动操作采用对应的截图操作。
具体地,步骤S142b包括步骤S142b1~S142b5:
S142b1、将所述网页高度除以所述屏幕的可用高度后并向上取整,得到纵向分割个数;
S142b2、将所述网页宽度除以所述屏幕的可用宽度后并向上取整,得到横向分割个数;
S142b3、将所述网页高度除以所述纵向分割个数,得到纵向分割高度;
S142b4、将所述网页宽度除以所述横向分割个数,得到横向分割宽度;
S142b5、根据所述纵向分割高度和所述横向分割宽度作为参考尺寸对所述浏览器进行分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述网页尺寸包括网页高度和网页宽度,所述屏幕可用尺寸包括所述屏幕的可用高度和所述屏幕的可用宽度。
可以理解的,若以所述浏览器的左上角为分割起点,按照从左到右、从上而下的分割顺序进行所述浏览器的均等分割,当所述浏览器的高度是所述屏幕的可用高度的整数倍,且所述浏览器的宽度是所述屏幕的可用宽度的整数倍时,对所述浏览器进行均等分割,得到的分割窗口的尺寸等于所述屏幕可用尺寸;当所述浏览器的高度不是所述屏幕的可用高度的整数倍,对所述浏览器进行均等分割,得到的分割窗口的高度小于所述屏幕的可用高度;当所述浏览器的宽度不是所述屏幕的可用宽度的整数倍,对所述浏览器进行均等分割,得到的分割窗口的宽度小于所述屏幕的可宽高度。
在一种实施方式中,当所述浏览器纵向滑动时,步骤S143a或步骤S144b中所述的根据所述浏览器的滑动操作采用对应的截图操作,包括步骤S1431~S1432:
S1431、检测在所述屏幕中出现的横向分割线,当所述横向分割线与所述屏幕的可用区域的底部重合时,以所述屏幕的当前显示界面进行截图操作;
S1432、当所述屏幕的可用区域的底部和所述浏览器的横向边界线重合时,以所述屏幕的当前显示界面进行截图操作;则,所述长截图停止条件为:接收到长截图停止指令,或者所述浏览器滑动到所述浏览器的底部。
可以理解的是,所述浏览器纵向滑动时的截图操作适用于采用竖向排版的页面,或者,页面被划分为多个竖栏,在每个竖栏内,采用横向排版的页面,常见于期刊文章的排版方式;所述长截图停止指令的输入可通过触屏操作输入,可以通过按键输入,也可以通过手势识别输入等,在此不作限定;长截图停止条件可以是:浏览器的底部的横向边界线与所述屏幕的可用区域的底部的边界线重合。
在一种实施方式中,当所述浏览器横向滑动时,步骤S143a或步骤S143b中所述根据所述浏览器的滑动操作采用对应的截图操作,包括步骤S1433~S1434:
S1433、检测在所述屏幕中出现的纵向分割线,当所述纵向分割线与所述屏幕的可用区域的右侧重合时,以所述屏幕的当前显示界面进行截图操作;
S1434、当所述屏幕的可用区域的右侧和所述浏览器的纵向边界线重合时,以所述屏幕的当前显示界面进行截图操作;其中,所述长截图停止条件为:接收到长截图停止指令或所述浏览器滑动到所述浏览器的右侧纵向边界线。
可以理解的是,所述浏览器横向滑动时的截图操作适用于横向排版的页面;所述长截图停止指令的输入可通过触屏操作输入,可以通过按键输入,也可以通过手势识别输入等,在此不作限定;长截图停止条件可以是:浏览器的右侧的纵向边界线与所述屏幕的可用区域的右侧的纵向边界线重合。
在一种实施例中,步骤S132中的全方位滑动操作包括两种不同的操作;
具体地:
所述全方位滑动操作包括:控制所述浏览器以第一弓字形路线(此时按照纵向-横向-...-纵向)滑动,以使所述浏览器处于所述当前位置时,呈现在屏幕上的局部浏览器的正下方的局部浏览器以及呈现在屏幕上的局部浏览器的右侧的局部浏览器,能够依次展示在所述屏幕中;
所述全方位滑动操作具体包括:控制所述浏览器以第二弓字形路线(此时按照横向-纵向-...-横向)滑动,以使所述浏览器处于所述当前位置时,呈现在屏幕上的局部浏览器的正右方的局部浏览器,以及呈现在屏幕上的局部浏览器的下方的局部浏览器,能够依次展示在所述屏幕中;
其中,所述长截图停止条件包括接收到长截图停止指令,或者,所述浏览器滑动到所述浏览器的底部且所述浏览器滑动到所述浏览器的右侧;
值得说明的是,所述长截图停止指令的输入可通过触屏操作输入,可以通过按键输入,也可以通过手势识别输入等,在此不作限定;长截图停止条件可以是:浏览器的底部的横向边界线与所述屏幕的可用区域的底部的边界线重合且浏览器的右侧的纵向边界线与所述屏幕的可用区域的右侧的纵向边界线重合。
更具体地:
所述控制所述浏览器以第一弓字形路线(此时按照纵向-横向-...-纵向)滑动,包括步骤S1320~S1324:
S1320、控制所述浏览器向上纵向滑动,直到所述浏览器的横向边界线和所述屏幕的可用区域的底部重合;
S1321、控制所述浏览器向左横向滑动,直到所述纵向分割线与所述屏幕的可用区域的右侧重合;
S1322、控制所述浏览器向下纵向滑动,直到所述浏览器的横向边界线和所述屏幕的可用区域的顶部重合;
S1323、控制所述浏览器向左横向滑动,直到所述纵向分割线与所述屏幕的可用区域的右侧重合;
S1324、重复步骤S1320~S1323,直到达到预设的长截屏停止条件;
所述控制所述浏览器以第二弓字形路线(此时按照横向-纵向-...-横向)滑动,包括步骤S1325~S1329:
S1325、控制所述浏览器向左横向滑动,直到所述浏览器的纵向边界线和所述屏幕的可用区域的右侧重合;
S1326、控制所述浏览器向上纵向滑动,直到所述横向分割线与所述屏幕的可用区域的底部重合;
S1327、控制所述浏览器向右横向滑动,直到所述浏览器的纵向边界线和所述屏幕的可用区域的左侧重合;
S1328、控制所述浏览器向上纵向滑动,直到所述横向分割线与所述屏幕的可用区域的底侧重合;
S1325、重复步骤S1325~S1328,直到达到预设的长截屏停止条件。
在一种实施方式中,步骤S15中所述拼接规则包括:
对所述局部网页图像的内容进行重复性检测;
当检测到重复的图像区域时,采用图像覆盖拼接的方式对存在重复的图像区域的局部网页图像进行拼接;
当没有检测到重复的图像区域时,直接拼接。
可选的,除了第一张截取的局部网页图像外,每得到一张局部网页图像即可完成一次拼接;或者,所有的局部网页图像截取完成后,再对所有的局部网页图像进行拼接。
进一步地,所述方法还包括:当每完成一次局部网页图像的拼接时,删除已完成拼接的局部网页图像。
可以理解的是,在图像拼接过程中,通过对内存占用实施监听,利用算法释放等技术手段,减少内存空间占用,解决因内存不足导致的白屏问题。
与现有技术相比,本发明实施例能够根据待截图的网页的网页尺寸对浏览器的大小进行调节,使得该网页的内容能够完整地展示在浏览器中,无需滑动网页,而是通过滑动浏览器,再对浏览器进行滑动截屏后进行图片的拼接,从而实现了不具备自动滚屏接口的设备也能够对网页进行长截图,同时,也解决了现有技术中通过网页滑动来实现长截屏所带来的对浏览器的工具栏或者浮窗等非网页内容被多次捕捉的问题,另外,通过及时删除已完成拼接的局部网页图像,减少内存空间占用,降低因内存不足导致的白屏问题的概率。
参见图2,图2是本发明实施例提供的一种网页长截图装置的结构装置图,所述网页长截图装置20包括:
网页尺寸获取模块21,用于响应于网页长截图指令,获取浏览器中网页的网页尺寸;
页面窗口尺寸设置模块22,用于将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
浏览器滑动控制模块23,用于响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
局部网页图像生成模块24,用于在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
局部网页图像拼接模块25,用于将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
值得说明的是,一个网页的展示,从外到内的容器为:屏幕、浏览器和网页本身,浏览器包括页面窗口,进一步地,浏览器还可包括工具栏,在此不作限定;网页内容展现在网页内,网页展现在浏览器的页面窗口内,而浏览器展现在屏幕内;网页尺寸为待截图的整个网页的页面尺寸,从所述网页的顶部到所述网页的底部的距离为网页高度,从所述网页的左侧边缘到所述网页的右侧边缘的距离为网页宽度,所述网页尺寸包括所述网页高度和所述网页宽度。
浏览器的尺寸可以与屏幕可用尺寸可以相同,也可以不同,网页尺寸与浏览器的页面窗口的尺寸可以相同,也可以不相同,在实际应用中,大多数的网页尺寸大于浏览器的页面窗口的尺寸,因此,在使用浏览器浏览页面时,通常采用浏览器中的滚动条来控制网页在浏览器中的滑动来进行展示。
屏幕包括屏幕可用区域和屏幕任务栏区域,当屏幕任务栏隐藏时,屏幕的整个区域都是屏幕可用区域,屏幕可用尺寸等于屏幕尺寸,当屏幕任务栏不隐藏时,屏幕尺寸包括屏幕可用尺寸和屏幕任务栏尺寸;为了提高用户的使用体验感,一般情况下,现有的手机设备的浏览器的尺寸与屏幕可用尺寸是相同的,但是并不排除存在浏览器的尺寸与屏幕可用尺寸不相同的情况,在使用现有的手机设备中的浏览器浏览网页时,一般情况下,浏览器的尺寸与屏幕可用尺寸相匹配,并且通常会自动将网页尺寸进行调整,使得网页宽度与浏览器的宽度相匹配,只需上下滑动网页即可通过屏幕浏览网页内容。
可以理解的是,本发明中的所有尺寸指的是当前分辨率下的高度和宽度,而不是物理上的高度和宽度。
可选的,网页长截图指令的输入可通过触屏操作输入,可以通过按键输入,也可以通过手势识别输入等,在此不作限定。
示例性的,设定浏览器的页面窗口的原先的尺寸为1284×2778,网页尺寸为1284×4000;页面窗口尺寸设置模块22,用于根据网页尺寸1284×4000,将浏览器的页面窗口的尺寸从1284×2778重新设置成1284×4000,以使整个网页能够完整地展示在浏览器的页面窗口处。
可以理解的,当屏幕可用尺寸小于浏览器的尺寸时,浏览器不能在屏幕中完全展示出来,只能通过滑动浏览器,以改变浏览器的位置,才能使得浏览器通过屏幕被完全展示,但是在每一个时刻,浏览器都不能被完整展示。
在局部网页图像生成模块24中,通过滑动浏览器,使得完全展示在浏览器中的网页随着浏览器的滑动而在屏幕中展示,并且在浏览器滑动过程中进行截图,生成了局部网页图像。可以理解的,相对于屏幕,浏览器滑动了,浏览器的位置随着滑动发生了变化;相对于浏览器,网页并没有发生滑动,浏览器和网页之间的位置关系没有发生变化。
本发明实施例公开的一种网页长截图装置20,通过响应网页长截图指令,来获取浏览器中网页的网页尺寸,进而将所述浏览器的页面窗口的尺寸设置成所述网页尺寸,使得所述网页完全展示在所述页面窗口,通过响应浏览器的滑动操作,来控制所述浏览器随着滑动操作滑动,并在所述浏览器滑动时,通过按照预设的截图规则对所述浏览器进行截图,以生成局部网页图像,直至达到预设的长截图停止条件,再通过将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。由此可见,本发明实施例能够根据待截图的网页的网页尺寸对浏览器的大小进行调节,使得该网页的内容能够完整地展示在浏览器中,无需滑动网页,而是通过滑动浏览器,再对浏览器进行滑动截屏后进行图片的拼接,从而实现了不具备自动滚屏接口的设备也能够对网页进行长截图,同时,也解决了现有技术中通过网页滑动来实现长截屏所带来的对浏览器的工具栏或者浮窗等非网页内容被多次捕捉的问题。
值得说明的是,具体的所述网页长截图装置20的工作过程可参考上述实施例中所述网页长截图方法的工作过程,在此不再赘述。
参见图3,图3是本发明实施例提供的一种网页长截图设备的结构示意图,所述网页长截图设备30包括处理器31、存储器32以及存储在所述存储器32中且被配置为由所述处理器31执行的计算机程序,所述处理器31执行所述计算机程序时实现如上述网页长截图方法实施例中的步骤,例如图1中的步骤S11~S15。或者,所述处理器31执行所述计算机程序时实现上述各装置实施例中各模块的功能,例如网页尺寸获取模块21。
示例性的,所述计算机程序可以被分割成一个或多个模块,所述一个或者多个模块被存储在所述存储器32中,并由所述处理器31执行,以完成本发明。所述一个或多个模块可以是能够完成特定功能的一系列计算机程序指令段,该指令段用于描述所述计算机程序在所述网页长截图设备30中的执行过程。例如,所述计算机程序可以被分割成网页尺寸获取模块21、页面窗口尺寸设置模块22、浏览器滑动控制模块23、局部网页图像生成模块24和局部网页图像拼接模块25,各模块具体功能如下:
网页尺寸获取模块21,用于响应于网页长截图指令,获取浏览器中网页的网页尺寸;
页面窗口尺寸设置模块22,用于将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
浏览器滑动控制模块23,用于响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
局部网页图像生成模块24,用于在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
局部网页图像拼接模块25,用于将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
各个模块具体的工作过程可参考上述实施例所述的网页长截图装置20的工作过程,在此不再赘述。
所述网页长截图设备30可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。所述网页长截图设备30可包括,但不仅限于,处理器31、存储器32。本领域技术人员可以理解,所述示意图仅仅是电池状态监测设备的示例,并不构成对网页长截图设备30的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件,例如所述网页长截图设备30还可以包括输入输出设备、网络接入设备、总线等。
所述处理器31可以是中央处理单元(Central Processing Unit,CPU),还可以是其他通用处理器、数字信号处理器(Digital Signal Processor,DSP)、专用集成电路(Application Specific Integrated Circuit,ASIC)、现成可编程门阵列(Field-Programmable Gate Array,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等,所述处理器31是所述网页长截图设备30的控制中心,利用各种接口和线路连接整个网页长截图设备30的各个部分。
所述存储器32可用于存储所述计算机程序和/或模块,所述处理器31通过运行或执行存储在所述存储器32内的计算机程序和/或模块,以及调用存储在存储器32内的数据,实现所述网页长截图设备30的各种功能。所述存储器32可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等;存储数据区可存储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外,存储器32可以包括高速随机存取存储器,还可以包括非易失性存储器,例如硬盘、内存、插接式硬盘,智能存储卡(Smart Media Card,SMC),安全数字(SecureDigital,SD)卡,闪存卡(Flash Card)、至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。
其中,所述网页长截图设备30集成的模块如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本发明实现上述实施例方法中的全部或部分流程,也可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于一计算机可读存储介质中,该计算机程序在被处理器执行时,可实现上述各个方法实施例的步骤。其中,所述计算机程序包括计算机程序代码,所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质可以包括:能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、电载波信号、电信信号以及软件分发介质等。
以上所述是本发明的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也视为本发明的保护范围。
Claims (10)
1.一种网页长截图方法,其特征在于,包括:
响应于网页长截图指令,获取浏览器中网页的网页尺寸;
将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
2.如权利要求1所述的网页长截图方法,其特征在于,所述控制所述浏览器随着所述滑动操作滑动,具体包括:
获取所述浏览器呈现在屏幕上的当前位置;
以所述当前位置为滑动起点,按照所述滑动操作进行滑动;其中,所述滑动操作包括全方位滑动操作、纵向滑动和横向滑动。
3.如权利要求2所述的网页长截图方法,其特征在于,所述截图规则包括:
获取屏幕可用尺寸,以所述屏幕可用尺寸作为参考尺寸对所述浏览器进行分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
以所述屏幕的初始显示界面进行截图操作;
根据所述浏览器的滑动操作采用对应的截图操作。
4.如权利要求2所述的网页长截图方法,其特征在于,所述截图规则还包括:
获取屏幕可用尺寸;其中,所述屏幕可用尺寸为屏幕的可用区域的尺寸;
基于所述网页尺寸和所述屏幕可用尺寸,将所述浏览器进行均等分割,得到含有纵向分割线和横向分割线的分割窗口;其中,所述分割窗口的尺寸小于或等于所述屏幕可用尺寸。
以所述屏幕的初始显示界面进行截图操作;
根据所述浏览器的滑动操作采用对应的截图操作。
5.如权利要求3或4所述的网页长截图方法,其特征在于,当所述浏览器纵向滑动时,所述根据所述浏览器的滑动操作采用对应的截图操作,包括:
检测在所述屏幕中出现的横向分割线,当所述横向分割线与所述屏幕的可用区域的底部重合时,以所述屏幕的当前显示界面进行截图操作;
当所述屏幕的可用区域的底部和所述浏览器的横向边界线重合时,以所述屏幕的当前显示界面进行截图操作;则,所述长截图停止条件为:接收到长截图停止指令,或者所述浏览器滑动到所述浏览器的底部。
6.如权利要求3或4所述的网页长截图方法,其特征在于,当所述浏览器横向滑动时,所述根据所述浏览器的滑动操作采用对应的截图操作,包括:
检测在所述屏幕中出现的纵向分割线,当所述纵向分割线与所述屏幕的可用区域的右侧重合时,以所述屏幕的当前显示界面进行截图操作;
当所述屏幕的可用区域的右侧和所述浏览器的纵向边界线重合时,以所述屏幕的当前显示界面进行截图操作;其中,所述长截图停止条件为:接收到长截图停止指令或所述浏览器滑动到所述浏览器的右侧纵向边界线。
7.如权利要求1所述的网页长截图方法,其特征在于,所述拼接规则包括:
对所述局部网页图像的内容进行重复性检测;
当检测到重复的图像区域时,采用图像覆盖拼接的方式对存在重复的图像区域的局部网页图像进行拼接;
当没有检测到重复的图像区域时,直接拼接。
8.一种网页长截图装置,其特征在于,包括:
网页尺寸获取模块,用于响应于网页长截图指令,获取浏览器中网页的网页尺寸;
页面窗口尺寸设置模块,用于将所述浏览器的页面窗口的尺寸设置为所述网页尺寸,以使所述网页完全展示在所述页面窗口;
浏览器滑动控制模块,用于响应于浏览器的滑动操作,控制所述浏览器随着所述滑动操作滑动;
局部网页图像生成模块,用于在所述浏览器滑动时,按照预设的截图规则对所述浏览器进行截图以生成局部网页图像,直至达到预设的长截图停止条件;
局部网页图像拼接模块,用于将所述局部网页图像按照预设的拼接规则对所述局部网页图像进行拼接,得到所述网页的长截图。
9.一种网页长截图设备,其特征在于,包括处理器、存储器以及存储在所述存储器中且被配置为由所述处理器执行的计算机程序,所述处理器执行所述计算机程序时实现如权利要求1至7中任意一项所述的网页长截图方法。
10.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质包括存储的计算机程序,其中,在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行如权利要求1至7中任意一项所述的网页长截图方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110629401.3A CN113448470B (zh) | 2021-06-07 | 一种网页长截图方法、装置、设备和存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110629401.3A CN113448470B (zh) | 2021-06-07 | 一种网页长截图方法、装置、设备和存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN113448470A true CN113448470A (zh) | 2021-09-28 |
CN113448470B CN113448470B (zh) | 2024-04-26 |
Family
ID=
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
AU2007100654A4 (en) * | 2007-07-18 | 2007-08-16 | Build Right Online Pty Ltd | Systems & methods for providing information |
GB201109339D0 (en) * | 2011-06-03 | 2011-07-20 | Firestorm Lab Ltd | Computing device interface |
US20150039998A1 (en) * | 2013-07-31 | 2015-02-05 | Clearslide, Inc. | Screen sharing using scripting computer language code directly executable by web browser |
CN105243126A (zh) * | 2015-09-29 | 2016-01-13 | 努比亚技术有限公司 | 跨屏截图方法及装置 |
CN109032470A (zh) * | 2018-07-11 | 2018-12-18 | Oppo(重庆)智能科技有限公司 | 截图方法、装置、终端及计算机可读存储介质 |
CN109032466A (zh) * | 2018-06-27 | 2018-12-18 | 努比亚技术有限公司 | 基于双屏幕的长截图方法、移动终端及存储介质 |
CN110502293A (zh) * | 2019-07-10 | 2019-11-26 | 维沃移动通信有限公司 | 一种截屏方法及终端设备 |
CN110659092A (zh) * | 2019-08-13 | 2020-01-07 | 平安国际智慧城市科技股份有限公司 | 网页截图方法、装置、计算机设备和存储介质 |
CN112181250A (zh) * | 2020-09-28 | 2021-01-05 | 四川封面传媒有限责任公司 | 一种移动终端网页截图方法、装置、设备及存储介质 |
Patent Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
AU2007100654A4 (en) * | 2007-07-18 | 2007-08-16 | Build Right Online Pty Ltd | Systems & methods for providing information |
GB201109339D0 (en) * | 2011-06-03 | 2011-07-20 | Firestorm Lab Ltd | Computing device interface |
US20150039998A1 (en) * | 2013-07-31 | 2015-02-05 | Clearslide, Inc. | Screen sharing using scripting computer language code directly executable by web browser |
CN105243126A (zh) * | 2015-09-29 | 2016-01-13 | 努比亚技术有限公司 | 跨屏截图方法及装置 |
CN109032466A (zh) * | 2018-06-27 | 2018-12-18 | 努比亚技术有限公司 | 基于双屏幕的长截图方法、移动终端及存储介质 |
CN109032470A (zh) * | 2018-07-11 | 2018-12-18 | Oppo(重庆)智能科技有限公司 | 截图方法、装置、终端及计算机可读存储介质 |
CN110502293A (zh) * | 2019-07-10 | 2019-11-26 | 维沃移动通信有限公司 | 一种截屏方法及终端设备 |
WO2021004407A1 (zh) * | 2019-07-10 | 2021-01-14 | 维沃移动通信有限公司 | 截屏方法及终端设备 |
CN110659092A (zh) * | 2019-08-13 | 2020-01-07 | 平安国际智慧城市科技股份有限公司 | 网页截图方法、装置、计算机设备和存储介质 |
CN112181250A (zh) * | 2020-09-28 | 2021-01-05 | 四川封面传媒有限责任公司 | 一种移动终端网页截图方法、装置、设备及存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109215037B (zh) | 目标图像分割方法、装置及终端设备 | |
CN112101305B (zh) | 多路图像处理方法、装置及电子设备 | |
CN110032314B (zh) | 一种长截屏方法、装置、存储介质和终端设备 | |
CN111862035B (zh) | 光斑检测模型的训练方法、光斑检测方法、设备及介质 | |
US9600298B2 (en) | Active and efficient monitoring of a graphical user interface | |
CN110414514B (zh) | 图像处理方法及装置 | |
CN111222509B (zh) | 目标检测方法、装置及电子设备 | |
WO2019184140A1 (zh) | 基于vr的应用程序打开方法、电子装置、设备及存储介质 | |
US9256792B2 (en) | Image processing apparatus, image processing method, and program | |
CN109359582B (zh) | 信息搜索方法、信息搜索装置及移动终端 | |
US20200005689A1 (en) | Generating three-dimensional user experience based on two-dimensional media content | |
CN104410790A (zh) | 一种信息处理方法及电子设备 | |
CN111428570A (zh) | 非活体人脸的检测方法、装置、计算机设备及存储介质 | |
CN105184838A (zh) | 一种图片处理方法及终端 | |
CN111967529B (zh) | 识别方法、装置、设备及系统 | |
CN111597009A (zh) | 应用程序显示的方法、装置及终端设备 | |
CN110677586B (zh) | 图像显示方法、图像显示装置及移动终端 | |
CN113448470B (zh) | 一种网页长截图方法、装置、设备和存储介质 | |
CN109753974B (zh) | 物体旋转角度的检测方法、装置及电子设备 | |
CN110874814B (zh) | 一种图像处理方法、图像处理装置及终端设备 | |
CN111638844A (zh) | 截屏方法、装置及电子设备 | |
CN113448470A (zh) | 一种网页长截图方法、装置、设备和存储介质 | |
CN108198232B (zh) | 一种轨迹框绘制的方法及设备 | |
CN107748642B (zh) | 调整图片的方法、装置、存储介质及电子设备 | |
CN110929721A (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 |