H5导航栏按钮配置方法、装置、计算机设备及存储介质与流程

本发明涉及混合模式移动应用技术领域，尤其涉及一种h5导航栏按钮配置方法、装置、计算机设备及存储介质。

背景技术：

在app(即应用程序)中每进入一个h5页面(h5即html5，是第5个版本的描述网页的标准语言，h5可以形象的理解为网页文件集合，该网页文件集合一般包括描述了网页中的基本构成元素以及这些元素的结构的网页文件、描述了网页的外观的css文件和描述了网页的功能或行为的js文件)，在h5页面中导航栏左上角的按钮都是本地自动加上的返回按钮，如果有h5页面的导航栏需要定制按钮，则需app的nativeapp端(即本地app端)对某个页面判断，然后加上相应的按钮，但是上述方式存在以下缺陷：

1)如果某一h5页面的导航栏需改动，会导致客户端发布新版本才能实现；

2)对于不同的平台入口，可能某一页面导航栏按钮配置不一样，客户端不易判断采取何种导航栏按钮配置；

3)部分h5页面导航栏的返回按钮是在页面全部加载完成才允许显示出来，采取统一的返回按钮配置无法达到使用需求。

技术实现要素：

本发明实施例提供了一种h5导航栏按钮配置方法、装置、计算机设备及存储介质，旨在解决现有技术中h5导航栏按钮配置无法实时修改且无法适配多种应用程序的平台入口的问题。

第一方面，本发明实施例提供了一种h5导航栏按钮配置方法，其包括：

获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息；

解析所述json格式配置信息中所包括的页面导航键的设置信息；

将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据；

根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

第二方面，本发明实施例提供了一种h5导航栏按钮配置装置，其包括：

配置信息生成单元，用于获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息；

配置信息解析单元，用于解析所述json格式配置信息中所包括的页面导航键的设置信息；

集合数据获取单元，用于将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据；

h5页面生成单元，用于根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

第三方面，本发明实施例又提供了一种计算机设备，其包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述第一方面所述的h5导航栏按钮配置方法。

第四方面，本发明实施例还提供了一种计算机可读存储介质，其中所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行上述第一方面所述的h5导航栏按钮配置方法。

本发明实施例提供了一种h5导航栏按钮配置方法、装置、计算机设备及存储介质。该方法采用json格式配置信息来控制导航栏按钮以及整个h5页面的自定义需求，实现了在推出新页面时，h5下发整个页面的json格式配置信息以及待推出的h5页面，无需客户端再发版本，且满足各种h5自定义的需求。

附图说明

为了更清楚地说明本发明实施例技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的h5导航栏按钮配置方法的流程示意图；

图2为本发明实施例提供的h5导航栏按钮配置方法的子流程示意图；

图3为本发明实施例提供的h5导航栏按钮配置方法的另一子流程示意图；

图4为本发明实施例提供的h5导航栏按钮配置方法的另一流程示意图；

图5为本发明实施例提供的h5导航栏按钮配置装置的示意性框图；

图6为本发明实施例提供的h5导航栏按钮配置装置的子单元示意性框图；

图7为本发明实施例提供的h5导航栏按钮配置装置的另一子单元示意性框图；

图8为本发明实施例提供的h5导航栏按钮配置装置的另一示意性框图；

图9为本发明实施例提供的计算机设备的示意性框图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

应当理解，当在本说明书和所附权利要求书中使用时，术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在，但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。

还应当理解，在此本发明说明书中所使用的术语仅仅是出于描述特定实施例的目的而并不意在限制本发明。如在本发明说明书和所附权利要求书中所使用的那样，除非上下文清楚地指明其它情况，否则单数形式的“一”、“一个”及“该”意在包括复数形式。

还应当进一步理解，在本发明说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合，并且包括这些组合。

为了更清楚的理解本申请的技术方案，在具体介绍本申请的技术方案之前对所需了解的技术背景进行简要介绍。

webapp是一种框架型app开发模式(html5app框架开发模式，即h5app)，该开发具有跨平台的优势，该模式通常由“html5云网站+app应用客户端”两部分构成，app应用客户端只需安装应用的框架部分，而应用的数据则是每次打开app的时候，去云端取数据呈现给手机用户。

原生app又称nativeapp(即本地app)，该开发针对ios、android、windows等不同的手机操作系统要采用不同的语言和框架进行开发，该模式通常是由“云服务器数据+app应用客户端”两部分构成，app应用所有的ui元素、数据内容、逻辑框架均安装在手机终端上。

