CN114564276A - 一种减少前端白屏方法和系统 - Google Patents

一种减少前端白屏方法和系统 Download PDF

Info

Publication number
CN114564276A
CN114564276A CN202210288002.XA CN202210288002A CN114564276A CN 114564276 A CN114564276 A CN 114564276A CN 202210288002 A CN202210288002 A CN 202210288002A CN 114564276 A CN114564276 A CN 114564276A
Authority
CN
China
Prior art keywords
field
type
null
configuration
data
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
Application number
CN202210288002.XA
Other languages
English (en)
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.)
Hangzhou Maycur Technologies Ltd
Original Assignee
Hangzhou Maycur Technologies 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 Hangzhou Maycur Technologies Ltd filed Critical Hangzhou Maycur Technologies Ltd
Priority to CN202210288002.XA priority Critical patent/CN114564276A/zh
Publication of CN114564276A publication Critical patent/CN114564276A/zh
Pending legal-status Critical Current

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
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/31Programming languages or programming paradigms
    • G06F8/315Object-oriented languages
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/70Software maintenance or management
    • G06F8/71Version control; Configuration management

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Computer Security & Cryptography (AREA)
  • Human Computer Interaction (AREA)
  • Computing Systems (AREA)
  • Information Retrieval, Db Structures And Fs Structures Therefor (AREA)

Abstract

本发明公开了一种减少前端白屏的方法系统,所述方法包括:生成对应数组和对象的空消息配置组件;接收前端接口的原始数据,并识别该原始数据的结构和类型;判断该原始数据是否存在null字段或undefiend字段;若存在则根据所述null字段或undefiend字段所属的类型和空消息配置组件进行配置;将不同类型的null字段或undefiend字段转换为相同类型字段。所述方法和系统通过设计一种数据配置规则,以及数据格式化的算法,将前端传输的导致白屏的访问无效对象转化为期望的格式,从而使得即使忘了进行判空处理,也不会得到错误的白屏结果。

Description

