Flutter支付集成插件payme_miniapp_flutter的使用

Flutter支付集成插件payme_miniapp_flutter的使用

简介

payme_miniapp_flutter 是一个用于在 Flutter 应用程序中集成支付功能的插件。通过此插件,您可以轻松实现支付、转账、查询余额等功能。本文将详细介绍如何在 Flutter 项目中配置并使用该插件。


使用步骤

  1. 添加依赖pubspec.yaml 文件中添加以下依赖:

    dependencies:
      flutter_dotenv: ^x.x.x
      payme_miniapp_flutter: ^x.x.x
    
  2. 安装依赖 在终端运行以下命令以安装依赖:

    flutter pub get
    
  3. 配置环境变量 创建 .env 文件并在其中添加您的 API 密钥和环境信息:

    APP_ID_MERCHANT=your_app_id
    PUBLIC_KEY_MERCHANT_RSA=your_public_key
    PRIVATE_KEY_MERCHANT_RSA=your_private_key
    ENVIRONMENT=SANDBOX
    
  4. 初始化插件 在应用启动时调用 init() 方法进行初始化:

    await PaymeMiniappFlutter.init(
        dotenv.env['APP_ID_MERCHANT']!,
        dotenv.env['PUBLIC_KEY_MERCHANT_RSA']!,
        dotenv.env['PRIVATE_KEY_MERCHANT_RSA']!,
        locale: PayMELocale.VI, // 支持的语言
        env: PayMEEnv.SANDBOX, // 环境
        mode: PayMEMode.MINIAPP_SANDBOX); // 模式
    

完整示例代码

以下是一个完整的示例代码,展示了如何使用 payme_miniapp_flutter 插件完成支付、查询余额等操作:

import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:payme_miniapp_flutter/payme_miniapp_flutter.dart';
import 'package:payme_miniapp_flutter/payme_miniapp_type.dart';

void main() async {
  await dotenv.load();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Payme Mini App Example',
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  [@override](/user/override)
  HomeScreenState createState() => HomeScreenState();
}

class HomeScreenState extends State<HomeScreen> {
  String? selectedService;
  String phoneNumber = '0795550300';
  String env = "SANDBOX";
  final TextEditingController _phoneNumberController = TextEditingController();

  List<Map<String, String>> services = [
    {"label": "POWE", "value": "POWE"},
    {"label": "WATE", "value": "WATE"},
    {"label": "ADSL", "value": "ADSL"},
    {"label": "TIVI", "value": "TIVI"},
    {"label": "MOBILE_CARD", "value": "MOBILE_CARD"},
    {"label": "MOBILE_TOPUP", "value": "MOBILE_TOPUP"},
    {"label": "GAME_CARD", "value": "GAME_CARD"},
    {"label": "PPMB", "value": "PPMB"}
  ];

  List<Map<String, String>> enviroment = [
    {"label": "PRODUCTION", "value": "PRODUCTION"},
    {"label": "SANDBOX", "value": "SANDBOX"},
  ];

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState();
    _phoneNumberController.text = phoneNumber;

    PaymeMiniappFlutter.onResponse.listen((dynamic response) {
      if (response != null) {
        _showResponseDialog(response.toString(), "Response");
      }
    });