hybridapp(混合模式移动应用)是指介于webapp、nativeapp这两者之间的app，兼具“nativeapp良好用户交互体验的优势”和“webapp跨平台开发的优势”，即hybridapp既包括h5页面端、也包括本地应用端(即nativeapp)。

请参阅图1，图1是本发明实施例提供的h5导航栏按钮配置方法的流程示意图，该h5导航栏按钮配置方法应用于智能终端中，该方法通过安装于智能终端中的应用软件进行执行。

如图1所示，该方法包括步骤s110～s140。

s110、获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息。

在本实施例中，是在用户的智能终端(如智能手机，平板电脑等)上所安装的hybridapp中h5页面端选择h5页面自定义配置选项，由该配置选项进入h5页面自定义导航栏按钮的设置，完成了入h5页面自定义导航栏按钮的设置后，根据页面导航键的参数信息对应生成json格式配置信息。其中，页面导航键的参数信息包括导航键在h5页面中所处位置(一般是导航键的中心点在h5页面中的坐标)、导航键在h5页面中尺寸参数(一般是导航键在h5页面中上所显示的长度和宽度)、导航键所链接的目标地址(该目标地址一般是点击导航键需跳转的下一h5页面，或是点击导航键所跳转的本地app页面)、导航键的显示颜色参数(即该导航键以何种颜色来显示，可以是纯色，也可以是混合色)。

在一实施例中，如图2所示，步骤s110包括：

s111、获取所设置的导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；

s112、将导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至预先配置的json格式模板，得到json格式配置信息。

