请求规范

[toc]

一、JS请求结果结构规范(JSResponseModel)

json举例

{
  "resultCode": 0,
  "message": "成功",
  "result": map 或 array
}

点击跳转到附文查看：JSResponseModel 代码示例

二、JS调用规范

1、规范标准

1、js需要回传值时候，回传值方法统一由h5的callbackMethod告知app(而非app写死)

2、js需要回传值时候，一定要有回传值，且回传值结果必须如《本文》中的【一、JS请求结果结构】所示

2、JS调用示例

/// 调起微信小程序去支付
 static JavascriptChannel pay(
   BuildContext context, {
   required WebViewController? Function() webViewControllerGetBlock,
 }) {
   return BJJavascriptChannel(
     name: 'h5CallBridgeAction_pay',
     onMessageReceived: (JavaScriptMessage message) async {
       Map<String, dynamic>? map = json.decode(message.message.toString());
       if (map == null) {
         return;
       }

       Map<String, dynamic> jsCallbackMap = JSResponseModel.initMap();
       if (map['payType'] == null || map['payType'].isEmpty) {
         jsCallbackMap = JSResponseModel.errorMap(message: '缺少 payType 参数');
       } else {
         MiniProgramPayBean payParams = MiniProgramPayBean.fromJson(map);
         bool isSuccess = false;
         if (map['payType'] == 'wx_mp') {
           isSuccess = await WXMPPay.jumpWechatMP2Pay(payParams);
         } else {
           isSuccess = await WXMPPay.jumpWechatMP2Pay(payParams);
         }
         jsCallbackMap = JSResponseModel.successMap(isSuccess: isSuccess);
       }

       String? jsMethodName = map["callbackMethod"];
       if (jsMethodName == null) {
         WebViewController? webViewController = webViewControllerGetBlock();
         WebViewWays.runJavaScriptMap(
           jsMethodName!,
           params: jsCallbackMap,
           controller: webViewController,
         );
       }
     },
   );
 }

三、测试JS的JS接口

描述	JS方法	其他
测试 h5 调用 app 方法，并将返回值回调给 h5	h5CallBridgeAction_test_h5CallAppAndCallBackToH5
测试浏览器中的链接显示，且链接可打开app的_原生页面	h5CallBridgeAction_test_openBrowser
原生调用h5提供的显示回传值的方法	bridgeCallH5Action_showCallbackJsonString

四、公共的JS接口

1、app设备相关

描述	JS方法	其他
获取app的公共信息，并将返回值回调给 h5	h5CallBridgeAction_getFixedAppInfo	改用user-agent
获取埋点monitor的公共信息，并将返回值回调给 h5	h5CallBridgeAction_getFixedMonitorInfo
更新状态栏颜色	h5CallBridgeAction_updateAppStatusBarStyle
是否是模拟器	h5CallBridgeAction_isSimulator

2、用户相关

描述	JS方法	其他
获取用户token(用于安全的告知h5用户信息)，并将返回值回调给 h5	h5CallBridgeAction_getCurrentUserToken
退出登录	h5CallBridgeAction_logout

3、基础提示相关

描述	JS方法	其他
显示app的toast样式	h5CallBridgeAction_showAppToast

4、路由相关

描述	JS方法	其他
跳转到app指定页面_Url	h5CallBridgeAction_jumpAppPageUrl
跳转到app指定页面_Name	h5CallBridgeAction_jumpAppPageName

5、分享相关

描述	JS方法	其他
分享内容到指定的分享方式(微信聊天页面等)	h5CallBridgeAction_share

6、网页相关

描述	JS方法	其他
刷新网页(到新地址)	h5CallBridgeAction_reloadAppWebView
关闭webview	h5CallBridgeAction_closeWebView

五、业务相关的JS接口

入参	JS方法	其他
发送IM的各种信息	h5CallBridgeAction_sendIMText

六、JS安全

附1：JSResponseModel代码示例

class JSResponseModel 示例：

// h5CallBridge_responseModel.dart
class JSResponseModel {
  final int resultCode;
  final String? message;
  final dynamic result;

  JSResponseModel({
    this.resultCode = 0,
    this.message,
    this.result,
  });

  // js默认的map（默认是成功）
  static Map<String, dynamic> initMap({
    String? message,
  }) {
    return JSResponseModel(
      resultCode: 0,
    ).toMap();
  }
  // js失败时候的map
  static Map<String, dynamic> errorMap({
    String? message,
  }) {
    return JSResponseModel(resultCode: 1, message: message).toMap();
  }
  // js成功时候的map
  static Map<String, dynamic> successMap({
    required bool isSuccess,
    dynamic result,
  }) {
    return JSResponseModel(
      resultCode: isSuccess ? 1 : 0,
      result: result,
    ).toMap();
  }
  
  // Model 转 map 以回传结果给h5
  Map<String, dynamic> toMap() {
    Map<String, dynamic> responseMap = {};

    responseMap.addAll({"resultCode": resultCode});
    if (message != null) {
      responseMap.addAll({"message": message});
    }
    if (result != null) {
      responseMap.addAll({"result": result});
    }
    return responseMap;
  }

  bool get isSuccess => resultCode == 0;
}

End