    PaymeMiniappFlutter.onError.listen((dynamic error) {
      if (error != null) {
        _showResponseDialog(error.toString(), "Error");
      }
    });
  }

  Future<void> initPlatformState() async {
    if (!mounted) return;
  }

  Future<void> onOpenMiniApp() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.open(phone: phoneNumber);
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> onOpenService(String? service) async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.service(
        phone: phoneNumber, data: PayMEServiceParam(service: service ?? ''));
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> init() async {
    env == "SANDBOX"
        ? await PaymeMiniappFlutter.init(
            dotenv.env['APP_ID_MERCHANT_SBX']!,
            dotenv.env['PUBLIC_KEY_MERCHANT_RSA_SBX']!,
            dotenv.env['PRIVATE_KEY_MERCHANT_RSA_SBX']!,
            locale: PayMELocale.VI,
            env: PayMEEnv.SANDBOX,
            mode: PayMEMode.MINIAPP_SANDBOX)
        : await PaymeMiniappFlutter.init(
            dotenv.env['APP_ID_MERCHANT']!,
            dotenv.env['PUBLIC_KEY_MERCHANT_RSA']!,
            dotenv.env['PRIVATE_KEY_MERCHANT_RSA']!,
            locale: PayMELocale.VI,
            env: PayMEEnv.PRODUCTION,
            mode: PayMEMode.MINIAPP_PRODUCT);
  }

  Future<void> getBalance() async {
    await PaymeMiniappFlutter.getBalance(phoneNumber);
  }

  Future<void> setLanguage(String language) async {
    await PaymeMiniappFlutter.setLanguage(language);
  }

  Future<void> onDeposit() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.deposit(
        phone: "0795550300", data: PayMEPayParam());
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> onWithdraw() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.withdraw(
        phone: "0795550300", data: PayMEPayParam());
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> onTransfer() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.transfer(
        phone: "0795550300", data: PayMEPayParam());
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> getAccountInfo() async {
    await PaymeMiniappFlutter.getAccountInfo(phoneNumber);
  }

  Future<void> onPayment(String transaction) async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.payment(
        data: PayMEPaymentDirectParam(transaction: transaction));
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> onTransferQR() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.transferQR(
        phone: "0795550300",
        data: PayMETransferQRParam(
            amount: 20000,
            bankNumber: "9704000000000018",
            swiftCode: "SBITVNVX",
            cardHolder: "NGUYEN VAN A",
            note: "test"));
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  Future<void> pay() async {
    PayMEOpeningParam openingParam = PayMEOpeningParam.pay(
        phone: phoneNumber,
        data: PayMEPaymentParam(
            amount: 10000,
            transactionId: generateRandomSixDigitNumber().toString(),
            note: "note"));
    await PaymeMiniappFlutter.open(PayMEOpeningType.modal, openingParam);
  }

  int generateRandomSixDigitNumber() {
    Random random = Random();
    int min = 100000;
    int max = 999999;
    return min + random.nextInt(max - min);
  }

  Future<void> _showResponseDialog(String response, String type) async {
    return showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text(type),
          content: Text(response),
          actions: [
            ElevatedButton(
              onPressed: () {
                Navigator.of(context).pop();
              },
              child: const Text('OK'),
            ),
          ],
        );
      },
    );
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return GestureDetector(
        onTap: () {
          FocusManager.instance.primaryFocus?.unfocus();
        },
        child: Scaffold(
          appBar: AppBar(
            title: const Text('Plugin example app'),
          ),
          body: SafeArea(
            child: SingleChildScrollView(
              child: Column(
                children: [
                  TextField(
                    controller: _phoneNumberController,
                    onChanged: (value) {
                      setState(() {
                        phoneNumber = value;
                      });
                    },
                    keyboardType: TextInputType.number,
                    decoration: const InputDecoration(
                        labelText: 'Nhập số điện thoại',
                        contentPadding: EdgeInsets.symmetric(horizontal: 16)),
                  ),
                  const SizedBox(height: 30),
                  Center(
                      child: Row(
                    children: [
                      DropdownButton(
                        padding: const EdgeInsets.symmetric(horizontal: 16),
                        value: env,
                        items: enviroment.map((Map<String, String> enviroment) {
                          return DropdownMenuItem<String>(
                            value: enviroment["value"]!,
                            child: Text(enviroment["label"]!),
                          );
                        }).toList(),
                        onChanged: (String? value) {
                          setState(() {
                            env = value!;
                          });
                        },
                      ),
                      ElevatedButton(
                        onPressed: init,
                        child: const Text('Change Enviroment'),
                      )
                    ],
                  )),
                  const SizedBox(height: 30),
                  ElevatedButton(
                    onPressed: onOpenMiniApp,
                    child: const Text('Open Mini App'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: () {
                      setLanguage("en");
                      onOpenMiniApp();
                    },
                    child: const Text('Set En Language'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: getBalance,
                    child: const Text('Get Balance'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: onDeposit,
                    child: const Text('Deposit 10.000đ'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: onWithdraw,
                    child: const Text('Withdraw 10.000đ'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: onTransfer,
                    child: const Text('Transfer 10.000đ'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: getAccountInfo,
                    child: const Text('Get Account Info'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: () => onPayment("155762501569"),
                    child: const Text('Payment'),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: () => onTransferQR(),
                    child: const Text('Transfer QR'),
                  ),
                  const SizedBox(height: 16),
                  Center(
                    child: Container(
                      constraints: BoxConstraints(
                          maxWidth: MediaQuery.of(context).size.width * 0.8),
                      padding: const EdgeInsets.all(16.0),
                      child: Row(
                        children: [
                          Expanded(
                            child: DropdownButton<String>(
                              value: selectedService,
                              items: services.map((Map<String, String> service) {
                                return DropdownMenuItem<String>(
                                  value: service["value"]!,
                                  child: Text(service["label"]!),
                                );
                              }).toList(),
                              onChanged: (String? newValue) {
                                setState(() {
                                  selectedService = newValue;
                                });
                              },
                              hint: const Text('Select a service'),
                            ),
                          ),
                          const SizedBox(width: 16),
                          ElevatedButton(
                            onPressed: () {
                              if (selectedService != null) {
                                onOpenService(selectedService);
                                debugPrint(
                                    'Selected Service: $selectedService');
                              } else {
                                debugPrint('Please select a service.');
                              }
                            },
                            child: const Text('Open'),
                          ),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 16),
                  ElevatedButton(
                    onPressed: pay,
                    child: const Text('Pay'),
                  ),
                ],
              ),
            ),
          ),
        ));
  }
}

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

1 回复

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


payme_miniapp_flutter 是一个用于在 Flutter 应用中集成 PayMe 支付功能的插件。以下是使用该插件的基本步骤:

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 payme_miniapp_flutter 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  payme_miniapp_flutter: ^1.0.0  # 请使用最新版本

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

2. 初始化插件

在应用的入口处(例如 main.dart 文件中),初始化 payme_miniapp_flutter 插件:

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

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await PayMeMiniAppFlutter.initialize(
    apiKey: 'YOUR_API_KEY',  // 替换为你的 PayMe API Key
    environment: PayMeEnvironment.sandbox,  // 或者 PayMeEnvironment.production
  );
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'PayMe Example',
      home: PaymentScreen(),
    );
  }
}

3. 发起支付请求

在需要发起支付的地方,调用 PayMeMiniAppFlutter.pay 方法:

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

class PaymentScreen extends StatelessWidget {
  Future<void> _makePayment() async {
    try {
      final paymentResponse = await PayMeMiniAppFlutter.pay(
        amount: 1000,  // 支付金额
        currency: 'USD',  // 货币类型
        orderId: 'ORDER12345',  // 订单ID
        description: 'Sample Payment',  // 订单描述
      );

      if (paymentResponse.success) {
        // 支付成功
        print('Payment Successful: ${paymentResponse.transactionId}');
      } else {
        // 支付失败
        print('Payment Failed: ${paymentResponse.errorMessage}');
      }
    } catch (e) {
      // 处理异常
      print('Error: $e');
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Pay with PayMe'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _makePayment,
          child: Text('Pay Now'),
        ),
      ),
    );
  }
}
回到顶部