Flutter支付集成插件pesepay的使用

发布于 1周前 作者 htzhanglong 来自 Flutter

Flutter支付集成插件pesepay的使用

Pesepay

Pesepay 帮助非洲的企业从任何地方收款。

style: very good analysis Powered by Mason License: MIT ```

这个插件还在开发中!你可以尝试并贡献你的一份力量。

安装 💻

❗ 要开始使用 Pesepay,必须在你的机器上安装 Dart SDK。

pubspec.yaml 文件中添加 pesepay

dependencies:
  pesepay:

安装它:

dart pub get

使用 🔥

导入包

import 'package:pesepay/pesepay.dart';

声明和初始化

final pesepay = Pesepay(
  integrationKey: '', // 你的集成密钥
  encryptionKey: '', // 加密密钥
  resultUrl: '', // 结果 URL
  returnUrl: '', // 返回 URL
);

获取活动货币列表

final List<Currency> currencies = await Pesepay.getActiveCurrencies();

示例货币:

Currency(
    name: "Zimbabwe Dollar", 
    description: "Zimbabwe Dollar", 
    code: "ZWL", 
    defaultCurrency: false,
    rateToDefault: 604.25,
    active: true
)

获取选定货币的支付方法列表

final List<PaymentMethod> methods = await Pesepay.getPaymentMethodsByCurrency(currency);

示例支付方法:

PaymentMethod(
  active: true,
  code: "PZW201",
  currencies: ["ZWL"], 
  description: "Make payment directly from your mobile phone.",
  id: 1,
  maximumAmount: 50000.0,
  minimumAmount: 2.0, 
  name: "Ecocash", 
  processingPaymentMessage: "Please enter PIN on the phone that is making the payment.",
  redirectRequired: false, 
  redirectURL: null, 
  requiredFields: [
    RequiredField(
      displayName: "Phone Number", 
      fieldType: "TEXT", 
      name: "customerPhoneNumber", 
      optional: false
    )
  ]
)

执行 Web 交易

这依赖于返回的 Web redirectUrl,客户可以使用该 URL 完成交易。

首先创建交易:

final Transaction transaction = pesepay.createTransaction(
  amount: 1,
  currencyCode: 'ZWL',
  transactionDescription: 'Bag of potatoes',
  transactionReference: '111-222-333'
);

然后处理交易:

final TransactionResponse response = await pesepay.initiateWebTransaction(transaction);

如果上述执行过程中出现任何错误(无论是包本身还是 Pesepay 服务器端),你应该会收到一个 PesepayException。因此,处理这种情况会很有帮助。

执行无缝交易

首先创建交易:

final SeamlessTransaction seamlessTransaction = pesepay.createSeamlessTransaction(
  customerName: 'Cool Name',
  customerEmail: 'yourmail@email.com',
  customerPhone: '0777111111',
  amount: 1,
  currencyCode: 'ZWL',
  transactionDescription: 'Banana Peel',
  transactionReference: '111-222-333',
  paymentMethodCode: paymentMethodCode,
);

处理无缝交易:

final TransactionResponse response = await pesepay.initiateSeamlessTransaction(seamlessTransaction);

检查交易状态

final TransactionResponse response = await pesepay.checkTransactionStatus(pollUrl);

无服务器结账?

与其使用延迟来检查交易状态,你还可以使用 stream 来获取 TransactionResponse 使用 pollUrl

  • pesepay.streamTransactionResponse(..) 接受一个必需的 pollUrl 字符串和可选的 streamInterval(以秒为单位),这是轮询 URL 的间隔,默认为 20 秒。
  • 你可以使用 StreamBuilder 在 UI 上向用户显示当前的交易状态:
final String pollUrl = response.pollUrl;

// 在 Widget build(..) 方法中
// 你可以这样做
StreamBuilder(
  stream: pesepay.streamTransactionResponse(pollUrl),
  builder: (context, AsyncSnapshot<TransactionResponse> snapshot) {
    if(snapshot.hasData) {
      final TransactionResponse response = snapshot.data!;
      return response.paid ? SuccessWidget() : OtherWidgetsForErrorOrWaiting();
    } else {
      return CircularProgressIndicator();
    }
  }
)

完整使用示例

void main() async {
  try {
    final pesepay = Pesepay(
      integrationKey: '',
      encryptionKey: '',
      resultUrl: '',
      returnUrl: '',
    );

    final Transaction transaction = pesepay.createTransaction(
      amount: 1,
      currencyCode: 'ZWL',
      transactionDescription: 'Bag of potatoes',
      transactionReference: '111-222-333'
    );

    final TransactionResponse response = await pesepay.initiateWebTransaction(transaction);

    // 添加延迟以检查状态,可能 20-30 秒
    await Future.delayed(const Duration(seconds: 30));

    // 检查状态
    final TransactionResponse pollResponse = await pesepay.checkTransactionStatus(response.pollUrl);

    if (pollResponse.paid) {
      // 好吧,你成功了
      print('I deserve drinks 🍻');
    } else {
      // 不行啊,伙计
      print('👎🏿');
    }

  } on PesepayException catch (e) {
    print(e.message);
  } catch (e) {
    // 哎呀
  }
}

更多关于Flutter支付集成插件pesepay的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter支付集成插件pesepay的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是一个关于如何在Flutter项目中集成并使用pesepay支付插件的示例代码。假设你已经有一个Flutter项目,并且已经配置好了基本的开发环境。

1. 添加依赖

首先,在你的pubspec.yaml文件中添加pesepay插件的依赖。确保你使用的是最新版本,可以在pub.dev网站上查找最新版本号。

dependencies:
  flutter:
    sdk: flutter
  pesepay: ^latest_version  # 替换为实际的最新版本号

然后运行flutter pub get来安装依赖。

2. 配置Android和iOS支付环境

根据pesepay插件的文档,你可能需要在AndroidManifest.xmlInfo.plist中添加一些配置。这通常涉及到设置支付相关的权限和URL schemes。具体配置请参考pesepay插件的官方文档。

3. 初始化Pesepay

在你的Flutter应用的入口文件(通常是main.dart)中,初始化Pesepay客户端。

import 'package:flutter/material.dart';
import 'package:pesepay/pesepay.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Pesepay Integration'),
        ),
        body: Center(
          child: PesepayButtonWidget(),
        ),
      ),
    );
  }
}

class PesepayButtonWidget extends StatefulWidget {
  @override
  _PesepayButtonWidgetState createState() => _PesepayButtonWidgetState();
}

class _PesepayButtonWidgetState extends State<PesepayButtonWidget> {
  final Pesepay _pesepay = Pesepay(
    publicKey: 'your_public_key', // 替换为你的公钥
    privateKey: 'your_private_key', // 替换为你的私钥
    environment: PesepayEnvironment.sandbox, // 或PesepayEnvironment.production
  );

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () {
        _initiatePayment();
      },
      child: Text('Initiate Payment'),
    );
  }

  void _initiatePayment() async {
    try {
      // 构建支付请求数据
      final Map<String, dynamic> paymentData = {
        'amount': 100.0, // 支付金额
        'currency': 'USD', // 货币类型
        'description': 'Test Payment', // 支付描述
        'reference': DateTime.now().toString(), // 唯一支付引用
        // 添加其他必要的支付参数
      };

      // 发起支付请求
      final PesepayResponse response = await _pesepay.startPayment(paymentData);

      if (response.status == 'success') {
        // 支付成功处理
        print('Payment successful: ${response.data}');
      } else {
        // 支付失败处理
        print('Payment failed: ${response.message}');
      }
    } catch (e) {
      // 错误处理
      print('Error initiating payment: $e');
    }
  }
}

4. 处理支付回调

根据pesepay的文档,支付成功后通常会有回调通知。你需要在你的后端设置一个回调URL,并在该URL上处理支付结果。Flutter前端不需要处理这个回调,但它可能涉及到更新UI或存储支付结果等操作。

注意事项

  • 确保你已经注册了pesepay账号,并获取了必要的公钥和私钥。
  • 测试支付时,使用沙盒环境(PesepayEnvironment.sandbox),上线后再切换到生产环境(PesepayEnvironment.production)。
  • 仔细阅读pesepay插件的官方文档,了解所有可用的配置和API。

以上代码是一个基本的集成示例,具体实现可能需要根据pesepay插件的最新文档和你的实际需求进行调整。

回到顶部