Flutter支付集成插件cyberpayflutter的使用

Flutter支付集成插件cyberpayflutter的使用

引言

Cyberpay为您提供在尼日利亚快速方便地进行支付和收款的服务。

关于SDK

Cyberpay Flutter SDK是一个易于使用的库，可以快速将Cyberpay集成到您的移动应用中。它作为现有Cyberpay网络服务的包装器，并创建了一个用于卡和银行交易的移动入口点。

SDK提供了自定义视图/布局以处理结账、PIN、OTP、安全3D等业务逻辑，并仅暴露三个回调来表示交易状态。

要求

Cyberpay Flutter SDK兼容支持iOS 11及以上的iOS应用。

开始使用

安装

1. 在pubspec.yaml文件的依赖部分添加cyberpay包。以下代码将使cyberpayflutter插件的Dart API在您的应用程序中可用：

   dependencies:
     cyberpayflutter: ^1.0.4
   

2. 在项目目录中运行以下命令以下载该包：

   flutter pub get
   

使用Cyberpay SDK

步骤1：导入Cyberpay SDK

import 'package:cyberpayflutter/cyberpayflutter.dart';

步骤2：使用我们的Drop-In UI完成集成

try {
  var result = await Cyberpayflutter.makePayment(
      integrationKey: "MERCHANT_INTEGRATION_KEY",
      amount: "PAYMENT_AMOUNT_IN_KOBO",
      customerEmail: "CUSTOMER_EMAIL",
      liveMode: false);
  if (result.isPaymentSuccessFul) {
    print("Payment is Successful, Your Payment Reference: ${result.paymentReference}");
  } else {
    print(result.errorMessage);
  }
} on PlatformException catch (e) {
  var error = "Cyberpay Error: '${e.message}'.";
  print(error);
}

当交易已在服务器端设置时的Cyberpay集成

步骤1：导入Cyberpay SDK

import 'package:cyberpayflutter/cyberpayflutter.dart';

步骤2：使用我们的服务器Drop-In UI完成集成

try {
  var result = await Cyberpayflutter.makePaymentWithReference(
      integrationKey: "MERCHANT_INTEGRATION_KEY",
      reference: "TRANSACTION_REFERENCE_FROM_SERVER",
      liveMode: false);
  if (result.isPaymentSuccessFul) {
    print("Payment is Successful, Your Payment Reference: ${result.paymentReference}");
  } else {
    print(result.errorMessage);
  }
} on PlatformException catch (e) {
  var error = "Cyberpay Error: '${e.message}'.";
  print(error);
}

注意：当上线时，确保将liveMode更改为true，并更改integration key。此密钥可以从Cyberpay商户门户上的商户仪表板获取。

示例

要运行示例项目，请克隆仓库并在终端中运行以下命令：

flutter run

许可证

cyberpaysdk 在MIT许可证下可用。详情请参阅LICENSE文件。

示例代码

以下是示例项目的源代码，位于 example/lib/main.dart 文件中：

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:cyberpayflutter/cyberpayflutter.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(MyApp());
}

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

class _MyAppState extends State<MyApp> {
  bool liveMode = false;
  String transactionRef = "";
  final _formKey = GlobalKey<FormState>();

  [@override](/user/override)
  void initState() {
    super.initState();
  }

  // 平台消息是异步的，因此我们初始化在异步方法中。
  Future<void> makePaymentWithReference() async {
    try {
      var result = await Cyberpayflutter.makePaymentWithReference(
        integrationKey: "005e84081f9f408586de873338fa54b7",
        reference: transactionRef.trim(),
        liveMode: liveMode,
      );
      if (result.isPaymentSuccessFul) {
        print("Payment is Successful, Your Payment Reference: ${result.paymentReference}");
      } else {
        print(result.errorMessage);
      }
    } on PlatformException catch (e) {
      var error = "Cyberpay Error: '${e.message}'.";
      print(error);
    }
  }

  Future<void> makeSamplePayment() async {
    try {
      var result = await Cyberpayflutter.makePayment(
          integrationKey: "005e84081f9f408586de873338fa54b7",
          amount: 10000,
          customerEmail: "sample@demoemail.com",
          liveMode: false);
      if (result.isPaymentSuccessFul) {
        print("Payment is Successful, Your Payment Reference: ${result.paymentReference}");
      } else {
        print(result.errorMessage);
      }
    } on PlatformException catch (e) {
      var error = "Cyberpay Error: '${e.message}'.";
      print(error);
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: const Text('A demo Cyberpay Flutter Payment'),
        ),
        body: Padding(
          padding: const EdgeInsets.all(32.0),
          child: Center(
            child: Form(
              key: _formKey,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      liveMode ? Text("Production") : Text("Staging"),
                      Switch(
                          value: liveMode,
                          onChanged: (bool newValue) {
                            setState(() {
                              liveMode = newValue;
                            });
                          })
                    ],
                  ),
                  SizedBox(height: 16),
                  MaterialButton(
                    child: Text('Pay Demo N100'),
                    onPressed: () => makeSamplePayment(),
                    elevation: 8,
                    highlightElevation: 2,
                    color: Colors.redAccent,
                    padding: EdgeInsets.all(20.0),
                    colorBrightness: Brightness.dark,
                  ),
                  SizedBox(height: 32),
                  TextFormField(
                    validator: (value) => value!.isEmpty ? "Required" : null,
                    decoration: InputDecoration(
                      labelText: "Transaction Reference",
                      hintText: "Enter Transaction Reference",
                    ),
                    onChanged: (value) {
                      setState(() {
                        transactionRef = value;
                      });
                    },
                  ),
                  SizedBox(height: 16),
                  MaterialButton(
                    child: Text('Pay Demo N100 with reference'),
                    onPressed: () {
                      if (_formKey.currentState!.validate()) {
                        makePaymentWithReference();
                      }
                    },
                    elevation: 8,
                    highlightElevation: 2,
                    color: Colors.redAccent,
                    padding: EdgeInsets.all(20.0),
                    colorBrightness: Brightness.dark,
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}