一种减少前端白屏方法和系统
技术领域
本发明涉及计算机技术领域,特别涉及一种减少前端白屏方法和系统。
背景技术
目前在主流前端框架中,对于组件渲染期间出现的代码执行错误,框架会避免渲染出错误的数据,而卸载整个组件树,导致页面白屏,这对用户很不友好。现有对减少前端白屏方法主要包括以下两种方法:一是避免白屏的出现,即程序出现错误时渲染出一个错误界面来告诉用户程序出现了错误;二是程序员在编写代码时注意代码的质量,页面白屏基本上是“由于后端返回数据的不确定性,而导致前端访问null对象上面的属性而出现TypeError”导致的,所以需要通过大量的判空操作等来避免错误的出现。其中第一种方法不能从根本上解决白屏的问题。第二种则对前端开发人员的代码质量要求较高,从而使得项目的开放成本较高。
发明内容
本发明其中一个发明目的在于提供一种减少前端白屏的方法和系统,所述方法和系统通过设计一种数据配置规则,以及数据格式化的算法,将前端传输的导致白屏的访问无效对象转化为期望的格式,从而使得即使忘了进行判空处理,也不会得到错误的白屏结果。
本发明另一个发明目的在于提供一种减少前端白屏的方法和系统,所述方法和系统通过递归函数对每一个原始数据进行遍历,识别每一原始数据的中格式类型,并对每一原始数据不同类型格式数据进行统一的格式修改,从而避免数据的类型错误而导致白屏现象。
本发明另一个发明目的在于提供一种减少前端白屏的方法和系统,所述方法和系统对不同格式的空信息分别进行对应的包括空数组和空对象的配置,并将配置后的空消息进行统一的格式替换,以避免错误数据类型导致前端白屏的出现。
为了实现至少一个上述发明目的,本发明进一步提供一种减少前端白屏的方法,所述方法包括:
生成对应数组和对象的空消息配置组件;
接收前端接口的原始数据,并识别该原始数据的结构和类型;
判断该原始数据是否存在null字段或undefiend字段;
若存在则根据所述null字段或undefiend字段所属的类型和空消息配置组件进行配置;
将不同类型的null字段或undefiend字段转换为相同类型字段。
根据本发明其中一个较佳实施例,在获取前端接口的原始数据后,判断前端原始数据中的数组类型和对象类型的数据,并进一步判断所述数组类型和对象类型的数据是否存在null字段或undefiend字段,若存在则调用所述空消息配置组件进行格式替换。
根据本发明另一个较佳实施例,所述方法设置递归函数用于遍历处理前端接口的原始数据,其中所述递归函数包括原始数据、字段配置方法和字段缓存,其中所述字段缓存用于保存字段配置后的数据。
根据本发明另一个较佳实施例,在获取到前端接口的原始数据后,获取字段配置,进一步判断该字段配置是否属于string类型,若是则读取所述字段配置中的refer所指向的字段,并将该refer所指向的字段从缓存中读取,用于格式化原始数据。
根据本发明另一个较佳实施例,若判断所述原始数据不属于string类型,则将该字段配置保存于字段配置缓存中,进一步判断该字段配置的数据类型,若为数组类型,则将每个数组中的元素都标记为item,并通过递归函数将所述数组中的元素进行格式化处理。
根据本发明另一个较佳实施例,若判断所述原始数据不属于string类型,则将该字段配置保存于字段配置缓存中,进一步判断该字段配置的数据类型,若为对象类型,则将每个对象中的元素都标记为item,并通过所述递归函数将所述对象中的元素进行格式化处理。
根据本发明另一个较佳实施例,在获取所述refer所指的字段后,将相同原始数据中的数组或对象类型通过所述refer配置转换为所述refer所指的字段类型的数据。
根据本发明另一个较佳实施例,若判断获取的原始数据中存在null字段或undefiend字段,通过所述空消息配置组件将对应字段配置为空对象或空数组,并进一步根据所述refer配置空对象或空数组的数据类型转换对应的refer所指的字段类型。
为了实现至少一个上述发明目的,本发明进一步提供一种减少前端白屏的系统,所述系统执行上述一种减少前端白屏的方法。
本发明进一步提供一种计算机可读存储介质,计算机可读存储介质存储有计算机程序,所述计算机程序可被处理器执行所述一种减少前端白屏的方法。
附图说明
图1显示的是本发明一种减少前端白屏的方法的流程示意图。
图2显示的是本发明中不同数据类型的递归处理方法流程示意图。
具体实施方式
以下描述用于揭露本发明以使本领域技术人员能够实现本发明。以下描述中的优选实施例只作为举例,本领域技术人员可以想到其他显而易见的变型。在以下描述中界定的本发明的基本原理可以应用于其他实施方案、变形方案、改进方案、等同方案以及没有背离本发明的精神和范围的其他技术方案。
可以理解的是,术语“一”应理解为“至少一”或“一个或多个”,即在一个实施例中,一个元件的数量可以为一个,而在另外的实施例中,该元件的数量可以为多个,术语“一”不能理解为对数量的限制。
请结合图1和图2,本发明公开了一种减少前端白屏的方法和系统,其中所述方法包括如下步骤:首先需要和前端接口建立通讯连接,用于获取前端接口的原始数据,其中所述前段接口的原始数据具有对应的格式。通过后端系统生成空消息配置组件,其中所述空消息配置组件用于对前端接口原始数据的特定消息进行配置替换。并进一步利用递归函数依次将每个原始数据都进行配置替换,直到所有的原始数据都被配置替换成统一格式的数据,从而可以有效地避免因为忘记判空而导致前端白屏的出现。
需要说明的是,由于返回的数据具有不确定性,对于某个期望有值的字段返回值可能为空值(null)或不确定值(undefiend);导致前端白屏的现象通常为类型错误(TypeError),主要是针对访问null对象上出现的属性错误。并且出现空的字段类型只能是对象和数组,也就是说本发明中针对的类型错误(TypeError)空字段只考虑访问某个对象上的属性,或者访问数组的长度、调用数组的api。对于基本数据类型,在访问其上面摸个属性本身就是错误的使用方式,本发明不予考虑。
进一步的,本发明预先配置递归函数来依次执行每个原始数据的格式配置替换,其中所述递归函数包括3个参数,分别为date(原始数据),config(字段配置)和cache(字段配置缓存)。在获取前端接口的原始数据后,首先判断所述字段配置的数据类型,本发明中,通过递归函数将config(字段配置)区分为string类型和非string类型,若判断所述字段配置为string类型,则读取字段配置config中的refer所指向的字段名,并从字段配置缓存中提取该字段的配置信息标记为referconfig,并调用递归函数依次对所有原始数据的格式化处理,其中所述原始数据的格式化处理包括,识别每一个原始数据中每个字段的数据类型,将原始数据的第一个字段作为参照字段类型,若同一原始数据中存在和第一个字段类型不同的字段类型,则将该不同的字段类型利用refer指令转换为和所述第一字段相同的字段类型。从而完成所述原始数据的统一的格式化处理操作。需要说明的是referconfig可以作为原始数据对应的字段配置标记。在本发明另一个较佳实施例中,可以进一步判断所述refer所指向的字段名的字段类型,并判断所有同一原始数据下的所有字段类型,若所述字段类型和所述refer所指向的字段名的字段类型不同,则将不同的字段类型通过refer指令将不同的字段类型引用为和refer所指向的字段名相同的字段类型。从而实现字段类型的统计。
若通过查询发现所述字段配置config字段类型为非string类型的字段,则进一步遍历所述字段配置的对象,其中将识别的所述非string类型的字段配置对象存储到字段配置缓存中,并进一步判断该字段配置的类型。若判断该字段配置类型为数组类型,则进一步判断原始数据中所有字段类型,以及判断原始数据中是否存在和字段配置缓存中相同的字段值,如存在则利用refer指令将原始数据中不同于数组的字段引用为和字段配置缓存中相同的数组字段类型。将更改后的原始数据中的第一个字段提取,将该第一个字段标记为arrconfig,并将每一个格式化的字段标记为item,利用递归函数对每个原始数据都进行字段配置值的对比、字段配置类型判断和字段配置类型的转换,从而实现数组类型的统一格式转换。
若通过查询发现所述字段配置config字段类型为非string类型的字段,将识别的所述非string类型的字段配置对象存储到字段配置缓存中,判断字段缓存中字段配置类型,若判断该字段配置类型为对象类型,则进一步查找所述原始数据中是否存在相同的对象字段类型,若原始数据中存在和字段配置缓存中相同的对象字段值,则将所述原始数据中所有的非对象类型的字段利用refer指令引用为对象类型的字段值,从而实现原始数据统一的对象字段类型的格式化处理。在完成所述原始数据统一的对象字段类型格式化处理后,进一步将格式化的字段标记为item,以及将字段配置缓存中的对象字段标记为curconfig,并利用递归函数将每一原始数据中存在对应缓存字段配置对象进行格式化处理得到最好的结果。
由于本发明只考虑字段类型为数组和对象类型,且每一原始数据在返回到前端的数据都为经过本发明格式化处理的数据,因此在前段不会出现TypeError错误。
值得一提的是,本发明进一步通过系统预先设置的空消息配置组件进行替换,用于避免空字段的错误类型导致前端白屏。本发明以如下实施例举例说明:获取接口的返回原始数据的结构为:{
Figure BDA0003560601930000051
进一步生成空消息配置组件,本发明优选采用JSON格式进行空消息配置组件的配置。若上述原始数据中的name字段为空,且children数组也为空,则当前接收到的原始数据结构为:
Figure BDA0003560601930000061
通过所述空消息配置组件可以将对象的空值null替换为{},并将数组的空值替换为[],因此通过所述空消息配置组件可以将上述原始数据结构替换为:
Figure BDA0003560601930000062
上述替换的原始数据结构表示,当“children”字段为空时,将它替换为空数组;当“name”字段为空时,将其替换为空对象。
由于存在“children”是数组字段,而“name”为对象字段,因此进一步在该替换后的数据结构后面采用refer指令进行字段配置类型的引用。比如上述字段可以引用“user”,从而实现如下最终的数据结构:
Figure BDA0003560601930000063
Figure BDA0003560601930000071
特别地,根据本发明公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括一种计算机程序产品,其包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信部分从网络上被下载和安装,和/或从可拆卸介质被安装。在该计算机程序被中央处理单元(CPU)执行时,执行本申请的方法中限定的上述功能。需要说明的是,本申请上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是但不限于电、磁、光、电磁、红外线段、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线段的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本申请中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本申请中,计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线段、电线段、光缆、RF等等,或者上述的任意合适的组合。
附图中的流程图和框图,图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
本领域的技术人员应理解,上述描述及附图中所示的本发明的实施例只作为举例而并不限制本发明,本发明的目的已经完整并有效地实现,本发明的功能及结构原理已在实施例中展示和说明,在没有背离所述原理下,本发明的实施方式可以有任何变形或修改。

Claims (10)

1.一种减少前端白屏的方法,其特征在于,所述方法包括:
生成对应数组和对象的空消息配置组件;
接收前端接口的原始数据,并识别该原始数据的结构和类型;
判断该原始数据是否存在null字段或undefiend字段;
若存在则根据所述null字段或undefiend字段所属的类型和空消息配置组件进行配置;
将不同类型的null字段或undefiend字段转换为相同类型字段。
2.根据权利要求1所述的一种减少前端白屏的方法,其特征在于,在获取前端接口的原始数据后,判断前端原始数据中的数组类型和对象类型的数据,并进一步判断所述数组类型和对象类型的数据是否存在null字段或undefiend字段,若存在则调用所述空消息配置组件进行格式替换。
3.根据权利要求1所述的一种减少前端白屏的方法,其特征在于,所述方法设置递归函数用于遍历处理前端接口的原始数据,其中所述递归函数包括原始数据、字段配置方法和字段缓存,其中所述字段缓存用于保存字段配置后的数据。
4.根据权利要求1所述的一种减少前端白屏的方法,其特征在于,在获取到前端接口的原始数据后,获取字段配置,进一步判断该字段配置是否属于string类型,若是则读取所述字段配置中的refer所指向的字段,并将该refer所指向的字段从缓存中读取,用于格式化原始数据。
5.根据权利要求4所述的一种减少前端白屏的方法,其特征在于,若判断所述字段配置不属于string类型,则将该字段配置保存于字段配置缓存中,进一步判断该字段配置的数据类型,若为数组类型,则将每个数组中的元素都标记为item,并通过递归函数将所述数组中的元素进行格式化处理。
6.根据权利要求4所述的一种减少前端白屏的方法,其特征在于,若判断所述字段配置不属于string类型,则将该字段配置保存于字段配置缓存中,进一步判断该字段配置的数据类型,若为对象类型,则将每个对象中的元素都标记为item,并通过递归函数将所述对象中的元素进行格式化处理。
7.根据权利要求4所述的一种减少前端白屏的方法,其特征在于,在获取所述refer所指的字段后,将相同原始数据中的数组或对象类型通过所述refer配置转换为所述refer所指的字段类型的数据。
8.根据权利要求4所述的一种减少前端白屏的方法,其特征在于,若判断获取的原始数据中存在null字段或undefiend字段,通过所述空消息配置组件将对应字段配置为空对象或空数组,并进一步根据所述refer配置空对象或空数组的数据类型转换对应的refer所指的字段类型。
9.一种减少前端白屏的系统,其特征在于,所述系统执行权利要求1-8中任意一项所述的一种减少前端白屏的方法。
10.一种计算机可读存储介质,其特征在于,计算机可读存储介质存储有计算机程序,所述计算机程序可被处理器执行权利要求1-8中任意一项所述的一种减少前端白屏的方法。
CN202210288002.XA 2022-03-23 2022-03-23 一种减少前端白屏方法和系统 Pending CN114564276A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210288002.XA CN114564276A (zh) 2022-03-23 2022-03-23 一种减少前端白屏方法和系统

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210288002.XA CN114564276A (zh) 2022-03-23 2022-03-23 一种减少前端白屏方法和系统

Publications (1)

Publication Number Publication Date
CN114564276A true CN114564276A (zh) 2022-05-31

Family

ID=81718884

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210288002.XA Pending CN114564276A (zh) 2022-03-23 2022-03-23 一种减少前端白屏方法和系统

Country Status (1)

Country Link
CN (1) CN114564276A (zh)

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130067155A1 (en) * 2011-09-09 2013-03-14 International Business Machines Corporation Memory Type-Specific Access Control Of A Field Of A Record
US20200104386A1 (en) * 2018-09-27 2020-04-02 International Business Machines Corporation Binary large object platform for interactively analyzing and editing structural metadata
CN112114807A (zh) * 2020-09-28 2020-12-22 腾讯科技(深圳)有限公司 界面显示方法、装置、设备及存储介质
CN113254023A (zh) * 2021-05-14 2021-08-13 网易(杭州)网络有限公司 对象读取方法、装置和电子设备
CN113641359A (zh) * 2021-08-30 2021-11-12 北京沃东天骏信息技术有限公司 一种数据处理方法和装置
CN113821209A (zh) * 2021-09-15 2021-12-21 珠海格力电器股份有限公司 交互数据的处理方法、装置、电子设备和存储介质

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130067155A1 (en) * 2011-09-09 2013-03-14 International Business Machines Corporation Memory Type-Specific Access Control Of A Field Of A Record
US20200104386A1 (en) * 2018-09-27 2020-04-02 International Business Machines Corporation Binary large object platform for interactively analyzing and editing structural metadata
CN112114807A (zh) * 2020-09-28 2020-12-22 腾讯科技(深圳)有限公司 界面显示方法、装置、设备及存储介质
CN113254023A (zh) * 2021-05-14 2021-08-13 网易(杭州)网络有限公司 对象读取方法、装置和电子设备
CN113641359A (zh) * 2021-08-30 2021-11-12 北京沃东天骏信息技术有限公司 一种数据处理方法和装置
CN113821209A (zh) * 2021-09-15 2021-12-21 珠海格力电器股份有限公司 交互数据的处理方法、装置、电子设备和存储介质

Similar Documents

Publication Publication Date Title
US10579344B2 (en) Converting visual diagrams into code
CN107624180B (zh) 用于提取和共享应用程序有关的用户数据的系统和方法
CN108334609B (zh) Oracle中实现JSON格式数据存取的方法、装置、设备及存储介质
CN108595680B (zh) Xbrl的缓存的实现方法
CN106648569B (zh) 目标序列化实现方法和装置
CN111324619B (zh) 微服务系统中的对象更新方法、装置、设备和存储介质
CN109460220A (zh) 报文预定义代码生成方法、装置、电子设备和存储介质
CN109614088B (zh) 表单组件生成方法及装置
CN112925749A (zh) 一种数据处理方法、装置、电子设备及存储介质
US11222067B2 (en) Multi-index method and apparatus, cloud system and computer-readable storage medium
CN110263104B (zh) Json字符串处理方法及装置
CN112182036A (zh) 数据的发送与写入方法、装置、电子设备及可读存储介质
CN109063091B (zh) 混合编码的数据迁移方法、数据迁移装置和存储介质
CN110008462B (zh) 一种命令序列检测方法及命令序列处理方法
CN112671878B (zh) 一种区块链的信息订阅方法、装置、服务器和存储介质
CN110764685B (zh) 用于识别二维码的方法和设备
CN113220281A (zh) 一种信息生成方法、装置、终端设备及存储介质
CN112883088B (zh) 一种数据处理方法、装置、设备及存储介质
CN114564276A (zh) 一种减少前端白屏方法和系统
CN109005469B (zh) 一种消息格式的转换方法、装置、存储介质及安卓终端
CN111124883A (zh) 一种基于树形表格的测试用例库引入方法、系统及设备
CN110704635A (zh) 一种知识图谱中三元组数据的转换方法及装置
CN110795915B (zh) xml文件批量修改方法、系统、设备和计算机可读存储介质
CN115099196A (zh) 报文转化为数据实体的方法及装置
CN114880523A (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