Flutter支付集成插件maswend_midtrans的使用

Flutter支付集成插件maswend_midtrans的使用

本项目是一个Flutter插件包的起点,专门包含适用于Android和/或iOS平台的特定平台实现代码。

开始使用

对于Flutter开发的初学者,可以查看我们的在线文档,其中包括教程、示例、移动开发指南和完整的API参考。

示例代码

以下是一个完整的示例代码,展示了如何使用maswend_midtrans插件进行支付集成。

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

import 'package:flutter/services.dart';
import 'package:maswend_midtrans/maswend_midtrans.dart';

void main() => runApp(MyApp());

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

class _MyAppState extends State<MyApp> {
  final flutterWrapper = MaswendMidtrans();

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

  void _initSdk() {
    // 监听交易完成事件
    flutterWrapper.onTransactionFinished = (MidtransTransactionStatus status) {
      debugPrint('DART: TRX FINISHED');
      debugPrint('TRX FINISHED with status: $status');

      // 根据交易状态进行相应的处理
      switch (status) {
        case MidtransTransactionStatus.Success:
          debugPrint('Transaction success!');
          break;
        case MidtransTransactionStatus.Pending:
          debugPrint('Transaction status pending');
          break;
        case MidtransTransactionStatus.Invalid:
          debugPrint('Transaction Invalid');
          break;
        case MidtransTransactionStatus.Failed:
          debugPrint('Payment Failed');
          break;
        case MidtransTransactionStatus.Cancelled:
          debugPrint('User cancelling payment flow');
          break;
      }
    };

    // 初始化SDK
    flutterWrapper.initMidtransSdk(
       'ClientKey', 'Merchant_URL',
        isSandbox: true);
  }

  void _setUserDetail()async {
    // 设置用户详细信息
    var userDetail = UserDetailMidtrans()
      ..userFullName = 'Edi Kurniawan'
      ..email = 'edi@clade.ventures'
      ..phoneNumber = '085642990808'
      ..address = 'Tangerang'
      ..city = 'Tangerang'
      ..zipCode = '12345'
      ..country = 'Indonesia';
    await flutterWrapper.setUserDetail(userDetail);
  }

  void _addItemDetail() async{
    // 添加商品详细信息
    var itemDetail = ItemDetailMidtrans()
      ..id = '123'
      ..price = 20000.0
      ..quantity = 2
      ..name = 'Dummy Item';
    await flutterWrapper.addItemDetail(itemDetail);
  }

  void _createTransaction() async{
    // 创建交易请求
    await flutterWrapper.setTransactionRequest('TRX100009', 40000.0);
  }

  void _startPayment() {
    // 开始支付流程
    flutterWrapper.startPayment();
  }

  void _startPaymentWithUserDetail() {
    // 开始支付流程并跳过用户详情输入
    flutterWrapper.startPayment(skipCustomerDetails: false);
  }

  var snapToken = '34df554e-5250-4b37-b2f9-3c213a398007';

  void _startPaymentWithToken() async {
    // 使用Snap Token开始支付
    await flutterWrapper.startPayment(paymentMethod: MidtransPaymentMethod.GoPay,snapToken: snapToken);
  }

