CN110286943B - H5页面的多平台运行方法及装置 - Google Patents

H5页面的多平台运行方法及装置 Download PDF

Info

Publication number
CN110286943B
CN110286943B CN201910468793.2A CN201910468793A CN110286943B CN 110286943 B CN110286943 B CN 110286943B CN 201910468793 A CN201910468793 A CN 201910468793A CN 110286943 B CN110286943 B CN 110286943B
Authority
CN
China
Prior art keywords
middleware
platform
api
page
issued
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.)
Active
Application number
CN201910468793.2A
Other languages
English (en)
Other versions
CN110286943A (zh
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.)
Fujia Newland Software Engineering Co ltd
Original Assignee
Fujia Newland Software Engineering Co 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 Fujia Newland Software Engineering Co ltd filed Critical Fujia Newland Software Engineering Co ltd
Priority to CN201910468793.2A priority Critical patent/CN110286943B/zh
Publication of CN110286943A publication Critical patent/CN110286943A/zh
Application granted granted Critical
Publication of CN110286943B publication Critical patent/CN110286943B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/70—Software maintenance or management
    • G06F8/76—Adapting program code to run in a different environment; Porting
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00—Network arrangements or protocols for supporting network services or applications
    • H04L67/01—Protocols
    • H04L67/02—Protocols based on web technology, e.g. hypertext transfer protocol [HTTP]
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00—Network arrangements or protocols for supporting network services or applications
    • H04L67/50—Network services
    • H04L67/56—Provisioning of proxy services
    • H04L67/562—Brokering proxy services

Abstract

本发明公开了一种H5页面的多平台运行方法，将至少两个平台发布的JS‑SDK进行重新封装，形成一中间件，并输出中间件的API；将中间件引入页面中；使用时，传入待发布平台的初始化参数，通过中间件对传入的初始化参数进行校验识别；当校验识别通过时，调用中间件的API，由中间件的API关联到待发布平台JS‑SDK的API；添加对应代码以实现对应功能。本发明的技术方案先将至少两个平台JS‑SDK重新封装入一个中间件中，在页面中引入中间件，传入初始化参数，调用该中间件API，即可实现调用欲调用的平台JS‑SDK API的功能，无需大量修改开发代码。实现一套H5代码运行多平台，真正实现了“一次开发，多处运行”，同时还提高了Web前端开发者的开发效率。

Description

