CN110851350A - 网页界面白屏监测的方法及装置 - Google Patents
网页界面白屏监测的方法及装置 Download PDFInfo
- Publication number
- CN110851350A CN110851350A CN201910966510.7A CN201910966510A CN110851350A CN 110851350 A CN110851350 A CN 110851350A CN 201910966510 A CN201910966510 A CN 201910966510A CN 110851350 A CN110851350 A CN 110851350A
- Authority
- CN
- China
- Prior art keywords
- color value
- interface
- webpage interface
- target pixel
- loading
- 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.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 76
- 238000012544 monitoring process Methods 0.000 title claims abstract description 63
- 238000001514 detection method Methods 0.000 claims abstract description 39
- 230000008569 process Effects 0.000 claims abstract description 33
- 230000009191 jumping Effects 0.000 claims abstract description 11
- 238000004590 computer program Methods 0.000 claims description 20
- 238000012216 screening Methods 0.000 claims description 6
- 238000001914 filtration Methods 0.000 claims 1
- 238000012360 testing method Methods 0.000 abstract description 2
- 230000006870 function Effects 0.000 description 17
- 238000004891 communication Methods 0.000 description 9
- 238000010586 diagram Methods 0.000 description 7
- 238000007906 compression Methods 0.000 description 6
- 238000012545 processing Methods 0.000 description 6
- 230000001413 cellular effect Effects 0.000 description 5
- 230000006835 compression Effects 0.000 description 5
- 230000004044 response Effects 0.000 description 4
- 230000008878 coupling Effects 0.000 description 3
- 238000010168 coupling process Methods 0.000 description 3
- 238000005859 coupling reaction Methods 0.000 description 3
- 230000003993 interaction Effects 0.000 description 3
- 230000002452 interceptive effect Effects 0.000 description 3
- 230000000007 visual effect Effects 0.000 description 3
- 230000005540 biological transmission Effects 0.000 description 2
- 230000003111 delayed effect Effects 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 238000009877 rendering Methods 0.000 description 2
- 230000005236 sound signal Effects 0.000 description 2
- 230000002159 abnormal effect Effects 0.000 description 1
- 230000001133 acceleration Effects 0.000 description 1
- 230000003190 augmentative effect Effects 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 238000007599 discharging Methods 0.000 description 1
- 230000009977 dual effect Effects 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 239000011521 glass Substances 0.000 description 1
- 230000005484 gravity Effects 0.000 description 1
- 230000000977 initiatory effect Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 230000007774 longterm Effects 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000006855 networking Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 238000005457 optimization Methods 0.000 description 1
- 238000010079 rubber tapping Methods 0.000 description 1
- 239000004984 smart glass Substances 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 238000010897 surface acoustic wave method Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/3604—Software analysis for verifying properties of programs
- G06F11/3612—Software analysis for verifying properties of programs by runtime analysis
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T7/00—Image analysis
- G06T7/90—Determination of colour characteristics
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computer Vision & Pattern Recognition (AREA)
- Software Systems (AREA)
- Computer Hardware Design (AREA)
- Quality & Reliability (AREA)
- General Engineering & Computer Science (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请适用于应用测试技术领域,提供了一种网页界面白屏监测的方法及装置,所述方法包括:监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;获取所述网页界面的背景颜色作为锚点色值;检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;所述目标像素点为所述网页界面中的全部或部分像素点;若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。本申请实现了及时对网页界面的白屏情况进行监测。
Description
技术领域
本申请属于应用测试技术领域,尤其涉及一种网页界面白屏监测的方法及装置。
背景技术
现如今越来越多的应用程序(Application,APP)会嵌入网页来使产品跨平台、灵活可变、以及减少开发成本。混合模式移动应用(Hybrid APP)的兴起是移动互联网产业的一种必然。
但是,随着网页曝光率提升的同时,一些问题也被很多人所诟病,例如网页加载错误、超时、或是由于任何原因没有渲染页面而导致的白屏问题等,出现这些问题对用户来说是一种非常不好的体验。
好在大部分的网页属于在线页面,所存在的问题可以通过发版部署进行及时修复,因而如何确定网页出现白屏的时机和概率将是解决问题的关键点。但是当前大多数APP开发团队在网页出现白屏问题之后要靠客户的反馈才能获取到异常信息,更严重的是,在等待客户反馈这一漫长的过程中白屏问题已经大面积发生了。
发明内容
本申请实施例提供了一种网页界面白屏监测的方法及装置,可以解决相关技术中无法及时监测网页界面发生白屏的技术问题。
第一方面,本申请实施例提供了一种网页界面白屏监测的方法,包括:
监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;
获取所述网页界面的背景颜色作为锚点色值;
检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;所述目标像素点为所述网页界面中的全部或部分像素点;
若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
第二方面,本申请实施例提供了一种网页界面白屏监测的装置,包括:
监听和检测模块,用于监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;
锚点色值获取模块,用于获取所述网页界面的背景颜色作为锚点色值;
色值检测模块,用于检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;所述目标像素点为所述网页界面中的全部或部分像素点;
结果生成模块,用于若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
第三方面,本申请实施例提供了一种终端设备,包括:存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现如第一方面所述的方法。
第四方面,本申请实施例提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现如第一方面所述的方法。
第五方面,本申请实施例提供了一种计算机程序产品,当计算机程序产品在终端设备上运行时,使得终端设备执行如第一方面所述的方法。
在本申请实施例中,在网页界面加载的过程中,检测是否达到监测条件,当达到监测条件时获取网页界面,再通过网页界面中目标像素点的像素色值与锚点色值进行比对的方式,判定网页界面的加载情况,即判定网页界面是否为白屏,实现了及时对网页界面的白屏情况进行监测,提高了白屏检测的实时性。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1是本申请一实施例提供的网页界面白屏监测的方法所适用于的手机的结构示意图;
图2是本申请一实施例提供的网页界面白屏监测的方法的流程示意图;
图3是本申请一实施例提供的网页界面白屏监测的装置的结构示意图;
图4是本申请一实施例提供的网页界面白屏监测的方法所适用于的终端设备的结构示意图。
具体实施方式
以下描述中,为了说明而不是为了限定,提出了诸如特定系统结构、技术之类的具体细节,以便透彻理解本申请实施例。
为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚,完整地描述,显然,所描述的实施例仅仅是本申请一部分的实施例,而不是全部的实施例。基于本申请中的实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,所获得的所有其他实施例,都应当属于本申请保护的范围。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。
以下描述中,为了说明而不是为了限定,提出了诸如特定系统结构、技术之类的具体细节,以便透彻理解本申请实施例。然而,本领域的技术人员应当清楚,在没有这些具体细节的其它实施例中也可以实现本申请。在其它情况中,省略对众所周知的系统、装置、电路以及方法的详细说明,以免不必要的细节妨碍本申请的描述。
应当理解,当在本申请说明书和所附权利要求书中使用时,术语“包括”指示所描述特征、整体、步骤、操作、元素和/或组件的存在,但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。
还应当理解,在本申请说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合,并且包括这些组合。
如在本申请说明书和所附权利要求书中所使用的那样,术语“如果”可以依据上下文被解释为“当...时”或“一旦”或“响应于确定”或“响应于检测到”。类似地,短语“如果确定”或“如果检测到[所描述条件或事件]”可以依据上下文被解释为意指“一旦确定”或“响应于确定”或“一旦检测到[所描述条件或事件]”或“响应于检测到[所描述条件或事件]”。
另外,在本申请说明书和所附权利要求书的描述中,术语“第一”、“第二”、“第三”等仅用于区分描述,而不能理解为指示或暗示相对重要性。
在本申请说明书中描述的参考“一个实施例”或“一些实施例”等意味着在本申请的一个或多个实施例中包括结合该实施例描述的特定特征、结构或特点。由此,在本说明书中的不同之处出现的语句“在一个实施例中”、“在一些实施例中”、“在其他一些实施例中”、“在另外一些实施例中”等不是必然都参考相同的实施例,而是意味着“一个或多个但不是所有的实施例”,除非是以其他方式另外特别强调。术语“包括”、“包含”、“具有”及它们的变形都意味着“包括但不限于”,除非是以其他方式另外特别强调。
本申请实施例提供的网页界面白屏监测的方法可以应用于手机、平板电脑、可穿戴设备、车载设备、增强现实(augmented reality,AR)/虚拟现实(virtual reality,VR)设备、笔记本电脑、超级移动个人计算机(ultra-mobile personal computer,UMPC)、上网本、个人数字助理(personal digital assistant,PDA)等终端设备上,本申请实施例对终端设备的具体类型不作任何限制。
例如,所述终端设备可以是WLAN中的站点(STAION,ST),可以是蜂窝电话、无绳电话、会话启动协议(Session InitiationProtocol,SIP)电话、无线本地环路(WirelessLocal Loop,WLL)站、PDA、具有无线通信功能的手持设备、计算设备或连接到无线调制解调器的其它处理设备、车载设备、车联网终端、电脑、膝上型计算机、手持式通信设备、手持式计算设备、卫星无线设备、无线调制解调器卡、电视机顶盒(set top box,STB)、用户驻地设备(customer premise equipment,CPE)和/或用于在无线系统上进行通信的其它设备以及下一代通信系统,例如,5G网络中的移动终端或者未来演进的公共陆地移动网络(PublicLand Mobile Network,PLMN)网络中的移动终端等。
作为示例而非限定,当所述终端设备为可穿戴设备时,该可穿戴设备还可以是应用穿戴式技术对日常穿戴进行智能化设计、开发出可以穿戴的设备的总称,如眼镜、手套、手表、服饰及鞋等。可穿戴设备即直接穿在身上,或是整合到用户的衣服或配件的一种便携式设备。可穿戴设备不仅仅是一种硬件设备,更是通过软件支持以及数据交互、云端交互来实现强大的功能。广义穿戴式智能设备包括功能全、尺寸大、可不依赖智能手机实现完整或者部分的功能,如智能手表或智能眼镜等,以及只专注于某一类应用功能,需要和其它设备如智能手机配合使用,如各类进行体征监测的智能手环、智能首饰等。
以所述终端设备为手机为例。图1示出的是与本申请实施例提供的手机的部分结构的框图。参考图1,手机包括:射频(Radio Frequency,RF)电路110、存储器120、输入单元130、显示单元140、传感器150、音频电路160、无线保真(wireless fidelity,WiFi)模块170、处理器180、以及电源190等部件。本领域技术人员可以理解,图1中示出的手机结构并不构成对手机的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。
下面结合图1对手机的各个构成部件进行具体的介绍:
RF电路110可用于收发信息或通话过程中,信号的接收和发送,特别地,将基站的下行信息接收后,给处理器180处理;另外,将设计上行的数据发送给基站。通常,RF电路包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器(Low NoiseAmplifier,LNA)、双工器等。此外,RF电路110还可以通过无线通信与网络和其他设备通信。上述无线通信可以使用任一通信标准或协议,包括但不限于全球移动通讯系统(GlobalSystem of Mobile communication,GSM)、通用分组无线服务(General Packet RadioService,GPRS)、码分多址(Code Division Multiple Access,CDMA)、宽带码分多址(Wideband Code Division Multiple Access,WCDMA)、长期演进(Long Term Evolution,LTE)、电子邮件、以及短消息服务(Short Messaging Service,SMS)等。
存储器120可用于存储软件程序以及模块,处理器180通过运行存储在存储器120的软件程序以及模块,从而执行手机的各种功能应用以及数据处理。存储器120可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)、引导装载程序(Boot Loader)等;存储数据区可存储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外,存储器120可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。可以理解的是,本申请实施例中,存储器120中存储有网页界面白屏监测的程序。
输入单元130可用于接收输入的数字或字符信息,以及产生与手机100的用户设置以及功能控制有关的键信号输入。具体地,输入单元130可包括触控面板131以及其他输入设备132。触控面板131,也称为触摸屏,可收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触控面板131上或在触控面板131附近的操作),并根据预先设定的程式驱动相应的连接装置。可选的,触控面板131可包括触摸检测装置和触摸控制器两个部分。其中,触摸检测装置检测用户的触摸方位,并检测触摸操作带来的信号,将信号传送给触摸控制器;触摸控制器从触摸检测装置上接收触摸信息,并将它转换成触点坐标,再送给处理器180,并能接收处理器180发来的命令并加以执行。此外,可以采用电阻式、电容式、红外线以及表面声波等多种类型实现触控面板131。除了触控面板131,输入单元130还可以包括其他输入设备132。具体地,其他输入设备132可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆等中的一种或多种。
显示单元140可用于显示由用户输入的信息或提供给用户的信息以及手机的各种菜单。显示单元140可包括显示面板141,可选的,可以采用液晶显示器(Liquid CrystalDisplay,LCD)、有机发光二极管(Organic Light-Emitting Diode,OLED)等形式来配置显示面板141。进一步的,触控面板131可覆盖显示面板141,当触控面板131检测到在其上或附近的触摸操作后,传送给处理器180以确定触摸事件的类型,随后处理器180根据触摸事件的类型在显示面板141上提供相应的视觉输出。虽然在图1中,触控面板131与显示面板141是作为两个独立的部件来实现手机的输入和输入功能,但是在某些实施例中,可以将触控面板131与显示面板141集成而实现手机的输入和输出功能。
手机100还可包括至少一种传感器150,比如光传感器、运动传感器以及其他传感器。具体地,光传感器可包括环境光传感器及接近传感器,其中,环境光传感器可根据环境光线的明暗来调节显示面板141的亮度,接近传感器可在手机移动到耳边时,关闭显示面板141和/或背光。作为运动传感器的一种,加速计传感器可检测各个方向上(一般为三轴)加速度的大小,静止时可检测出重力的大小及方向,可用于识别手机姿态的应用(比如横竖屏切换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等;至于手机还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器,在此不再赘述。
音频电路160,扬声器161,传声器162可提供用户与手机之间的音频接口。音频电路160可将接收到的音频数据转换后的电信号,传输到扬声器161,由扬声器161转换为声音信号输出;另一方面,传声器162将收集的声音信号转换为电信号,由音频电路160接收后转换为音频数据,再将音频数据输出处理器180处理后,经RF电路110以发送给比如另一手机,或者将音频数据输出至存储器120以便进一步处理。
WiFi属于短距离无线传输技术,手机通过WiFi模块170可以帮助用户收发电子邮件、浏览网页和访问流式媒体等,它为用户提供了无线的宽带互联网访问。虽然图1示出了WiFi模块170,但是可以理解的是,其并不属于手机100的必须构成,完全可以根据需要在不改变发明的本质的范围内而省略。
处理器180是手机的控制中心,利用各种接口和线路连接整个手机的各个部分,通过运行或执行存储在存储器120内的软件程序和/或模块,以及调用存储在存储器120内的数据,执行手机的各种功能和处理数据,从而对手机进行整体监控。可选的,处理器180可包括一个或多个处理单元;优选的,处理器180可集成应用处理器和调制解调处理器,其中,应用处理器主要处理操作系统、用户界面和应用程序等,调制解调处理器主要处理无线通信。可以理解的是,上述调制解调处理器也可以不集成到处理器180中。可以理解的是,本申请实施例中,存储器120中存储有网页界面白屏监测的程序,而处理器180可以用于调用存储器120中存储的网页界面白屏监测的程序并执行,以实现本申请实施例的网页界面白屏监测的方法。
手机100还包括给各个部件供电的电源190(比如电池),优选的,电源可以通过电源管理系统与处理器180逻辑相连,从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。
尽管未示出,手机100还可以包括摄像头。可选地,摄像头在手机100的上的位置可以为前置的,也可以为后置的,还可以为内置的(在使用时可伸出机身),本申请实施例对此不作限定。
可选地,手机100可以包括单摄像头、双摄像头或三摄像头等,本申请实施例对此不作限定。摄像头包括但不限于广角摄像头、长焦摄像头或深度摄像头等。
例如,手机100可以包括三摄像头,其中,一个为主摄像头、一个为广角摄像头、一个为长焦摄像头。
可选地,当手机100包括多个摄像头时,这多个摄像头可以全部前置,或者全部后置,或者全部内置,或者至少部分前置,或者至少部分后置,或者至少部分内置等,本申请实施例对此不作限定。
另外,尽管未示出,手机100还可以包括蓝牙模块等,在此不再赘述。
图2示出了本申请实施例提供的一种网页界面白屏监测的方法的实现流程图。作为示例而非限定,该方法可以应用于具有上述硬件结构的手机100中,以下实施例将以手机100为例,对本申请实施例提供的网页界面白屏监测的方法进行说明。所述方法包括步骤201至步骤204。
S201,监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面。
在本申请实施例中,Hybrid APP中的界面包括本地(native)界面和网页界面两种类型,当终端监听到用户触发界面跳转指令,将实现界面之间的跳转。
界面之间的跳转包括从native界面跳转到网页界面、从native界面跳转到native界面、从网页界面跳转到native界面、和从网页界面跳转到网页界面四种页面跳转情况。
其中,不管是从native界面还是从网页界面跳转到native界面,由于native界面可以直接通过调用本地数据进行显示,所以跳转时不会出现白屏问题。但是,不管是从native界面还是从网页界面跳转到网页界面,都需要先从服务器加载网页代码,然后根据网页代码渲染出网页界面。所以,若用户触发跳转至网页界面的界面跳转指令时网络环境欠佳或Hybrid APP本身开发存在缺陷,用户终端将在网页界面成功加载前显示白屏界面,甚至在加载完成后仍然是白屏显示。
因而,本申请实施例中为了实现对白屏问题进行准确定位,仅对加载网页界面的情形进行监测。在本申请实施例中,终端监听到跳转至网页界面的跳转指令,加载网页界面,在加载网页界面的过程中检测是否达到监测条件,当达到监测条件时获取网页界面。
应当理解的是,检测到达到监测条件是获取网页界面的前提条件,当检测到达到监测条件时,则执行获取网页界面的步骤。
可选地,所述在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面,包括:
在加载所述网页界面的过程中检测加载时长是否达到预设时长,若检测到所述加载时长达到预设时长时获取所述网页界面;或
在加载所述网页界面的过程中检测所述网页界面的加载状态,若检测到所述加载状态为加载完成状态时获取所述网页界面。
作为本申请一实施例,在加载网页界面的过程中检测加载时长是否达到预设时长,若检测到加载时长达到预设时长时获取网页界面。
其中,加载时长以监听到跳转至网页界面的跳转指令为起始点,从该起始点开始计时并将计时结果赋值给加载时长,当检测到加载时长达到预设时长,即加载时长等于预设时长时,获取网页界面。应当理解的是,预设时长为经验值,可以设置为5秒或者10秒或者数值区间(5,10)中任一数值,甚至可以更短或更长,本申请对此不予限制。
作为本申请另一实施例,在加载网页界面的过程中检测网页界面的加载状态,若检测到加载状态为加载完成状态时获取网页界面。
其中,readyState属性描述了网页界面的加载状态,可以通过检测该属性的属性值来确定网页界面的加载状态。
示例性地,readyState属性的属性值包括:loading、interactive以及complete。
loading:表示加载状态为正在加载。
interactive:表示加载状态为可交互,“正在加载”状态结束,但是诸如图像,样式表和框架之类的子资源仍在加载。
complete:表示加载状态为完成,所有子资源已完成加载。
当检测到网页界面的加载状态为完成状态,则获取网页界面,从而判断网页界面实际是否显示正常,是否出现白屏问题。
作为本申请另一实施例,在加载网页界面的过程中检测加载时长是否达到预设时长和检测网页界面的加载状态,直至检测到加载时长达到预设时长和加载状态为加载完成状态中的任一个时,获取网页界面。
获取网页界面,作为本申请一示例,可以通过对手机进行截屏来获取网页界面;作为本申请另一示例,可以从webview中找到类名为UIWebBrowserView的视图,这个就是网页界面的根试图,包含网页界面的所有信息,将这个视图作为网页界面。
可选地,在本申请其他实施例中,在检测到加载状态为加载完成状态,获取网页界面的情况下,为了防止网页延时渲染造成检测结果的偏差,还可以延时预设时长,例如1秒钟后再获取网页界面。这种设置提高了白屏检测的准确性,更利于对问题进行定位,提高了定位问题的准确性。
可选地,在本申请其他实施例中,在获取网页视图后,为了进一步提高检测结果的准确性,可以先排除网页界面中系统自动填充的可视内容,例如iPhone X的安全区、和/或导航栏自动留出页面偏移量产生的区域等,再对排除了自动填充的可视内容的网页界面进行白屏检测的后续步骤。
S202,获取所述网页界面的背景颜色作为锚点色值。
其中,获取网页界面的背景颜色作为锚点色值。当网页界面的网页画布为非透明的情况下,直接获取网页界面的背景颜色作为锚点色值。当网页界面的网页画布为透明的情况下,则需要取网页界面父视图的背景色值作为锚点色值,直到取到展示在手机屏幕上的网页界面的背景颜色,将背景颜色作为锚点色值。
作为本申请一示例,当网页界面为页面截屏时,可以通过取色器获取背景颜色。
作为本申请另一示例,从UIWebBrowserView的视图中获取backgroundColor属性,backgroundColor属性为背景颜色属性,通过获取该属性值则可确定背景颜色。
可以理解的是,当网页界面的网页画布为透明的情况下,则需要通过获取到采用非透明画布的父视图的backgroundColor属性值作为背景色值。
S203,检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同。
在步骤203,先从网页界面的像素点中确定若干个目标像素点,再检测每个目标像素点的像素色值是否与锚点色值相同。也就是说,将每个目标像素点的像素色值与锚点色值进行比对,检测两者是否相同。其中,从网页界面的像素点中确定若干个目标像素点,目标像素点可以为网页界面中的所有像素点,也可以为从网页界面的所有像素点中筛选出的部分像素点。
当筛选部分像素点作为目标像素点时,可以随机筛选网页界面中第一预设比例的像素点作为目标像素点;也可以规则选取网页界面中的若干个像素点作为目标像素点,例如每间隔预设个像素点选取一个目标像素点的方式,或每间隔预设行或列选取一行或一列目标像素点的方式;还可以将网页界面等分为预设数量个子界面,即若干个子界面,在每个子界面中随机筛选出第二预设比例的像素点作为目标像素点,或者从每个子界面中规则筛选出若干个像素点作为目标像素点。
可以理解的是,第一预设比例和第二预设比例可以相同也可以不相同,为经验值,本申请对此不予限定。
可选地,在本申请其他实施例中,还可以在检测网页界面中每个目标像素点的像素色值是否与所述锚点色值相同之前,对所述网页界面进行压缩得到压缩图像。在这种情况下,步骤203的处理对象就为压缩图像,也就是说,检测压缩图像中的每个目标像素点的像素色值是否与锚点色值相同。
其中,在对网页界面进行压缩的过程,一般按照预设大小进行压缩,即压缩成预设大小,例如宽3像素、5像素或7像素等,在压缩中尽量保持原有的比例。由于图片在压缩过程中一些微小的内容会被忽略,因此,假如一个网页界面在加载后只有一些非常细微内容,在压缩后这些细微的内容将会丢失掉,此时,目标像素点的像素色值会等于锚点色值,则检测结果为网页界面加载失败,即为白屏的情况。通过压缩网页界面,一方面,排除了网页界面仅因成功加载一些微小内容却可能被检测成不为白屏的情形,减小了检测结果的偏差。另一方面,减少了需要进行比对的像素数量,缩短了检测时长,减少了系统资源占用。
作为本申请一示例而非限定,先将获取到的网页界面压缩成7×12像素的压缩图片,然后再将压缩图片上下等分为5等分,左右等分为N等分,形成5N个子界面,即5N个区块,在每个区块上随机选取若干个像素点作为目标像素点。再将每个目标像素点的像素色值与锚点色值进行比对,看两者是否相同。
当所述像素色值和所述锚点色值用YUV表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,U值和V值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同。
当所述像素色值和所述锚点色值用RGB表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的R值,G值和B值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同。
当所述像素色值和所述锚点色值用YCbCr表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,Cb值和Cr值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同。
S204,若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
其中,将每个目标像素点的像素色值与锚点色值进行比对,检测两者是否相同。当目标像素点中与锚点色值相同的目标像素点的像素数量占比等于或大于预设比例,则说明检测结果为网页界面为白屏,生成网页界面为白屏的检测结果。
可以理解的是,当目标像素点中与锚点色值相同的目标像素点的像素数量占比小于预设比例,则说明检测结果为网页界面不为白屏,生成网页界面正常显示的检测结果
需要说明的是,预设比例为经验值,可以根据需要设置,本申请对此不予限制。
在本申请实施例中,在网页界面加载的过程中,检测是否达到监测条件,当达到监测条件时获取网页界面,再通过网页界面中目标像素点的像素色值与锚点色值进行比对的方式,判定网页界面的加载情况,即判定网页界面是否为白屏,实现了及时对网页界面的白屏情况进行监测,提高了白屏检测的实时性。
可选地,在本申请其他实施例中,在步骤204之后还包括:记录检测数据,所述检测数据包括但不限于网页界面的加载开始时间、页面地址、页面ID、加载结束时间等。
其中,网页界面的加载开始时间,可以为跳转指令的触发时间。
网页界面的页面地址可以为URL地址。
此外,在本申请其他实施例中,在记录检测数据后,还可以将记录的检测数据上传至管理终端,以便管理员进行检测统计和性能优化等。
其中,管理终端包括但不限于管理者手持设备和管理服务器等。
应理解,上述实施例中各步骤的序号的大小并不意味着执行顺序的先后,各过程的执行顺序应以其功能和内在逻辑确定,而不应对本申请实施例的实施过程构成任何限定。
对应于上文实施例所述的网页界面白屏监测的方法,图3示出了本申请实施例提供的网页界面白屏监测的装置的结构框图,为了便于说明,仅示出了与本申请实施例相关的部分。
参照图3,该装置包括:
监听和检测模块31,用于监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;
锚点色值获取模块32,用于获取所述网页界面的背景颜色作为锚点色值;
色值检测模块33,用于检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;
结果生成模块34,用于若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
可选地,所述监听和监测模块31具体用于:
在加载所述网页界面的过程中检测加载时长是否达到预设时长,若检测到所述加载时长达到预设时长时获取所述网页界面;或
在加载所述网页界面的过程中检测所述网页界面的加载状态,若检测到所述加载状态为加载完成状态时获取所述网页界面。
可选地,所述色值检测模块33具体包括:
确定子模块,用于从所述网页界面的像素点中确定若干个目标像素点;以及
检测子模块,用于检测每个所述目标像素点的像素色值是否与所述锚点色值相同。
可选地,所述确定子模块包括:
第一确定孙模块,用于将所述网页界面的所有像素点的作为目标像素点;或
第二确定孙模块,用于从所述网页界面的像素点中筛选出部分像素点作为目标像素点。
可选地,所述第二确定孙模块具体用于:
从所述网页界面的像素点中筛选出第一预设比例的像素点作为目标像素点;或
从所述网页界面的像素点中规则选取若干个像素点作为目标像素点;或
将所述网页界面等分成若干个子界面,从每个所述子界面中筛选出第二预设比例的像素点作为目标像素点;或
将所述网页界面等分成若干个子界面,从每个所述子界面中规则选取若干个像素点作为目标像素点。
可选地,所述检测子模块具体用于:
当所述像素色值和所述锚点色值用YUV表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,U值和V值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同;
当所述像素色值和所述锚点色值用RGB表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的R值,G值和B值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同;
当所述像素色值和所述锚点色值用YCbCr表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,Cb值和Cr值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同。
可选地,所述装置还包括压缩模块。
所述压缩模块,用于对所述网页界面进行压缩得到压缩图像。
相应的,所述色值检测模块33具体用于:
检测所述压缩图像中每个目标像素点的像素色值是否与所述锚点色值相同。
需要说明的是,上述装置/单元之间的信息交互、执行过程等内容,由于与本申请方法实施例基于同一构思,其具体功能及带来的技术效果,具体可参见方法实施例部分,此处不再赘述。
所属领域的技术人员可以清楚地了解到,为了描述的方便和简洁,仅以上述各功能单元、模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能单元、模块完成,即将所述装置的内部结构划分成不同的功能单元或模块,以完成以上描述的全部或者部分功能。实施例中的各功能单元、模块可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中,上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。另外,各功能单元、模块的具体名称也只是为了便于相互区分,并不用于限制本申请的保护范围。上述系统中单元、模块的具体工作过程,可以参考前述方法实施例中的对应过程,在此不再赘述。
图4为本申请一实施例提供的终端设备的结构示意图。如图4所示,该实施例的终端设备4包括:至少一个处理器40(图4中仅示出一个处理器)、存储器41以及存储在所述存储器41中并可在所述至少一个处理器40上运行的计算机程序42,所述处理器40执行所述计算机程序42时实现上述各个方法实施例中的步骤。
本申请实施例还提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现可实现上述各个方法实施例中的步骤。
本申请实施例提供了一种计算机程序产品,当计算机程序产品在移动终端上运行时,使得移动终端执行时实现可实现上述各个方法实施例中的步骤。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本申请实现上述实施例方法中的全部或部分流程,可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于一计算机可读存储介质中,该计算机程序在被处理器执行时,可实现上述各个方法实施例的步骤。其中,所述计算机程序包括计算机程序代码,所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质至少可以包括:能够将计算机程序代码携带到拍照装置/终端设备的任何实体或装置、记录介质、计算机存储器、只读存储器(Read-Only Memory,ROM)、随机存取存储器(Random AccessMemory,RAM)、电载波信号、电信信号以及软件分发介质。例如U盘、移动硬盘、磁碟或者光盘等。在某些司法管辖区,根据立法和专利实践,计算机可读介质不可以是电载波信号和电信信号。
在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述或记载的部分,可以参见其它实施例的相关描述。
本领域普通技术人员可以意识到,结合本文中所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、或者计算机软件和电子硬件的结合来实现。这些功能究竟以硬件还是软件方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范围。
在本申请所提供的实施例中,应该理解到,所揭露的装置/网络设备和方法,可以通过其它的方式实现。例如,以上所描述的装置/网络设备实施例仅仅是示意性的,例如,所述模块或单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通讯连接可以是通过一些接口,装置或单元的间接耦合或通讯连接,可以是电性,机械或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
以上所述实施例仅用以说明本申请的技术方案,而非对其限制;尽管参照前述实施例对本申请进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本申请各实施例技术方案的精神和范围,均应包含在本申请的保护范围之内。
Claims (10)
1.一种网页界面白屏监测的方法,其特征在于,包括:
监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;
获取所述网页界面的背景颜色作为锚点色值;
检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;所述目标像素点为所述网页界面中的全部或部分像素点;
若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
2.如权利要求1所述的方法,其特征在于,所述在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面,包括:
在加载所述网页界面的过程中检测加载时长是否达到预设时长,若检测到所述加载时长达到预设时长时获取所述网页界面;或
在加载所述网页界面的过程中检测所述网页界面的加载状态,若检测到所述加载状态为加载完成状态时获取所述网页界面。
3.如权利要求1所述的方法,其特征在于,所述检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同,包括:
从所述网页界面的像素点中筛选出部分像素点作为目标像素点;
检测每个所述目标像素点的像素色值是否与所述锚点色值相同。
4.如权利要求3所述的方法,其特征在于,所述从所述网页界面的像素点中筛选出部分像素点作为目标像素点,包括:
从所述网页界面的像素点中筛选出第一预设比例的像素点作为目标像素点;或
从所述网页界面的像素点中规则选取若干个像素点作为目标像素点;或
将所述网页界面等分成若干个子界面,从每个所述子界面中筛选出第二预设比例的像素点作为目标像素点;或
将所述网页界面等分成若干个子界面,从每个所述子界面中规则选取若干个像素点作为目标像素点;
其中,所述规则选取包括以下任一种方式:
每间隔预设个像素点选取一个目标像素点的方式;
每间隔预设行选取一行目标像素点的方式;
每间隔预设列选取一列目标像素点的方式。
5.如权利要求1至4任一项所述的方法,其特征在于,所述检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同,包括:
当所述像素色值和所述锚点色值用YUV表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,U值和V值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同;
当所述像素色值和所述锚点色值用RGB表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的R值,G值和B值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同;
当所述像素色值和所述锚点色值用YCbCr表示,则分别比对所述网页界面中每个目标像素点的所述像素色值与所述锚点色值的Y值,Cb值和Cr值;当三个值均相同,则所述目标像素点的所述像素色值与所述锚点色值相同。
6.如权利要求1所述的方法,其特征在于,所述检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同之前,还包括:
对所述网页界面进行压缩得到压缩图像;
相应的,所述检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同,包括:
检测所述压缩图像中每个目标像素点的像素色值是否与所述锚点色值相同。
7.一种网页界面白屏监测的装置,其特征在于,包括:
监听和检测模块,用于监听到跳转至网页界面的跳转指令,加载所述网页界面,在加载所述网页界面的过程中检测是否达到监测条件,当达到监测条件时获取所述网页界面;
锚点色值获取模块,用于获取所述网页界面的背景颜色作为锚点色值;
色值检测模块,用于检测所述网页界面中每个目标像素点的像素色值是否与所述锚点色值相同;所述目标像素点为所述网页界面中的全部或部分像素点;
结果生成模块,用于若所述目标像素点中所述像素色值与所述锚点色值相同的像素数量占比等于或大于预设比例,则生成所述网页界面为白屏的检测结果。
8.如权利要求7所述的装置,其特征在于,所述监听和检测模块具体用于:
在加载所述网页界面的过程中检测加载时长是否达到预设时长,若检测到所述加载时长达到预设时长时获取所述网页界面;或
在加载所述网页界面的过程中检测所述网页界面的加载状态,若检测到所述加载状态为加载完成状态时获取所述网页界面。
9.一种终端设备,包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现如权利要求1至6任一项所述的方法。
10.一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现如权利要求1至6任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910966510.7A CN110851350A (zh) | 2019-10-12 | 2019-10-12 | 网页界面白屏监测的方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910966510.7A CN110851350A (zh) | 2019-10-12 | 2019-10-12 | 网页界面白屏监测的方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN110851350A true CN110851350A (zh) | 2020-02-28 |
Family
ID=69597546
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910966510.7A Pending CN110851350A (zh) | 2019-10-12 | 2019-10-12 | 网页界面白屏监测的方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN110851350A (zh) |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111400134A (zh) * | 2020-03-11 | 2020-07-10 | 山东广电信通网络运营有限公司 | 一种确定目标显示终端播放异常的方法及系统 |
CN112181760A (zh) * | 2020-09-10 | 2021-01-05 | 北京三快在线科技有限公司 | 一种异常检测方法及装置 |
CN112559918A (zh) * | 2020-12-22 | 2021-03-26 | 平安银行股份有限公司 | 一种页面控制方法、装置、系统、设备及可读存储介质 |
CN114913649A (zh) * | 2021-02-09 | 2022-08-16 | 腾讯科技(深圳)有限公司 | 显示状态监控方法、装置、设备及计算机可读存储介质 |
Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105979092A (zh) * | 2016-05-13 | 2016-09-28 | 腾讯科技(深圳)有限公司 | 一种异常监控方法及装置 |
CN109634788A (zh) * | 2017-10-09 | 2019-04-16 | 阿里巴巴集团控股有限公司 | 一种终端适配验证方法及系统、终端 |
-
2019
- 2019-10-12 CN CN201910966510.7A patent/CN110851350A/zh active Pending
Patent Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105979092A (zh) * | 2016-05-13 | 2016-09-28 | 腾讯科技(深圳)有限公司 | 一种异常监控方法及装置 |
CN109634788A (zh) * | 2017-10-09 | 2019-04-16 | 阿里巴巴集团控股有限公司 | 一种终端适配验证方法及系统、终端 |
Cited By (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111400134A (zh) * | 2020-03-11 | 2020-07-10 | 山东广电信通网络运营有限公司 | 一种确定目标显示终端播放异常的方法及系统 |
CN112181760A (zh) * | 2020-09-10 | 2021-01-05 | 北京三快在线科技有限公司 | 一种异常检测方法及装置 |
CN112181760B (zh) * | 2020-09-10 | 2024-03-22 | 北京三快在线科技有限公司 | 一种异常检测方法及装置 |
CN112559918A (zh) * | 2020-12-22 | 2021-03-26 | 平安银行股份有限公司 | 一种页面控制方法、装置、系统、设备及可读存储介质 |
CN114913649A (zh) * | 2021-02-09 | 2022-08-16 | 腾讯科技(深圳)有限公司 | 显示状态监控方法、装置、设备及计算机可读存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US9697622B2 (en) | Interface adjustment method, apparatus, and terminal | |
CN110851350A (zh) | 网页界面白屏监测的方法及装置 | |
US10614772B2 (en) | Display method and terminal device | |
EP3499489B1 (en) | Method for display control and related products | |
CN110021256A (zh) | 显示亮度调整方法及相关产品 | |
CN104571979B (zh) | 一种实现分屏视图的方法和装置 | |
CN106911848B (zh) | 输出提示消息的方法与终端设备 | |
CN106993136B (zh) | 移动终端及其基于多摄像头的图像降噪方法和装置 | |
CN111176602B (zh) | 图片显示方法、装置、存储介质及智能设备 | |
CN103390034A (zh) | 图片展示的方法、装置、终端及服务器 | |
CN109814930A (zh) | 一种应用加载方法、装置及移动终端 | |
CN106296623A (zh) | 一种图片处理方法及装置 | |
US11915633B2 (en) | Screen color temperature control method, apparatus, storage medium, and mobile terminal | |
CN106445970B (zh) | 一种占位图的加载处理方法和装置 | |
CN109614173B (zh) | 一种换肤方法及装置 | |
CN113313804A (zh) | 一种图像渲染方法、装置、电子设备和存储介质 | |
CN113542825A (zh) | 投屏显示方法、系统、终端设备和存储介质 | |
CN112691363A (zh) | 一种云游戏跨终端切换的方法和相关装置 | |
CN106708390B (zh) | 一种截屏的方法、装置和系统 | |
CN109922256B (zh) | 拍摄方法及终端设备 | |
CN108920086B (zh) | 分屏退出方法、装置、存储介质和电子设备 | |
US11109008B2 (en) | Data transmission method, data loading device, data parsing device and data transmission system | |
CN107835336B (zh) | 双摄像头帧同步方法、装置、用户终端及存储介质 | |
CN110971822A (zh) | 图片处理方法、装置、终端设备及计算机可读存储介质 | |
CN103079047B (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 |