Flutter支付集成插件midtrans_plugin的使用

Midtrans 插件

引言

此插件用于将Midtrans支付网关集成到您的Flutter应用中。Midtrans是一家基于技术的金融服务公司，提供印度尼西亚的支付网关服务。它支持多种在线支付方式，并提供资金转账（放款）功能，使客户在业务交易中更加便捷，并专注于发展业务。

功能

• 无缝集成Midtrans支付网关。
• 可定制的支付方式和配置选项。
• 安全处理交易以保护用户敏感数据。
• 易于使用的API来发起和管理交易。

安装

要使用此插件，请遵循以下步骤：

1. 添加依赖：在您的pubspec.yaml文件中添加以下行：

   dependencies:
     midtrans_plugin: <latest_version>
   

2. 安装包：在终端中运行以下命令：

   flutter pub get
   

使用方法

1. 导入插件

import 'package:midtrans_plugin/midtrans_plugin.dart';

2. 初始化Midtrans

String merchantClientKey = 'clientKeySandbox';
String merchantUrl = 'merchantUrlSandbox';

if (!kDebugMode && !kProfileMode) {
    merchantClientKey = 'clientKeyProd';
    merchantUrl = 'merchantUrlProd';
}

final config = MidtransConfig(
    merchantClientKey: merchantClientKey,
    merchantUrl: merchantUrl,
);

await MidtransPlugin.initialize(config);

3. 发起交易

try {
    final transactionDetails = TransactionDetails(
        orderId: 'ORDER-${DateTime.now().millisecondsSinceEpoch}',
        grossAmount: 10.0,
    );

    final itemDetails = [
        ItemDetail(
            id: 'product_a',
            price: 10.0,
            quantity: 1,
            name: '产品A',
        )
    ];

    final customerDetails = CustomerDetails(
        firstName: 'John',
        lastName: 'Doe',
        email: 'john@example.com',
        phone: '08123456789',
        billingAddress: BillingAddress(
            firstName: 'John',
            lastName: 'Doe',
            address: 'Jl. Buntu No. 2',
            city: '雅加达',
            phone: '08123456789',
            postalCode: '112233',
        ),
    );

    await MidtransPlugin.instance.startPayment(
        MidtransPayload(
            transactionDetails: transactionDetails,
            itemDetails: itemDetails,
            customerDetails: customerDetails,
        ),
    );

} catch (e) {
    print('发生错误 $e');
}

4. 处理支付结果

MidtransPlugin.onTransactionResult.listen((result) {
    print('[transactionResult] $result');
});

示例代码

import 'dart:async';
import 'dart:developer';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:midtrans_plugin/midtrans_plugin.dart';
import 'package:midtrans_plugin/models/midtrans_config.dart';
import 'package:midtrans_plugin/models/midtrans_payload.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  String merchantClientKey = 'clientKeySandbox';
  String merchantUrl = 'merchantUrlSandbox';
  if (!kDebugMode &amp;&amp; !kProfileMode) {
    merchantClientKey = 'clientKeyProd';
    merchantUrl = 'merchantUrlProd';
  }

  final config = MidtransConfig(
    merchantClientKey: merchantClientKey,
    merchantUrl: merchantUrl,
    paymentTypeConfig: PaymentTypeConfig.twoClickPayment,
  );

  await MidtransPlugin.initialize(config);

  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() =&gt; _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _message = '';
  bool _isLoading = false;

  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey();

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

    MidtransPlugin.onTransactionResult.listen((result) {
      log('[transactionResult] $result');
      final transactionID = result.transactionId;
      final status = result.transactionStatus;

      String message = '';
      if (result.isCanceled) message = '已取消';

      if (result.isFailed) message = '支付失败';

      if (transactionID != null &amp;&amp; transactionID.isNotEmpty) {
        message += 'transactionID: $transactionID';
      }
      if (status != null &amp;&amp; status.isNotEmpty) message += ' $status';

      ScaffoldMessenger.of(_scaffoldKey.currentContext!).showSnackBar(
        SnackBar(content: Text(message)),
      );
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        key: _scaffoldKey,
        appBar: AppBar(
          title: const Text('插件示例应用'),
        ),
        body: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              if (_message.isNotEmpty) Text(_message),
              if (_isLoading)
                const CircularProgressIndicator.adaptive()
              else
                ElevatedButton(
                  onPressed: () async {
                    setState(() {
                      _isLoading = true;
                      _message = '';
                    });

                    try {
                      final transactionDetails = TransactionDetails(
                        orderId:
                            'ORDER-${DateTime.now().millisecondsSinceEpoch}',
                        grossAmount: 10.0,
                      );

                      final itemDetails = [
                        ItemDetail(
                          id: 'product_a',
                          price: 10.0,
                          quantity: 1,
                          name: '产品A',
                        )
                      ];

                      final customerDetails = CustomerDetails(
                        firstName: 'John',
                        lastName: 'Doe',
                        email: 'john@example.com',
                        phone: '08123456789',
                        billingAddress: BillingAddress(
                          firstName: 'John',
                          lastName: 'Doe',
                          address: 'Jl. Buntu No. 2',
                          city: '雅加达',
                          phone: '08123456789',
                          postalCode: '112233',
                        ),
                      );

                      await MidtransPlugin.instance.startPayment(
                        MidtransPayload(
                          transactionDetails: transactionDetails,
                          itemDetails: itemDetails,
                          customerDetails: customerDetails,
                        ),
                      );

                      setState(() {
                        _isLoading = false;
                      });
                    } catch (e) {
                      log('发生错误', error: e);
                      setState(() {
                        _isLoading = false;
                        _message = '无法支付';
                      });
                    }
                  },
                  child: const Text('支付'),
                ),
            ],
          ),
        ),
      ),
    );
  }
}