H5页面的多平台运行方法及装置
技术领域
本发明涉及计算机互联网技术领域，特别涉及一种H5页面的多平台运行方法及装置。
背景技术
随着移动应用技术的快速发展，Hybird App(混合开发)从开发层面呈现“一次开发，多处运行”的机制，跨平台的开发是目前乃至未来发展的趋势。同时，越来越多的优秀APP为Web前端开发者开放出JS-SDK，以方便开发者使用。例如：微信JSSDK、支付宝AlipayJSSDK及JS API等。
但是，现有的技术中，大多数平台开放的JS-SDK由于开发风格迥异，导致调用的API也不同。开发者想要将H5页面运行在该应用中，必须调用相对应平台的JS-SDK API，否则无法实现预想的功能。例如：在微信中完美运行的H5页面在支付宝中不经过大量修改，就无法实现预想功能。这种情形违背了“一次开发，多处运行”的本意，给Web前端开发者带来学习成本的同时，也增加了开发成本。面对众多平台风格迥异的JS-SDK带来的不同开发方式，如何以尽可能少的改动实现一套H5页面能够在多平台运行，对于Web前端开发者来说是一件迫在眉睫的事。
发明内容
本发明要解决的技术问题是在改动较少的情况下，如何实现一套H5页面能够在多平台运行。
为了解决上述技术问题，本发明的技术方案为：
一种H5页面的多平台运行方法，包括步骤：
将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出所述中间件的API；
将所述中间件引入页面中；
接收待发布平台的初始化参数，通过所述中间件对传入的初始化参数进行校验识别；
当校验识别通过时，调用所述中间件的API，由所述中间件的API关联到待发布平台JS-SDK的API；
添加对应代码以实现对应功能。
优选地：从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能，形成中间件，并输出API。
优选地：从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
优选地：通过所述中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务。
优选地：中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
本发明还提出了一种H5页面的多平台运行装置，包括：
中间件模块：将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出所述中间件的API；
页面引入模块：将所述中间件引入页面中；
校验模块：接收待发布平台的初始化参数，通过所述中间件对传入的初始化参数进行校验识别；
API关联模块：当校验识别通过时，调用所述中间件的API，由所述中间件的API关联到待发布平台JS-SDK的API；
添加模块：添加对应代码以实现对应功能。
优选地：所述中间件模块中，从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能，形成中间件，并输出API。
优选地：所述中间件模块中，从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
优选地：通过所述中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务。
优选地：所述API校验模块中，中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
采用上述技术方案，将至少两个平台发布的JS-SDK进行重新封装，进而形成一个中间件。在使用时，将中间件传入要发布的平台的初始参数进行校验，通过中间件的API关联对应的平台API，实现添加对应代码以实现对应功能。在H5页面尽可能少改动代码的情况下，本发明技术方案实现了H5页面完美运行在多平台上的一种方法。整个集成过程中仅仅多引入一个中间件，不增加额外的开发难度，不仅减少Web前端开发者的学习成本，还提高了Web前端开发者的开发效率，同时也变相提高了H5页面的利用率。
附图说明
图1为本发明多平台运行方法一实施例的流程图；
图2为本发明多平台运行装置一实施例的模块示意图。
图中，10-中间件模块，20-页面引入模块，30-校验模块，40-API关联模块，50-添加模块。
具体实施方式
下面结合附图对本发明的具体实施方式作进一步说明。在此需要说明的是，对于这些实施方式的说明用于帮助理解本发明，但并不构成对本发明的限定。此外，下面所描述的本发明各个实施方式中所涉及的技术特征只要彼此之间未构成冲突就可以相互组合。
本发明主要目的是解决如何高效便捷将一套H5页面运行在不同平台，运用场景可以包括H5页面、微信公众号开发、支付宝生活号、HybirdApp等，此处不一一列举。
在本发明的一实施例中，在开发H5页面时，通过使用本发明实现的中间件进行页面的代码编写，从而运行在不同平台。其具体的集成步骤如下：
本发明基于不同平台开放的JS-SDK选出具有相同功能的方法，在中间件中以代理的形式定义一方法。该方法首先根据xx.navigator.userAgent的值判断当前页面所处客户端环境，然后根据客户端环境调用对应平台JS-SDK，以此形式封装各个功能，形成中间件，输出API。Web前端开发者只需预先了解该中间件的API使用方式即可。开发人员将本发明实现的中间件引入页面，传入欲发布平台的初始化参数(初始化参数需要根据欲发布平台的要求传递)，中间件根据初始化参数去欲发布平台校验权限，从而实现调用对应平台的JS-SDK。本实施例实现的中间件对传入的初始化参数进行校验，如果错误，则将错误抛出，将错误信息推送、显示，并结束任务；如果初始化参数校验正确，则识别欲调用的平台JS-SDK；通过调用中间件API，中间件API关联到欲调用平台JS-SDK中相对应的API，根据调用API后的返回结果，添加相对应的业务代码，即可实现调用欲调用平台JS-SDKAPI的功能。本技术方案无需大量修改开发代码，即可实现一套H5代码，运行多平台，达到真正实现“一次开发，多处运行”的目的。
参照图1，本发明的另一实施例中，该多平台运行方法包括步骤：
S10：将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出中间件的API；需要说明的是，平台发布的JS-SDK可以包括微信JSSDK、支付宝Alipay JSSDK及JSAPI等，此处不一一列举。
S20：将中间件引入页面中；
S30：接收传入的待发布平台的初始化参数，通过中间件对传入的初始化参数进行校验识别；
S40：当校验识别通过时，则识别欲调用的平台JS-SDK，调用中间件的API，由中间件的API关联到待发布平台JS-SDK的API；
S50：添加对应代码以实现对应功能，该代码为实现对应功能的代码。
具体地，从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能，形成中间件，并输出API。
进一步地，从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
具体地，通过中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务。
具体地，中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
采用上述技术方案，将至少两个平台发布的JS-SDK进行重新封装，进而形成一个中间件。在使用时，将中间件传入要发布的平台的初始参数进行校验，通过中间件的API关联对应的平台API，进而添加对应代码以实现对应功能。在H5页面尽可能少改动代码的情况下，本发明技术方案实现了H5页面完美运行在多平台上的一种方法。整个集成过程中仅仅多引入一个中间件，不增加额外的开发难度，所需工作量较少，不仅减少Web前端开发者的学习成本，还提高了Web前端开发者的开发效率，同时也变相提高了H5页面的利用率。
参照图2，本发明还提出了一种H5页面的多平台运行装置，包括：
中间件模块10：将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出中间件的API；封装时，从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能。页面引入模块20：将中间件引入页面中；校验模块30：接收待发布平台的初始化参数，通过中间件对传入的初始化参数进行校验识别；API关联模块40：当校验识别通过时，调用中间件的API，由中间件的API关联到待发布平台JS-SDK的API；添加模块50：添加对应代码以实现对应功能。
进一步地，中间件模块10中，从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
进一步地，通过中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务。
进一步地，API校验模块30中，中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
以上的H5页面的多平台运行装置，通过将至少两个平台JS-SDK重新封装入一个中间件中，形成一个至少包括两个平台JS-SDK的中间件。在页面中引入中间件，传入初始化参数，调用该中间件API，通过初始化参数识别出欲调用的平台JS-SDK，即可实现调用欲调用平台JS-SDKAPI的功能，最后通过添加对应的代码来实现相应的功能。本技术方案实现了一套H5代码运行多平台，无需大量修改开发代码，真正实现了“一次开发，多处运行”的目的，同时还提高了Web前端开发者的开发效率。
以上结合附图对本发明的实施方式作了详细说明，但本发明不限于所描述的实施方式。对于本领域的技术人员而言，在不脱离本发明原理和精神的情况下，对这些实施方式进行多种变化、修改、替换和变型，仍落入本发明的保护范围内。

