数据输入框的生成方法和装置
阅读说明：本技术 数据输入框的生成方法和装置 (Method and device for generating data input box ) 是由 张发星 于 2020-12-23 设计创作，主要内容包括：本公开涉及一种数据输入框的生成方法和装置,涉及计算机技术领域。该方法包括：根据Web页面上拟生成数据输入框的位置,在Web页面上填充占位控件；响应于Web页面加载,获取占位控件的相关属性；根据相关属性,将Native安全输入控件渲染到Web页面的相应位置,以生成数据输入框。(The disclosure relates to a method and a device for generating a data input box, and relates to the technical field of computers. The method comprises the following steps: filling an occupancy control on a Web page according to the position of a data input box to be generated on the Web page; responding to Web page loading, and acquiring relevant attributes of the position occupying control; and rendering the Native security input control to the corresponding position of the Web page according to the related attributes to generate a data input box.)
技术领域
本公开涉及计算机技术领域，特别涉及一种数据输入框的生成方法、数据输入框的生成装置非易失性计算机可读存储介质。
背景技术
为了降低开发成本，越来越多的移动App(Application，应用)中采用了Web(网络)技术进行功能模块的开发。但是，Web技术在安全防护上是存在不足，对于登录、交易、个人信息输入等高敏感信息输入的场景，可能出现泄露风险。因此，对于App中利用Web技术实现的功能页面中需要引入安全输入机制。
在相关技术中，在Web中或者在Native(本地)层对输入数据加密后上传服务端，从而实现安全输入机制。
发明内容
本公开的发明人发现上述相关技术中存在如下问题：在数据的输入过程中加密算法和密钥可能被泄露，或者明文可能在客户端被截取，从而导致数据输入的安全性低。
鉴于此，本公开提出了一种数据输入框的生成技术方案，能够提高数据输入的安全性。
根据本公开的一些实施例，提供了一种数据输入框的生成方法，包括：根据Web页面上拟生成数据输入框的位置，在所述Web页面上填充占位控件；响应于所述Web页面加载，获取所述占位控件的相关属性；根据所述相关属性，将Native安全输入控件渲染到所述Web页面的相应位置，以生成所述数据输入框。
在一些实施例中，所述响应于所述Web页面加载，获取所述占位控件的相关属性包括：响应于所述Web页面加载，获取所述占位控件的ID(Identification，标识)；根据所述占位控件的ID，获取所述占位控件的相关属性。
在一些实施例中，所述根据所述占位控件的ID，获取所述占位控件的相关属性包括：利用回调方法加载所述Web页面；利用JS(Java Script，Java脚本)获取所述占位控件的ID对应的所述相关属性。
在一些实施例中，所述根据所述相关属性，将Native安全输入控件渲染到所述Web页面的相应位置包括：利用WebView(网络视图)控件的addView(增加视图)方法，将所述Native安全输入控件渲染到所述Web页面的相应位置。
在一些实施例中，所述根据所述相关属性，将Native安全输入控件渲染到所述Web页面的相应位置包括：响应于所述占位控件移动，获取所述占位控件的相关属性的变化情况；根据所述变化情况，将所述Native安全输入控件渲染到所述Web页面的相应位置。
在一些实施例中，所述占位控件为div(DIVision，分隔)控件或者input(输入)控件，所述相关属性包括大小属性、位置属性。
在一些实施例中，所述的生成方法还包括：利用所述数据输入框获取数据；将所述数据的密文上传服务端。
根据本公开的另一些实施例，提供一种数据输入框的生成装置，包括：填充单元，用于根据Web页面上拟生成数据输入框的位置，在所述Web页面上填充占位控件；获取单元，用于响应于所述Web页面加载，获取所述占位控件的相关属性；渲染单元，用于根据所述相关属性，将Native安全输入控件渲染到所述Web页面的相应位置，以生成所述数据输入框。
在一些实施例中，所述获取单元响应于所述Web页面加载，获取所述占位控件的ID，根据所述占位控件的ID，获取所述占位控件的相关属性。
在一些实施例中，所述获取单元利用回调方法加载所述Web页面，利用JS获取所述占位控件的ID对应的所述相关属性。
在一些实施例中，所述渲染单元利用WebView控件的addView方法，将所述Native安全输入控件渲染到所述Web页面的相应位置。
在一些实施例中，所述获取单元响应于所述占位控件移动，获取所述占位控件的相关属性的变化情况；所述渲染单元根据所述变化情况，将所述Native安全输入控件渲染到所述Web页面的相应位置。
在一些实施例中，所述占位控件为div控件或者input控件，所述相关属性包括大小属性、位置属性。
在一些实施例中，所述的生成装置还包括：上传单元，用于将所述获取单元利用所述数据输入框获取的所述数据的密文上传服务端。
根据本公开的又一些实施例，提供一种数据输入框的生成装置，包括：存储器；和耦接至所述存储器的处理器，所述处理器被配置为基于存储在所述存储器装置中的指令，执行上述任一个实施例中的数据输入框的生成方法。
根据本公开的再一些实施例，提供一种非易失性计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现上述任一个实施例中的数据输入框的生成方法。
在上述实施例中，利用占位控件，实现Native安全输入控件在Web页面的直接加载和渲染。这样，可以解决数据的输入过程中加密算法和密钥被泄露，以及明文在客户端被截取的技术问题，从而提高数据输入的安全性。
附图说明
构成说明书的一部分的附图描述了本公开的实施例，并且连同说明书一起用于解释本公开的原理。
参照附图，根据下面的详细描述，可以更加清楚地理解本公开，其中：
图1示出本公开的数据输入框的生成方法的一些实施例的流程图；
图2示出图1中步骤120的一些实施例的流程图；
图3示出图1中步骤130的一些实施例的流程图；
图4示出本公开的数据输入框的生成装置的一些实施例的框图；
图5示出本公开的数据输入框的生成装置的另一些实施例的框图；
图6示出本公开的数据输入框的生成装置的又一些实施例的框图。
具体实施方式
现在将参照附图来详细描述本公开的各种示例性实施例。应注意到：除非另外具体说明，否则在这些实施例中阐述的部件和步骤的相对布置、数字表达式和数值不限制本公开的范围。
同时，应当明白，为了便于描述，附图中所示出的各个部分的尺寸并不是按照实际的比例关系绘制的。
以下对至少一个示例性实施例的描述实际上仅仅是说明性的，决不作为对本公开及其应用或使用的任何限制。
对于相关领域普通技术人员已知的技术、方法和设备可能不作详细讨论，但在适当情况下，所述技术、方法和设备应当被视为授权说明书的一部分。
在这里示出和讨论的所有示例中，任何具体值应被解释为仅仅是示例性的，而不是作为限制。因此，示例性实施例的其它示例可以具有不同的值。
应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步讨论。
如前所述，在Web中对数据进行加密上传无法解决加密算法及密钥泄漏的问题，更无法避免输入过程中通过hook、dump等手段获取明文的问题；在Native层对数据进行加密无法解决输入过程中明文在客户端被劫取的技术问题。
针对上述技术问题，本公开在Web页面直接渲染Native控件，即在Web页面上拟设置敏感数据输入框的位置，都采用Native安全输入控件(如输入框+安全键盘)来生成数据输入框。例如，可以采用如下实施例实现本公开的技术方案。
图1示出本公开的数据输入框的生成方法的一些实施例的流程图。
如图1所示，该方法包括：步骤110，填充占位控件；步骤120，获取相关属性；和步骤130，渲染Native安全输入控件。
在步骤110中，根据Web页面上拟生成数据输入框的位置，在Web页面上填充占位控件。例如，占位控件为div控件或者input控件。
在一些实施例中，对于Web页面中要输入敏感字段的输入框，可以利用div控件在需要的位置实现填充，并为div控件设置ID。例如，ID可以为safeinputid。
在步骤120中，响应于Web页面加载，获取占位控件的相关属性。例如，相关属性包括大小属性、位置属性。
在一些实施例中，可以通过图2中的实施例实现步骤120。
图2示出图1中步骤120的一些实施例的流程图。
如图2所示，步骤120包括：步骤1210，获取占位控件ID；和步骤1220，获取相关属性。
在步骤1210中，响应于Web页面加载，获取占位控件的标识ID。
在步骤1220中，根据占位控件的ID，获取占位控件的相关属性。
在一些实施例中，利用回调方法加载Web页面，然后利用JS获取占位控件的ID对应的相关属性。
在一些实施例中，在移动App的Webview控件加载该Web页面时，在执行页面加载完成的回调方法中可以通过执行JS获取safeinputid对应的div的大小、位置等属性。例如，回调方法可以为onPageFinished(WebView view，String url)。
在获取了相关属性后，可以利用图1中的其余步骤生成数据输入框。
在步骤130中，根据相关属性，将Native安全输入控件渲染到Web页面的相应位置，以生成数据输入框。例如，Native安全输入控件根据div的大小属性进行初始化，WebView根据div的位置属性加载Native安全输入控件。
在一些实施例中，利用WebView控件的addView方法，将Native安全输入控件渲染到Web页面的相应位置。例如，根据获取的相关属性，设置Native安全输入控件的位置、大小等；利用WebView控件的addView方法将Native安全输入控件渲染到Web页面包含的safeinputid对应的div的位置。
在一些实施例中，可以利用数据输入框获取数据，然后将数据的密文上传服务端。
这样，可以实现在Web页面中直接加载Native安全输入控件的功能，从而通过Native安全输入控件保护输入信息的安全。
在一些实施例中，可以利用图3中的实施例实现步骤130。
图3示出图1中步骤130的一些实施例的流程图。
如图3所示，步骤130包括：步骤1310，获取相关属性的变化情况；和步骤1320，渲染Native安全输入控件。
在步骤1310中，响应于占位控件移动，获取占位控件的相关属性的变化情况。
在步骤1320中，根据变化情况，将Native安全输入控件渲染到Web页面的相应位置。
在一些实施例中，可以在Web页面中通过填充ID为safeinputid的div控件，为输入框占位；利用WebView加载Web页面，并获取ID为safeinputid的div控件的位置和大小等属性；Native安全输入控件根据div的大小进行初始化后，监控div的位置移动；WebView根据监控结果，加载Native安全输入控件；Web页面渲染、显示Native安全输入控件。
图4示出本公开的数据输入框的生成装置的一些实施例的框图。
如图4所示，数据输入框的生成装置4包括填充单元41、获取单元42和渲染单元43。
填充单元41根据Web页面上拟生成数据输入框的位置，在Web页面上填充占位控件。
获取单元42响应于Web页面加载，获取占位控件的相关属性。
渲染单元43根据相关属性，将Native安全输入控件渲染到Web页面的相应位置，以生成数据输入框。
在一些实施例中，获取单元42响应于Web页面加载，获取占位控件的ID；根据占位控件的ID，获取占位控件的相关属性。
在一些实施例中，获取单元42利用回调方法加载Web页面，利用JS获取占位控件的ID对应的相关属性。
在一些实施例中，渲染单元43利用WebView控件的addView方法，将Native安全输入控件渲染到Web页面的相应位置。
在一些实施例中，获取单元42响应于占位控件移动，获取占位控件的相关属性的变化情况；渲染单元43根据变化情况，将Native安全输入控件渲染到Web页面的相应位置。
在一些实施例中，占位控件为div控件或者input控件。相关属性包括大小属性、位置属性。
在一些实施例中，生成装置4还包括：上传单元44，用于将获取单元42利用数据输入框获取的数据的密文上传服务端。
图5示出本公开的数据输入框的生成装置的另一些实施例的框图。
如图5所示，该实施例的数据输入框的生成装置5包括：存储器51以及耦接至该存储器51的处理器52，处理器52被配置为基于存储在存储器51中的指令，执行本公开中任意一个实施例中的数据输入框的生成方法。
其中，存储器51例如可以包括系统存储器、固定非易失性存储介质等。系统存储器例如存储有操作系统、应用程序、引导装载程序(Boot Loader)、数据库以及其他程序等。
图6示出本公开的数据输入框的生成装置的又一些实施例的框图。
如图6所示，该实施例的数据输入框的生成装置6包括：存储器610以及耦接至该存储器610的处理器620，处理器620被配置为基于存储在存储器610中的指令，执行前述任意一个实施例中的数据输入框的生成方法。
存储器610例如可以包括系统存储器、固定非易失性存储介质等。系统存储器例如存储有操作系统、应用程序、引导装载程序(Boot Loader)以及其他程序等。
数据输入框的生成装置6还可以包括输入输出接口630、网络接口640、存储接口650等。这些接口630、640、650以及存储器610和处理器620之间例如可以通过总线660连接。其中，输入输出接口630为显示器、鼠标、键盘、触摸屏、麦克、音箱等输入输出设备提供连接接口。网络接口640为各种联网设备提供连接接口。存储接口650为SD卡、U盘等外置存储设备提供连接接口。
本领域内的技术人员应当明白，本公开的实施例可提供为方法、系统、或计算机程序产品。因此，本公开可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本公开可采用在一个或多个其中包含有计算机可用程序代码的计算机可用非瞬时性存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
至此，已经详细描述了根据本公开的数据输入框的生成方法、数据输入框的生成装置非易失性计算机可读存储介质。为了避免遮蔽本公开的构思，没有描述本领域所公知的一些细节。本领域技术人员根据上面的描述，完全可以明白如何实施这里公开的技术方案。
可能以许多方式来实现本公开的方法和系统。例如，可通过软件、硬件、固件或者软件、硬件、固件的任何组合来实现本公开的方法和系统。用于所述方法的步骤的上述顺序仅是为了进行说明，本公开的方法的步骤不限于以上具体描述的顺序，除非以其它方式特别说明。此外，在一些实施例中，还可将本公开实施为记录在记录介质中的程序，这些程序包括用于实现根据本公开的方法的机器可读指令。因而，本公开还覆盖存储用于执行根据本公开的方法的程序的记录介质。
虽然已经通过示例对本公开的一些特定实施例进行了详细说明，但是本领域的技术人员应该理解，以上示例仅是为了进行说明，而不是为了限制本公开的范围。本领域的技术人员应该理解，可在不脱离本公开的范围和精神的情况下，对以上实施例进行修改。本公开的范围由所附权利要求来限定。