页面缓存方法、装置、电子设备及计算机可读存储介质与流程

1.本技术涉及计算机技术领域，尤其涉及一种页面缓存方法、装置、电子设备及计算机可读存储介质。


背景技术：

2.随着计算机技术的不断发展，出现了众多的网页应用，用户可以通过这些网页应用完成各式各样的业务，如网银预支付、支付授权、促销、交易和投资等业务。
3.在实际应用中，用户需要保留之前的页面状态，如筛选状态和编辑状态，而在页面发生跳转之后，再回到之前保留的页面状态。目前通常采用将页面的状态数据存在浏览器地址栏内，回到原页面时再进行还原。
4.但是，将缓存数据存在浏览器内，首先会使业务代码变得更加复杂，需要重新计算以及需要向后端服务发送请求，无法满足复杂页面的状态缓存，造成了不必要的浪费和降低应用的使用性能。


技术实现要素：

5.为了解决上述技术问题，本技术实施例提供了一种可用于金融科技或其他相关领域的页面缓存方法、装置、电子设备及计算机可读存储介质。
6.第一方面，本技术实施例提供了一种页面缓存方法，所述方法包括：
7.获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；
8.通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；
9.通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；
10.若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；
11.若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。
12.根据本技术公开的一种具体实施方式，所述通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom，包括：
13.获取所述待缓存页面的多条缓存数据和各缓存数据的id；
14.根据所述id确定目标待缓存页面；
15.将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。
16.根据本技术公开的一种具体实施方式，所述将所述第一真实dom进行缓存，包括：
17.以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。
18.根据本技术公开的一种具体实施方式，所述实时缓存组件还包括dom缓存组件，所
述方法还包括：
19.将所述第一真实dom和所述第二真实dom存入所述dom缓存组件。
20.根据本技术公开的一种具体实施方式，所述通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存，包括：
21.获取所述待缓存页面的id；
22.根据所述待缓存页面的id判断所述待缓存页面是否被缓存。
23.第二方面，本技术实施例提供了一种页面缓存装置，所述装置包括：
24.获取模块，用于获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；
25.渲染模块，用于通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；
26.判断模块，用于通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存；
27.第一缓存模块，用于若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；
28.第二缓存模块，用于若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。
29.第三方面，本技术实施例提供了一种电子设备，包括存储器以及处理器，所述存储器用于存储计算机程序，所述计算机程序在所述处理器运行时执行第一方面提供的页面缓存方法。
30.第四方面，本技术实施例提供了一种计算机可读存储介质，其存储有计算机程序，所述计算机程序在处理器上运行时执行第一方面提供的页面缓存方法。
31.上述本技术提供的页面缓存方法，通过获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。
附图说明
32.为了更清楚地说明本技术的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本技术的某些实施例，因此不应被看作是对本技术保护范围的限定。在各个附图中，类似的构成部分采用类似的编号。
33.图1示出了本技术实施例提供的一种页面缓存方法的流程示意图；
34.图2示出了本技术实施例提供的另一种页面缓存方法的流程示意图；
35.图3示出了本技术实施例提供的再一种页面缓存方法的流程示意图；
36.图4示出了本技术实施例提供的页面缓存装置的结构示意图；
37.图5示出了本技术实施例提供的电子设备的结构示意图。
具体实施方式
38.下面将结合本技术实施例中附图，对本技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本技术一部分实施例，而不是全部的实施例。
39.通常在此处附图中描述和示出的本技术实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本技术的实施例的详细描述并非旨在限制要求保护的本技术的范围，而是仅仅表示本技术的选定实施例。基于本技术的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本技术保护的范围。
40.在下文中，可在本技术的各种实施例中使用的术语“包括”、“具有”及其同源词仅意在表示特定特征、数字、步骤、操作、元件、组件或前述项的组合，并且不应被理解为首先排除一个或更多个其它特征、数字、步骤、操作、元件、组件或前述项的组合的存在或增加一个或更多个特征、数字、步骤、操作、元件、组件或前述项的组合的可能性。
41.此外，术语“第一”、“第二”、“第三”等仅用于区分描述，而不能理解为指示或暗示相对重要性。
42.除非另有限定，否则在这里使用的所有术语(包括技术术语和科学术语)具有与本技术的各种实施例所属领域普通技术人员通常理解的含义相同的含义。所述术语(诸如在一般使用的词典中限定的术语)将被解释为具有与在相关技术领域中的语境含义相同的含义并且将不被解释为具有理想化的含义或过于正式的含义，除非在本技术的各种实施例中被清楚地限定。
43.实施例1
44.本技术实施例提供了一种页面缓存方法。
45.参见图1，所述页面缓存方法包括：
46.步骤s101，获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件。
47.可以理解地，所述keepaliveprovider组件中包括待缓存页面的多条缓存数据及各缓存数据的id，所述待缓存页面包括用户在进行业务操作的当前页面和用户在当前页面进行操作后的跳转页面。例如，用户在业务处理编辑页面对业务进行操作，所述操作包括删除、确定、下单等，在点击后该当前页面会根据不同的操作对应跳转至不同的跳转页面，通过所述withkeepalive组件对所述当前页面和所述跳转页面的id进行渲染，得到相应的第一真实dom和第二真实dom，缓存该当前页面和跳转后的跳转页面的第一真实dom和第二真实dom，即能够保留该当前页面和跳转后的跳转页面的状态。
48.步骤s102，通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom。
49.具体地，所述第一真实dom是指一种与平台和语言无关的应用程序接口，可以动态地访问程序和脚本，是一种基于树的api文档，所述第一真实dom中包括了待缓存页面中的状态。
50.参见图2，在一实施方式中，所述通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom，包括：
51.步骤s1021，获取所述待缓存页面的多条缓存数据和各缓存数据的id。
52.步骤s1022，根据所述id确定目标待缓存页面。
53.步骤s1023，将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。
54.进一步地，所述渲染是指通过计算机软件从模型生成图像的过程，根据待缓存页面的id将所述待缓存页面进行渲染得到所述待缓存页面的真实dom。
55.步骤s103，通过所述withkeepalive组件判断所述待缓存页面是否已被缓存。
56.参见图3，在一实施方式中，所述通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存，包括：
57.步骤s1031，获取所述待缓存页面的id。
58.步骤s1032，根据所述待缓存页面的id判断所述待缓存页面是否被缓存。
59.步骤s104，若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存。
60.在一实施方式中，所述将所述第一真实dom进行缓存，包括：
61.以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。
62.步骤s105，若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。
63.在一实施方式中，所述实时缓存组件还包括dom缓存组件，所述方法还包括：
64.将所述第一真实dom和所述第二真实dom存入所述dom缓存组件。
65.在一实施方式中，将一个代码文件缓存一次。在当前第一页面处理相关业务时，能够缓存一个前端路由指向的第二页面，并且缓存该第二页面的状态。即在第一页面中进行筛选分页、编辑或删除等操作后，离开该第一页面前往第二页面，再次回到所述第一页面时，之前的页面状态依旧能够保存。
66.进一步地，将同一个代码文件缓存多次。在实际操作中，一张列表页面中每一行的右侧操作列中存在一个编辑按钮，由于编辑页的表单和交互较多且复杂，所以每一次点击编辑都会跳转至一个独立的编辑页面，通过确定该独立的编辑页面的真实dom并且进行缓存来保存该独立页面的状态，后续跳转至编辑页面后依旧能够保留之前的工作状态。
67.本实施例提供的页面缓存方法，通过获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。
68.实施例2
69.此外，如图4所示，本技术实施例提供了一种页面缓存装置400，所述页面缓存装置400包括：
70.获取模块401，用于获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；
71.渲染模块402，用于通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；
72.判断模块403，用于通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存；
73.第一缓存模块404，用于若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；
74.第二缓存模块405，用于若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。
75.具体地，所述渲染模块402具体用于：
76.获取所述待缓存页面的多条缓存数据和各缓存数据的id；
77.根据所述id确定目标待缓存页面；
78.将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。
79.具体地，所述第一缓存模块404具体用于：
80.以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。
81.本实施例提供的页面缓存装置400可以实现实施例1所提供的页面缓存方法，为避免重复，在此不再赘述。
82.本实施例提供的页面缓存装置400，通过获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。
83.实施例3
84.此外，本技术实施例提供了一种电子设备500，包括存储器503以及处理器502，所述存储器503存储有计算机程序，所述计算机程序在所述处理器502上运行时执行实施例1所提供的页面缓存方法。
85.具体的，参见图5，所述电子设备500包括：收发机501、总线接口及处理器502，所述处理器502，用于：
86.获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；
87.通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；
88.通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；
89.若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；
90.若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。
91.在一实施方式中，所述处理器502还用于：
92.获取所述待缓存页面的多条缓存数据和各缓存数据的id；
93.根据所述id确定目标待缓存页面；
94.将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。
95.在一实施方式中，所述处理器502还用于：
96.以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。
97.在一实施方式中，所述处理器502还用于：
98.将所述第一真实dom和所述第二真实dom存入所述dom缓存组件。
99.在一实施方式中，所述处理器502还用于：
100.获取所述待缓存页面的id；
101.根据所述待缓存页面的id判断所述待缓存页面是否被缓存。
102.在本发明实施例中，电子设备500还包括：存储器503。在图5中，总线架构可以包括任意数量的互联的总线和桥，具体由处理器502代表的一个或多个处理器和存储器503代表的存储器的各种电路链接在一起。总线架构还可以将诸如外围设备、稳压器和功率管理电路等之类的各种其他电路链接在一起，这些都是本领域所公知的，因此，本文不再对其进行进一步描述。总线接口提供接口。收发机501可以是多个元件，即包括发送机和接收机，提供用于在传输介质上与各种其他装置通信的单元。处理器502负责管理总线架构和通常的处理，存储器503可以存储处理器502在执行操作时所使用的数据。
103.本发明实施例提供的电子设备500，可以执行上述方法实施例1所提供的页面缓存方法的步骤，为避免重复，在此不再赘述。
104.本实施例提供的电子设备500，通过获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。
105.实施例4
106.本技术还提供一种计算机可读存储介质，所述计算机可读存储介质上存储计算机程序，所述计算机程序被处理器执行时实现实施例1所提供的页面缓存方法。
107.在本实施例中，计算机可读存储介质可以为只读存储器(read-only memory，简称rom)、随机存取存储器(random access memory，简称ram)、磁碟或者光盘等。
108.本实施例提供的计算机可读存储介质可以实现实施例1所提供的页面缓存方法，为避免重复，在此不再赘述。
109.本技术提供的计算机可读存储介质，通过获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。
110.需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者终端不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者终端所固有的要素。在没有更多限制的情况下，由语句“包括一个
……”
限定的要素，并不排除在包括该要素的过程、方法、物品或者终端中还存在另外的相同要素。
111.通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本技术的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如rom/ram、磁碟、光盘)中，包括若干指令用以使得一台终端(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本技术各个实施例所述的方法。
112.上面结合附图对本技术的实施例进行了描述，但是本技术并不局限于上述的具体实施方式，上述的具体实施方式仅仅是示意性的，而不是限制性的，本领域的普通技术人员在本技术的启示下，在不脱离本技术宗旨和权利要求所保护的范围情况下，还可做出很多形式，均属于本技术的保护之内。

技术特征：
1.一种页面缓存方法，其特征在于，所述方法包括：获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；通过所述withkeepalive组件判断所述待缓存页面是否已被缓存；若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。2.根据权利要求1所述的页面缓存方法，其特征在于，所述通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom，包括：获取所述待缓存页面的多条缓存数据和各缓存数据的id；根据所述id确定目标待缓存页面；将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。3.根据权利要求1所述的页面缓存方法，其特征在于，所述将所述第一真实dom进行缓存，包括：以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。4.根据权利要求1所述的页面缓存方法，其特征在于，所述实时缓存组件还包括dom缓存组件，所述方法还包括：将所述第一真实dom和所述第二真实dom存入所述dom缓存组件。5.根据权利要求1所述的页面缓存方法，其特征在于，所述通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存，包括：获取所述待缓存页面的id；根据所述待缓存页面的id判断所述待缓存页面是否被缓存。6.一种页面缓存装置，其特征在于，所述装置包括：获取模块，用于获取实时缓存组件，其中，所述实时缓存组件包括keepaliveprovider组件和withkeepalive组件；渲染模块，用于通过所述keepaliveprovider组件确定待缓存页面，将所述待缓存页面进行渲染，得到所述待缓存页面的第一真实dom；判断模块，用于通过所述withkeepalive组件判断所述待缓存页面的是否已被缓存；第一缓存模块，用于若所述待缓存页面已被缓存，则获取所述待缓存页面的第一真实dom，并将所述第一真实dom进行缓存；第二缓存模块，用于若所述待缓存页面未被缓存，则通过所述keepaliveprovider组件将所述待缓存页面进行渲染，得到所述待缓存页面的第二真实dom，并将所述第二真实dom进行缓存。7.根据权利要求6所述的装置，其特征在于，所述渲染模块具体用于：
获取所述待缓存页面的多条缓存数据和各缓存数据的id；根据所述id确定目标待缓存页面；将所述目标待缓存页面进行渲染，得到所述目标待缓存页面的第一真实dom。8.根据权利要求6所述的装置，其特征在于，所述第一缓存模块具体用于：以key\value的方式存储所述dom，其中，所述key为id，所述value为所述实时缓存组件对应的dom树。9.一种电子设备，其特征在于，包括存储器以及处理器，所述存储器存储有计算机程序，所述计算机程序在所述处理器运行时执行权利要求1至5中任一项所述的页面缓存方法。10.一种计算机可读存储介质，其特征在于，其存储有计算机程序，所述计算机程序在处理器上运行时执行权利要求1至5中任一项所述的页面缓存方法。

技术总结
本申请实施例提供了一种页面缓存方法、装置、电子设备及计算机可读存储介质，通过获取实时缓存组件，实时缓存组件包括KeepAliveProvider组件和WithKeepAlive组件；通过KeepAliveProvider组件确定待缓存页面，将待缓存页面进行渲染得到第一真实dom；通过WithKeepAlive组件判断待缓存页面是否已被缓存；若已被缓存，则获取并缓存第一真实dom；若未被缓存，通过KeepAliveProvider组件将待缓存页面进行渲染得到第二真实dom，并将第二真实dom进行缓存，能够提升页面保留复杂状态的能力，减少了浏览器内存的消耗，提高了浏览器的使用性能。的使用性能。的使用性能。


技术研发人员：程旭照 冯二颍 黄云
受保护的技术使用者：平安银行股份有限公司
技术研发日：2023.06.15
技术公布日：2023/9/12