  void _startBankTransferPaymentWithToken() async {
    // 使用银行转账方式开始支付
    await flutterWrapper.startPayment(
        paymentMethod: MidtransPaymentMethod.BankTransferPermata,
        snapToken: snapToken);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: const Text('Plugin example app'),
        ),
        body: new Center(
          child: Column(
            children: <Widget>[
              /// 暂时禁用
              RaisedButton(
                child: Text('设置用户详细信息'),
                onPressed: _setUserDetail,
              ),
              RaisedButton(
                child: Text('添加商品详细信息'),
                onPressed: _addItemDetail,
              ),
              RaisedButton(
                child: Text('创建交易请求'),
                onPressed: _createTransaction,
              ),
              RaisedButton(
                child: Text('开始支付流程'),
                onPressed: _startPayment,
              ),
              RaisedButton(
                child: Text('开始支付流程(带用户详细信息)'),
                onPressed: _startPaymentWithUserDetail,
              ),
              RaisedButton(
                child: Text('开始使用Snap Token支付'),
                onPressed: _startPaymentWithToken,
              ),
              RaisedButton(
                child: Text('开始使用银行转账支付'),
                onPressed: _startBankTransferPaymentWithToken,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

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

1 回复

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


maswend_midtrans 是一个用于在 Flutter 应用程序中集成 Midtrans 支付的插件。Midtrans 是一个印度尼西亚的支付网关,支持多种支付方式,包括信用卡、银行转账、电子钱包等。通过 maswend_midtrans 插件,你可以轻松地在你的 Flutter 应用中集成 Midtrans 支付功能。

以下是如何使用 maswend_midtrans 插件的步骤:

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 maswend_midtrans 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  maswend_midtrans: ^1.0.0  # 请使用最新的版本号

然后运行 flutter pub get 来获取依赖。

2. 初始化 Midtrans

在你的 Flutter 应用中,首先需要初始化 Midtrans。你可以在 main.dart 或其他合适的地方进行初始化:

import 'package:maswend_midtrans/maswend_midtrans.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化 Midtrans
  MaswendMidtrans.initialize(
    clientKey: 'your_client_key',  // 你的 Midtrans 客户端密钥
    baseUrl: 'https://your-base-url.com',  // 你的服务器基础 URL
    isProduction: false,  // 设置为 true 以使用生产环境
  );

  runApp(MyApp());
}

3. 发起支付请求

在需要发起支付的地方,你可以使用 MaswendMidtrans.startPayment 方法来发起支付请求。通常,你需要传递订单的详细信息,如订单 ID、金额等。

import 'package:maswend_midtrans/maswend_midtrans.dart';

Future<void> startPayment() async {
  try {
    final transactionDetails = TransactionDetails(
      orderId: 'ORDER123456',  // 订单 ID
      grossAmount: 100000,  // 订单金额
    );

    final result = await MaswendMidtrans.startPayment(
      transactionDetails: transactionDetails,
      creditCardOptions: CreditCardOptions(
        saveCard: false,  // 是否保存信用卡信息
        secure: true,  // 是否启用 3D Secure
      ),
    );

    if (result.status == 'success') {
      print('Payment successful: ${result.transactionId}');
    } else {
      print('Payment failed: ${result.message}');
    }
  } catch (e) {
    print('Error: $e');
  }
}

4. 处理支付结果

MaswendMidtrans.startPayment 方法会返回一个 PaymentResult 对象,你可以根据 status 字段来判断支付是否成功。

if (result.status == 'success') {
  // 支付成功
} else {
  // 支付失败
}

5. 处理回调

Midtrans 会向你的服务器发送支付结果回调。你需要在服务器端处理这些回调,并根据回调内容更新订单状态。

6. 测试和生产环境

在开发阶段,你可以将 isProduction 参数设置为 false,以使用 Midtrans 的沙盒环境进行测试。在生产环境中,将其设置为 true

7. 其他配置

maswend_midtrans 插件还支持其他配置选项,如自定义 UI、启用/禁用特定支付方式等。你可以根据需要进行配置。

8. 注意事项

  • 确保你的 Midtrans 账户已正确配置,并且你有正确的 clientKeyserverKey
  • 在生产环境中,确保你的服务器能够处理 Midtrans 的回调请求。
  • 根据 Midtrans 的文档,正确处理支付结果和回调。

9. 示例代码

以下是一个完整的示例代码:

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

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  
  MaswendMidtrans.initialize(
    clientKey: 'your_client_key',
    baseUrl: 'https://your-base-url.com',
    isProduction: false,
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Midtrans Payment'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: startPayment,
            child: Text('Pay Now'),
          ),
        ),
      ),
    );
  }
}

Future<void> startPayment() async {
  try {
    final transactionDetails = TransactionDetails(
      orderId: 'ORDER123456',
      grossAmount: 100000,
    );

    final result = await MaswendMidtrans.startPayment(
      transactionDetails: transactionDetails,
      creditCardOptions: CreditCardOptions(
        saveCard: false,
        secure: true,
      ),
    );

    if (result.status == 'success') {
      print('Payment successful: ${result.transactionId}');
    } else {
      print('Payment failed: ${result.message}');
    }
  } catch (e) {
    print('Error: $e');
  }
}
回到顶部