在本实施例中，之所以选取json格式的配置信息，是因为json(全称为javascriptobjectnotation,表示js对象简谱)是一种轻量级的数据交换格式。它基于ecmascript(欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得json成为理想的数据交换语言，其易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。

例如，所生成的json格式配置信息如下：

其中，"backgroundtextstyle":"light"表示背景文本风格设置为light(浅色)，"navigationbarbackgroundcolor":"#fff"表示设置系统导航栏的背景色的像素值设置为#fff(白色)，"navigationbartitletext":"xxx"表示设置系统导航栏的标题文本为xxx(用户设置的标题文本)，"navigationbartextstyle":"black"表示设置系统导航栏的标题字体颜色为balck(黑色)。

由于只需通过设置页面导航键的参数信息，即可快速得到json格式配置信息，通过json格式配置信息来控制h5页面的页面导航键的自定义生成，无需对hybridapp的客户端版本进行更新，简化了配置过程。

在一实施例中，如图4所示，步骤s110之前还包括：

s101、若检测到h5页面自定义配置指令，获取所录入的页面导航键的参数信息，或者获取所设置的h5导航栏按钮及对所述h5导航栏按钮设置的页面导航键的参数信息。

在本实施例中，在获取在h5页面中所配置的页面导航键的参数信息，至少有以下两种实现方式：

一是采用填写每一页面导航键的参数信息的配置方式，即用户可先选择配置几个页面导航键，针对每一页面导航键均填写如上所述的参数信息，在配置完成后在h5页面上显示配置效果。这种采用填空式的配置方式，是一种针对配置人员技术要求较高的配置方式，需配置人员清楚了解到该h5页面的详细参数才能进行精准配置。

二是采用自定义拖拽导航键的配置方式，即用户可以先选择配置几个页面导航键后，在h5页面上初始生成对应个数的页面导航键，之后用户每通过触控选定一个页面导航键，可以将其拖拽至h5页面的目标区域，并通过缩放的方式调整页面导航键的尺寸参数，在完成导航键在h5页面中所处位置及导航键在h5页面中尺寸参数的设置后，通过导航键所链接的目标地址的第一编辑框填写每一页面导航键的目标地址，并通过导航键的显示颜色参数的第二编辑框填写每一页面导航键的显示颜色参数。

当完成了上述页面导航键的参数信息的配置后，将其转化为json格式配置信息。具体的，通过css中的position：fixed来实现导航键在h5页面中所处位置的设置，例如：

<style>.foot-menu{width:100％；height:60px；background:#000；position:fixed；bottom:0；/**距离底部为0*/left:0；z-index:1；}</style><divclass＝"foot-menu"><！---导航具体内容--></div>；

通过自定义完成页面导航键的参数信息，即可将其自动转化为json格式配置信息发送至hybridapp中本地应用端(即nativeapp)。

s120、解析所述json格式配置信息中所包括的页面导航键的设置信息。

在本实施例中，是hybridapp中本地应用端(即nativeapp)获取h5页面端所上传的json格式配置信息，解析所述json格式配置信息中所包括的页面导航键的设置信息，本质上页面导航键的设置信息与页面导航键的参数信息是相同的，不同点在于页面导航键的参数信息是用户在h5页面端原始设置的参数，而页面导航键的设置信息则是由所述json格式配置信息解析得到的。

s130、将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据。

在本实施例中，为了生成h5页面，需获取h5页面对应的网页文件集合数据，即包括描述了网页中的基本构成元素以及这些元素的结构的网页文件、描述了网页的外观的css文件和描述了网页的功能或行为的js文件。由于css文件和js文件是已预先设置好的，故只需将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件中，即可得到完整的自定义h5页面网页文件集合数据，实现了以json格式配置信息为载体来快速修改网页文件集合数据。

在一实施例中，如图3所示，步骤s130包括：

s131、将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数分别定位在网页文件集合数据中的填充区域；

s132、根据导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数根据对应的填充区域，分别填充至网页文件集合数据，得到自定义h5页面网页文件集合数据。

在本实施例中，为了精准的将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至网页文件集合数据中，需根据网页文件集合数据中的各组成文件的分区来定位上述参数的填充位置。例如网页文件集合数据中的第一大分区为网页文件区，第二大分区为css文件区，第三大分区为js文件区。第一大分区对应的网页文件区又分为至少4个小分区，分别对应导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数的录入区。通过上述精准定位和填充，即可得到自定义h5页面网页文件集合数据。

s140、根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

在一实施例中，步骤s140中包括：根据所述自定义h5页面网页文件集合数据中包括的网页文件、css文件和js文件文件，对应生成当前h5页面。

在本实施例中，当获取了描述了网页中的基本构成元素以及这些元素的结构的网页文件、描述了网页的外观的css文件和描述了网页的功能或行为的js文件，即可以h5页面端作为容器，将网页文件、css文件和js文件文件作为容器内所装载的具体内容，由h5页面端的页面生成功能自动生成当前h5页面，以实现通过json格式配置信息来控制h5页面的页面导航键的自定义生成。

该方法采用json格式配置信息来控制导航栏按钮以及整个h5页面的自定义需求,实现了在推出新页面时，h5下发整个页面的json格式配置信息以及待推出的h5页面，无需客户端再发版本。

本发明实施例还提供一种h5导航栏按钮配置装置，该h5导航栏按钮配置装置用于执行前述h5导航栏按钮配置方法的任一实施例。具体地，请参阅图5，图5是本发明实施例提供的h5导航栏按钮配置装置的示意性框图。该h5导航栏按钮配置装置100可以配置于智能终端中。

如图5所示，h5导航栏按钮配置装置100包括配置信息生成单元110、配置信息解析单元120、集合数据获取单元130、h5页面生成单元140。

配置信息生成单元110，用于获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息。

在本实施例中，是在用户的智能终端(如智能手机，平板电脑等)上所安装的hybridapp中h5页面端选择h5页面自定义配置选项，由该配置选项进入h5页面自定义导航栏按钮的设置，完成了入h5页面自定义导航栏按钮的设置后，根据页面导航键的参数信息对应生成json格式配置信息。其中，页面导航键的参数信息包括导航键在h5页面中所处位置(一般是导航键的中心点在h5页面中的坐标)、导航键在h5页面中尺寸参数(一般是导航键在h5页面中上所显示的长度和宽度)、导航键所链接的目标地址(该目标地址一般是点击导航键需跳转的下一h5页面，或是点击导航键所跳转的本地app页面)、导航键的显示颜色参数(即该导航键以何种颜色来显示，可以是纯色，也可以是混合色)。

在一实施例中，如图6所示，配置信息生成单元110包括：

参数获取单元111，用于获取所设置的导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；

json配置获取单元112，用于将导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至预先配置的json格式模板，得到json格式配置信息。

在本实施例中，之所以选取json格式的配置信息，是因为json(全称为javascriptobjectnotation,表示js对象简谱)是一种轻量级的数据交换格式。它基于ecmascript(欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得json成为理想的数据交换语言，其易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。

由于只需通过设置页面导航键的参数信息，即可快速得到json格式配置信息，通过json格式配置信息来控制h5页面的页面导航键的自定义生成，无需对hybridapp的客户端版本进行更新，简化了配置过程。

在一实施例中，如图8所示，h5导航栏按钮配置装置100还包括：

自定义配置单元101，用于若检测到h5页面自定义配置指令，获取所录入的页面导航键的参数信息，或者获取所设置的h5导航栏按钮及对所述h5导航栏按钮设置的页面导航键的参数信息。

在本实施例中，在获取在h5页面中所配置的页面导航键的参数信息，至少有以下两种实现方式：

一是采用填写每一页面导航键的参数信息的配置方式，即用户可先选择配置几个页面导航键，针对每一页面导航键均填写如上所述的参数信息，在配置完成后在h5页面上显示配置效果。这种采用填空式的配置方式，是一种针对配置人员技术要求较高的配置方式，需配置人员清楚了解到该h5页面的详细参数才能进行精准配置。

二是采用自定义拖拽导航键的配置方式，即用户可以先选择配置几个页面导航键后，在h5页面上初始生成对应个数的页面导航键，之后用户每通过触控选定一个页面导航键，可以将其拖拽至h5页面的目标区域，并通过缩放的方式调整页面导航键的尺寸参数，在完成导航键在h5页面中所处位置及导航键在h5页面中尺寸参数的设置后，通过导航键所链接的目标地址的第一编辑框填写每一页面导航键的目标地址，并通过导航键的显示颜色参数的第二编辑框填写每一页面导航键的显示颜色参数。

当完成了上述页面导航键的参数信息的配置后，将其转化为json格式配置信息。具体的，通过css中的position：fixed来实现导航键在h5页面中所处位置的设置，例如：

<style>.foot-menu{width:100％；height:60px；background:#000；position:fixed；bottom:0；/**距离底部为0*/left:0；z-index:1；}</style><divclass＝"foot-menu"><！---导航具体内容--></div>；

通过自定义完成页面导航键的参数信息，即可将其自动转化为json格式配置信息发送至hybridapp中本地应用端(即nativeapp)。

配置信息解析单元120，用于解析所述json格式配置信息中所包括的页面导航键的设置信息。

在本实施例中，是hybridapp中本地应用端(即nativeapp)获取h5页面端所上传的json格式配置信息，解析所述json格式配置信息中所包括的页面导航键的设置信息，本质上页面导航键的设置信息与页面导航键的参数信息是相同的，不同点在于页面导航键的参数信息是用户在h5页面端原始设置的参数，而页面导航键的设置信息则是由所述json格式配置信息解析得到的。

集合数据获取单元130，用于将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据。

在本实施例中，为了生成h5页面，需获取h5页面对应的网页文件集合数据，即包括描述了网页中的基本构成元素以及这些元素的结构的网页文件、描述了网页的外观的css文件和描述了网页的功能或行为的js文件。由于css文件和js文件是已预先设置好的，故只需将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件中，即可得到完整的自定义h5页面网页文件集合数据，实现了以json格式配置信息为载体来快速修改网页文件集合数据。

在一实施例中，如图7所示，集合数据获取单元130包括：

填充区域定位单元131，用于将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数分别定位在网页文件集合数据中的填充区域；

集合数据生成单元132，用于根据导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数根据对应的填充区域，分别填充至网页文件集合数据，得到自定义h5页面网页文件集合数据。

在本实施例中，为了精准的将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至网页文件集合数据中，需根据网页文件集合数据中的各组成文件的分区来定位上述参数的填充位置。例如网页文件集合数据中的第一大分区为网页文件区，第二大分区为css文件区，第三大分区为js文件区。第一大分区对应的网页文件区又分为至少4个小分区，分别对应导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数的录入区。通过上述精准定位和填充，即可得到自定义h5页面网页文件集合数据。

h5页面生成单元140，用于根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

在一实施例中，h5页面生成单元140中根据所述自定义h5页面网页文件集合数据中包括的网页文件、css文件和js文件文件，对应生成当前h5页面。

在本实施例中，当获取了描述了网页中的基本构成元素以及这些元素的结构的网页文件、描述了网页的外观的css文件和描述了网页的功能或行为的js文件，即可以h5页面端作为容器，将网页文件、css文件和js文件文件作为容器内所装载的具体内容，由h5页面端的页面生成功能自动生成当前h5页面，以实现通过json格式配置信息来控制h5页面的页面导航键的自定义生成。

该装置采用json格式配置信息来控制导航栏按钮以及整个h5页面的自定义需求,实现了在推出新页面时，h5下发整个页面的json格式配置信息以及待推出的h5页面，无需客户端再发版本。

上述h5导航栏按钮配置装置可以实现为计算机程序的形式，该计算机程序可以在如图9所示的计算机设备上运行。

请参阅图9，图9是本发明实施例提供的计算机设备的示意性框图。

参阅图9，该计算机设备500包括通过系统总线501连接的处理器502、存储器和网络接口505，其中，存储器可以包括非易失性存储介质503和内存储器504。

该非易失性存储介质503可存储操作系统5031和计算机程序5032。该计算机程序5032被执行时，可使得处理器502执行h5导航栏按钮配置方法。

该处理器502用于提供计算和控制能力，支撑整个计算机设备500的运行。

该内存储器504为非易失性存储介质503中的计算机程序5032的运行提供环境，该计算机程序5032被处理器502执行时，可使得处理器502执行h5导航栏按钮配置方法。

该网络接口505用于进行网络通信，如提供数据信息的传输等。本领域技术人员可以理解，图9中示出的结构，仅仅是与本发明方案相关的部分结构的框图，并不构成对本发明方案所应用于其上的计算机设备500的限定，具体的计算机设备500可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。

其中，所述处理器502用于运行存储在存储器中的计算机程序5032，以实现如下功能：获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息；解析所述json格式配置信息中所包括的页面导航键的设置信息；将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据；根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

在一实施例中，处理器502在执行所述根据所述参数信息对应生成json格式配置信息的步骤时，执行如下操作：获取所设置的导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；将导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至预先配置的json格式模板，得到json格式配置信息；其中，所述页面导航键的参数信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数。

在一实施例中，处理器502在执行所述将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据的步骤时，执行如下操作：将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数分别定位在网页文件集合数据中的填充区域；根据导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数根据对应的填充区域，分别填充至网页文件集合数据，得到自定义h5页面网页文件集合数据；其中，所述页面导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数。

在一实施例中，处理器502在执行所述根据所述自定义h5页面网页文件集合数据对应生成当前h5页面的步骤时，执行如下操作：根据所述自定义h5页面网页文件集合数据中包括的网页文件、css文件和js文件文件，对应生成当前h5页面。

在一实施例中，处理器502在执行所述获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息的步骤之前，还执行如下操作：若检测到h5页面自定义配置指令，获取所录入的页面导航键的参数信息，或者获取所设置的h5导航栏按钮及对所述h5导航栏按钮设置的页面导航键的参数信息。

本领域技术人员可以理解，图9中示出的计算机设备的实施例并不构成对计算机设备具体构成的限定，在其他实施例中，计算机设备可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。例如，在一些实施例中，计算机设备可以仅包括存储器及处理器，在这样的实施例中，存储器及处理器的结构及功能与图9所示实施例一致，在此不再赘述。

应当理解，在本发明实施例中，处理器502可以是中央处理单元(centralprocessingunit，cpu)，该处理器502还可以是其他通用处理器、数字信号处理器(digitalsignalprocessor，dsp)、专用集成电路(applicationspecificintegratedcircuit，asic)、现成可编程门阵列(field-programmablegatearray，fpga)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。其中，通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

在本发明的另一实施例中提供计算机可读存储介质。该计算机可读存储介质可以为非易失性的计算机可读存储介质。该计算机可读存储介质存储有计算机程序，其中计算机程序被处理器执行时实现以下步骤：获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息；解析所述json格式配置信息中所包括的页面导航键的设置信息；将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据；根据所述自定义h5页面网页文件集合数据对应生成当前h5页面。

在一实施例中，所述页面导航键的参数信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；所述根据所述参数信息对应生成json格式配置信息，包括：获取所设置的导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；将导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数填充至预先配置的json格式模板，得到json格式配置信息。

在一实施例中，所述页面导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数；所述将所述页面导航键的设置信息填充至与所述json格式配置信息对应的网页文件集合数据中，得到自定义h5页面网页文件集合数据，包括：将导航键的设置信息包括导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数分别定位在网页文件集合数据中的填充区域；根据导航键在h5页面中所处位置的页面坐标信息、导航键在h5页面中尺寸参数、导航键所链接的目标地址、导航键的显示颜色参数根据对应的填充区域，分别填充至网页文件集合数据，得到自定义h5页面网页文件集合数据。

在一实施例中，所述根据所述自定义h5页面网页文件集合数据对应生成当前h5页面，包括：根据所述自定义h5页面网页文件集合数据中包括的网页文件、css文件和js文件文件，对应生成当前h5页面。

在一实施例中，所述获取在h5页面中所配置的页面导航键的参数信息，根据所述参数信息对应生成json格式配置信息之前，还包括：若检测到h5页面自定义配置指令，获取所录入的页面导航键的参数信息，或者获取所设置的h5导航栏按钮及对所述h5导航栏按钮设置的页面导航键的参数信息。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，上述描述的设备、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

在本发明所提供的几个实施例中，应该理解到，所揭露的设备、装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为逻辑功能划分，实际实现时可以有另外的划分方式，也可以将具有相同功能的单元集合成一个单元，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另外，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口、装置或单元的间接耦合或通信连接，也可以是电的，机械的或其它的形式连接。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本发明实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以是两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分，或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：u盘、移动硬盘、只读存储器(rom，read-onlymemory)、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。