Flutter插件cmbpbflutter的介绍与使用

Flutter插件cmbpbflutter的介绍与使用

CmbpbFlutter

Flutter 招商一网通支付 SDK。

相关文档

• 招商一网通支付接入文档
• Universal Links

添加依赖

在 pubspec.yaml 文件中添加 cmbpbflutter 依赖:

dependencies:
  cmbpbflutter: ^${latestVersion}

相关配置

Android

需要在 Android 工程 AndroidManifest.xml 下配置回调入口，并配置招行分配给商户的「URL scheme」：

<activity
    android:name="cmb.pb.flutter.cmbpbflutter.CmbPbPayCallbackActivity"
    android:label="@string/app_name"
    android:exported="true"
    android:theme="@style/CmbPbPay.Theme.Transparent"
    android:taskAffinity="${applicationId}"
    android:launchMode="singleTop">

    <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <data android:scheme="${招行给的回调url scheme}"/>
    </intent-filter>
</activity>

iOS

配置 Xcode 中

• 在 info.plist 中增加 LSApplicationQueriesSchemes 白名单配置，值为 cmbmobilebank。
• 在 URL Types 中新增 URL Schemes，值设置为招行分配给商户的 scheme（需与安卓设置的 scheme 保持一致）。例如分配到的 scheme 为 abcdefg 则配置如下图所示。

基本使用

示例代码：

import 'package:cmbpbflutter/cmbpbflutter.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter/services.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  StreamSubscription<CmbPbPayResp>? _respSubs;

  String _payResultDesc = "";

  [@override](/user/override)
  void initState() {
    super.initState();
    _respSubs = CmbPbPay.instance.respStream().listen((event) {
      print("支付结果回调了");
      setState(() {
        _payResultDesc = "${event.code} ===${event.msg}";
      });
    });
    CmbPbPay.instance.registerApp(appId: "12306");
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('招行一网通支付demo'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ElevatedButton(
                onPressed: _startPay,
                child: Text("支付"),
              ),
              Text("支付结果回调：$_payResultDesc")
            ],
          ),
        ),
      ),
    );
  }

  void _startPay() {
    // Url 编码后的结果
    final requestData = "jsonRequestData=%7B%22charset%22%3A%22UTF-8%22%2C%22reqData%22%3A%7B%22amount%22%3A%2240.00%22%2C%22branchNo%22%3A%220021%22%2C%22date%22%3A%2220210927%22%2C%22dateTime%22%3A%2220210927165358%22%2C%22expireTimeSpan%22%3A%2210%22%2C%22merchantNo%22%3A%22000719%22%2C%22orderNo%22%3A%222109271000098854%22%2C%22payNoticeUrl%22%3A%22https%3A%2F%2Fapp.mjcampus.com%2Fmpay%2Fv100%2Fnotify_cmbchina%22%2C%22returnUrl%22%3A%22aacbaaahbj%3A%2F%2F%22%7D%2C%22sign%22%3A%221566368d8dcf5782add5439b3cdb5f83047f87cc6f35c7903e65916e97df1b0b%22%2C%22signType%22%3A%22SHA-256%22%2C%22version%22%3A%221.0%22%7D";
    final tempAppUrl = "cmbmobilebank://CMBLS/FunctionJump?action=gofuncid&amp;funcid=200013&amp;serverid=CMBEUserPay&amp;requesttype=post&amp;cmb_app_trans_parms_start=here";
    final h5Url = "http://121.15.180.66:801/netpayment/BaseHttp.dll?H5PayJsonSDK";
    CmbPbPay.instance.pay(requestData: requestData, appUrl: tempAppUrl, h5Url: h5Url, method: "pay");
  }
}