Flutter如何集成Flutterwave支付链接

我在Flutter项目中需要集成Flutterwave支付功能，但不太清楚具体该怎么做。有没有详细步骤说明或者代码示例？主要想了解如何生成支付链接、处理回调以及测试支付流程。官方文档看了还是不太明白，特别是Android和iOS端配置是否有特殊要求？希望有经验的朋友能分享一下实现方法。

2 回复

在Flutter中集成Flutterwave支付，可使用官方flutterwave_flutter插件。步骤如下：

  1. 添加依赖到pubspec.yaml
  2. 初始化Flutterwave
  3. 调用支付方法并处理回调

示例代码：

Flutterwave flutterwave = Flutterwave(
  context: context,
  publicKey: "你的公钥",
  currency: "NGN",
  amount: "1000",
  customer: Customer(
    email: "user@example.com"
  ),
  paymentOptions: "card, ussd",
  customizations: Customizations(
    title: "测试支付"
  )
);

更多关于Flutter如何集成Flutterwave支付链接的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中集成Flutterwave支付，可以通过以下步骤实现：

1. 添加依赖

在 pubspec.yaml 中添加 flutterwave_standard 依赖：

dependencies:
  flutterwave_standard: ^1.0.0

运行 flutter pub get 安装。

2. 配置支付参数

在支付页面导入包并设置支付参数：

import 'package:flutterwave_standard/flutterwave.dart';

void makePayment() {
  final style = FlutterwaveStyle(
    appBarText: "支付",
    buttonColor: Colors.blue,
    buttonTextStyle: TextStyle(color: Colors.white),
    appBarColor: Colors.blue,
    dialogCancelTextStyle: TextStyle(color: Colors.red),
    dialogContinueTextStyle: TextStyle(color: Colors.blue),
  );

  final Customer customer = Customer(
    name: "用户姓名",
    phoneNumber: "123456789",
    email: "user@example.com"
  );
}

3. 发起支付请求

使用 Flutterwave 实例发起支付：

final Flutterwave flutterwave = Flutterwave(
  context: context,
  style: style,
  publicKey: "YOUR_PUBLIC_KEY", // 从Flutterwave后台获取
  currency: "NGN", // 货币代码
  redirectUrl: "https://your_redirect_url.com", // 支付后重定向URL
  txRef: "unique_transaction_ref_${DateTime.now()}",
  amount: "100", // 支付金额
  customer: customer,
  paymentOptions: "card, bank, ussd",
  customization: Customization(title: "自定义标题"),
  isTestMode: true, // 测试模式设为true，生产环境设为false
);

try {
  final ChargeResponse response = await flutterwave.charge();
  if (response != null) {
    print("支付状态: ${response.status}");
    if (response.status == "success") {
      // 支付成功处理
      print("交易ID: ${response.transactionId}");
    } else {
      // 支付失败或取消
      print("支付失败: ${response.message}");
    }
  }
} catch (error) {
  print("支付异常: $error");
}

4. 处理支付结果

根据 ChargeResponse 的 status 字段判断支付结果：

  • success: 支付成功
  • error: 支付失败
  • cancelled: 用户取消

注意事项：

  1. 密钥管理：不要将公钥和密钥硬编码在代码中，建议通过后端服务获取。
  2. 重定向URL：确保在Flutterwave后台配置正确的重定向URL。
  3. 测试模式：上线前将 isTestMode 设为 false。

通过以上步骤即可在Flutter应用中快速集成Flutterwave支付功能。

回到顶部