Claims (6)

1.一种H5页面的多平台运行方法，其特征在于，包括步骤：
将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出所述中间件的API；即从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能，形成中间件，并输出API；
将所述中间件引入页面中；
接收待发布平台的初始化参数，通过所述中间件对传入的初始化参数进行校验识别；
通过所述中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务；
当校验识别通过时，调用所述中间件的API，由所述中间件的API关联到待发布平台JS-SDK的API；
添加对应代码以实现对应功能。
2.根据权利要求1所述的H5页面的多平台运行方法，其特征在于：从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
3.根据权利要求1所述的H5页面的多平台运行方法，其特征在于：中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
4.一种H5页面的多平台运行装置，其特征在于，包括：
中间件模块：将至少两个平台发布的JS-SDK进行重新封装，形成一中间件，并输出所述中间件的API；即从不同平台开放的JS-SDK中选出相同功能，在中间件中以代理的形式定义一方法，以封装各功能，形成中间件，并输出API；
页面引入模块：将所述中间件引入页面中；
校验模块：接收待发布平台的初始化参数，通过所述中间件对传入的初始化参数进行校验识别；
通过所述中间件对传入的初始化参数进行校验识别后，当初始化参数的校验识别未通过时，则显示初始化参数错误，并结束任务；
API关联模块：当校验识别通过时，调用所述中间件的API，由所述中间件的API关联到待发布平台JS-SDK的API；
添加模块：添加对应代码以实现对应功能。
5.根据权利要求4所述的H5页面的多平台运行装置，其特征在于：所述中间件模块中，从不同平台开放的JS-SDK中选出相同功能，根据xx.navigator.userAgent的值判断当前页面所处客户端环境，根据客户端环境调用对应的平台JS-SDK，以封装各功能，形成中间件，并输出API。
6.根据权利要求4所述的H5页面的多平台运行装置，其特征在于：所述API校验模块中，中间件根据初始化参数至欲发布的平台进行权限校验，以实现调用对应平台的JS-SDK。
CN201910468793.2A 2019-05-31 2019-05-31 H5页面的多平台运行方法及装置 Active CN110286943B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910468793.2A CN110286943B (zh) 2019-05-31 2019-05-31 H5页面的多平台运行方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910468793.2A CN110286943B (zh) 2019-05-31 2019-05-31 H5页面的多平台运行方法及装置

Publications (2)

Publication Number Publication Date
CN110286943A CN110286943A (zh) 2019-09-27
CN110286943B true CN110286943B (zh) 2022-05-31

