全部产品
云市场

H5 JS 编程

更新时间:2019-09-09 15:14:14

概要

目前很多移动端的前端都是用 JS 进行编码。mPaaS 也提供了移动端 web 解决方案:H5容器。H5是承载于 Android 和 iOS 之上,客户端接入详见 mPaaS 概述

在客户端接入H5后,前端可以很方便地使用网关:

  • 通过动态代理的方式,封装客户端和服务端之间的通讯。
  • 如果服务端和客户端定义了一致的接口,可由服务端自动生成代码并导出给客户端使用。
  • RpcException 进行统一的异常处理,弹对话框、toast 消息框等。

前置条件

Android/iOS 客户端已经接入 H5 容器。

生成 JS 代码

当 App 在移动网关控制台接入后台服务后,即可在控制台自动生成 RPC 的 JS 调用代码,详细说明参见 代码生成

generate code

目前针对每个 API,根据约定的接口参数,都会生成如下模版代码:

  1. var params = [{
  2. "_requestBody":{"userName":"", "userId":0}
  3. }]
  4. var operationType = 'alipay.mobile.ic.dispatch'
  5. AlipayJSBridge.call('rpc', {
  6. operationType: operationType,
  7. requestData: params,
  8. headers:{}
  9. }, function (result) {
  10. console.log(result);
  11. });

前端需要使用到 RPC 时,直接使用上面的模版,填入调用的请求参数。

使用说明

JS 调用 RPC 如下:

  1. AlipayJSBridge.call('rpc', {
  2. operationType: 'alipay.client.xxxx',
  3. requestData: [],
  4. headers:{}
  5. }, function (result) {
  6. console.log(result);
  7. });

参数说明

名称 类型 描述 可选 默认值
operationType string RPC 服务名称 N
requestData array RPC 请示的参数。需要开发者根据具体 RPC 接口自行构造 N
headers dictionary RPC 请求设置的 headers Y {}
gateway string 网关地址 Y alipay 网关
compress boolean 是否支持 request gzip 压缩 Y true
disableLimitView boolean RPC 网关被限流时是否禁止自动弹出统一限流弹窗。 Y false

结果

结果 类型 描述
result dictionary RPC 响应的结果(非字典结构的字符串值会被放入一个字典结构,key 为 resData)

错误

error 描述
10 网络错误
11 请求超时
其他 由 mobilegw 网关定义