Family

ID=68003236

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910468793.2A Active CN110286943B (zh) 2019-05-31 2019-05-31 H5页面的多平台运行方法及装置

Country Status (1)

Country Link
CN (1) CN110286943B (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111414154A (zh) * 2020-03-31 2020-07-14 中国建设银行股份有限公司 前端开发的方法、装置、电子设备和存储介质
CN111708573B (zh) * 2020-06-05 2023-09-08 苏州瑞泰信息技术有限公司 一种h5适配自有app、微信、钉钉的系统

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101841569A (zh) * 2010-05-17 2010-09-22 成都中联信通科技有限公司 一种基于web技术实现跨平台的手机支付方法
CN103974248A (zh) * 2013-01-24 2014-08-06 中国移动通信集团公司 在能力开放系统中的终端安全性保护方法、装置及系统
CN104932895A (zh) * 2015-06-26 2015-09-23 南京邮电大学 一种基于soa的中间件及其信息发布方法
CN109408250A (zh) * 2018-09-27 2019-03-01 天津字节跳动科技有限公司 调用应用程序编程接口api方法、装置、电子设备

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US10331425B2 (en) * 2017-06-28 2019-06-25 Google Llc Automated source code adaption to inject features between platform versions

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101841569A (zh) * 2010-05-17 2010-09-22 成都中联信通科技有限公司 一种基于web技术实现跨平台的手机支付方法
CN103974248A (zh) * 2013-01-24 2014-08-06 中国移动通信集团公司 在能力开放系统中的终端安全性保护方法、装置及系统
CN104932895A (zh) * 2015-06-26 2015-09-23 南京邮电大学 一种基于soa的中间件及其信息发布方法
CN109408250A (zh) * 2018-09-27 2019-03-01 天津字节跳动科技有限公司 调用应用程序编程接口api方法、装置、电子设备

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
"navigator.userAgent浏览器检测（前端基础系列）";尤客希;《https://www.cnblogs.com/ukerxi/p/8038171.html》;20171214;第2-3页 *

Also Published As

Publication number Publication date
CN110286943A (zh) 2019-09-27

Similar Documents

Publication Publication Date Title
US8612947B2 (en) System and method for remotely compiling multi-platform native applications for mobile devices
CN102053836B (zh) 一种Android应用开发的版本管理工具的实现方法
CN103744686B (zh) 智能终端中应用安装的控制方法和系统
CN105760162A (zh) 混合型app软件的开发方法
CN111176626B (zh) 跨编程语言的代码调用方法及装置、介质、设备
US8843945B2 (en) Automated application programming interface (API) generation
JP2008176793A (ja) ソフトウェアテストシステム、ソフトウェアのテスト方法、および、そのテスト方法を実行するためのプログラムを記録したコンピュータ読取り可能な記録媒体
US20150195346A1 (en) Open platform, open platform access system, storage medium, and method for allowing third party application to access open platform
CN111831538B (zh) 调试方法、装置以及存储介质
CN104821954A (zh) 一种跨平台远程过程调用方法
CN110286943B (zh) H5页面的多平台运行方法及装置
CN110580154A (zh) 基于h5接入方式的接入方法及其接入组件和移动终端
CN113407362A (zh) 基于车载Android系统SOA架构SOMEIP通信中间层实现方法及系统
CN109240908A (zh) 异常测试用例模板创建方法及装置
CN110737631A (zh) 一种基于Flink引擎的数据解析方法及装置
CN107704499A (zh) 一种应用程序的页面跳转控制方法及装置
US20230297348A1 (en) Method for operating second system application on first system, terminal device and storage medium
CN116681013B (zh) 网络芯片的仿真验证方法、平台、装置、设备及介质
CN102779059B (zh) 塞班客户端上启动应用的方法和装置
CN111459810A (zh) 构建应用程序的方法、编程设备和计算机可读存储介质
CN114579334A (zh) 一种通信方法、装置、电子设备及存储介质
CN108563475A (zh) 应用程序的运行方法、装置及存储介质
CN114064505A (zh) 用于译码单元的测试方法、系统、设备以及存储介质
CN101251824B (zh) 测试公共对象请求代理结构的方法和测试工具
CN113467860B (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
GR01 Patent grant
GR01 Patent grant