Flutter支付插件payu_checkoutpro_flutter的使用

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

Flutter支付插件payu_checkoutpro_flutter的使用

这是基于PayU的CheckoutPro SDK为Android和iOS构建的Flutter包装器。

完整示例Demo

以下是一个完整的示例，展示如何在Flutter项目中使用payu_checkoutpro_flutter插件来集成支付功能。

  1. 添加依赖

    在你的pubspec.yaml文件中添加payu_checkoutpro_flutter插件：

    dependencies:
  flutter:
    sdk: flutter
  payu_checkoutpro_flutter: ^x.x.x  # 请替换为最新版本号

  2. 导入插件

    在你的Dart文件中导入插件：

    import 'package:payu_checkoutpro_flutter/payu_checkoutpro_flutter.dart';

  3. 初始化插件

    在应用启动时初始化插件。通常可以在main.dart文件中的initState方法中进行初始化：

    [@override](/user/override)
void initState() {
  super.initState();
  PayUCheckoutProFlutter.initialize(); // 初始化插件
}

  4. 配置支付参数

    配置支付所需的参数。这些参数通常由服务器端提供：

    Map<String, dynamic> paymentParams = {
  'key': 'your_merchant_key',  // 商户密钥
  'txnid': 'unique_transaction_id',  // 唯一交易ID
  'amount': '100.00',  // 支付金额
  'productinfo': 'Product Info',  // 商品信息
  'firstname': 'John',  // 用户名
  'email': 'john@example.com',  // 用户邮箱
  'phone': '1234567890',  // 用户电话
  'surl': 'https://yourserver.com/success',  // 成功回调URL
  'furl': 'https://yourserver.com/failure',  // 失败回调URL
  'service_provider': 'payu_paisa',  // 服务提供商
  'hash': 'generated_hash_value'  // 生成的哈希值
};

  5. 启动支付流程

    使用配置好的参数启动支付流程：

    void startPayment() async {
  try {
    final result = await PayUCheckoutProFlutter.startPayment(paymentParams);
    print('Payment Result: $result');  // 打印支付结果
  } catch (e) {
    print('Error: $e');  // 打印错误信息
  }
}

  6. 处理支付结果

    根据支付结果执行相应的操作。例如，成功或失败后的UI更新等：

    void handlePaymentResult(Map<String, dynamic> result) {
  if (result['status'] == 'success') {
    // 支付成功，更新UI或导航到成功页面
    print('Payment Successful');
  } else {
    // 支付失败，显示错误信息
    print('Payment Failed: ${result['message']}');
  }
}

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

Harmonyos Next教程
1 回复

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


当然，以下是如何在Flutter项目中集成和使用payu_checkoutpro_flutter插件的示例代码。这个插件用于集成PayU的Checkout Pro支付解决方案。

步骤 1: 添加依赖

首先，你需要在pubspec.yaml文件中添加payu_checkoutpro_flutter依赖：

dependencies:
  flutter:
    sdk: flutter
  payu_checkoutpro_flutter: ^最新版本号  # 请替换为最新的版本号

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

步骤 2: 配置Android和iOS

Android

在android/app/src/main/AndroidManifest.xml中，你可能需要添加一些必要的权限，例如网络权限：

<uses-permission android:name="android.permission.INTERNET"/>

此外，你可能需要在android/app/build.gradle文件中配置minSdkVersion和targetSdkVersion，确保它们符合PayU SDK的要求。

iOS

对于iOS，确保在Info.plist中配置了必要的网络权限。同时，你可能需要在Xcode项目中进行一些配置，比如添加必要的URL Scheme等，这通常会在PayU的官方文档中详细说明。

步骤 3: 初始化插件并进行支付

在你的Flutter代码中，你可以这样使用payu_checkoutpro_flutter插件：

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter PayU Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final PayUCheckoutProFlutter _payUCheckoutProFlutter = PayUCheckoutProFlutter();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter PayU Demo'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            _initPayU();
          },
          child: Text('Pay with PayU'),
        ),
      ),
    );
  }

  Future<void> _initPayU() async {
    try {
      // 替换为实际的PayU配置信息
      String merchantId = 'your_merchant_id';
      String merchantKey = 'your_merchant_key';
      String merchantSalt = 'your_merchant_salt';
      String paymentHash = 'your_payment_hash';  // 通常是由后端生成的
      String environment = 'PRODUCTION'; // 或者 'SANDBOX'
      String transactionId = 'your_transaction_id';
      String amount = '100.00'; // 支付金额
      String currencyCode = 'USD'; // 货币代码
      String description = 'Payment Description';

      // 发起支付请求
      var result = await _payUCheckoutProFlutter.startPayment(
        merchantId: merchantId,
        merchantKey: merchantKey,
        merchantSalt: merchantSalt,
        paymentHash: paymentHash,
        environment: environment,
        transactionId: transactionId,
        amount: amount,
        currencyCode: currencyCode,
        productDescription: description,
      );

      // 处理支付结果
      if (result.statusCode == 200) {
        // 支付成功
        print('Payment successful: ${result.responseData}');
      } else {
        // 支付失败
        print('Payment failed: ${result.errorMessage}');
      }
    } catch (e) {
      print('Error initiating PayU payment: $e');
    }
  }
}

注意事项

  1. 敏感信息：不要在客户端代码中硬编码敏感信息，如merchantKey和merchantSalt。这些信息应该由你的后端服务生成和管理。
  2. 支付哈希：paymentHash是一个安全机制，用于确保支付请求没有被篡改。它通常由后端服务根据特定的算法和输入参数生成。
  3. 环境配置：确保你在开发过程中使用SANDBOX环境，在生产环境中使用PRODUCTION环境。

这段代码展示了如何在Flutter应用中集成PayU Checkout Pro支付插件，并处理支付请求和响应。在实际应用中，你可能需要根据PayU的文档和API要求调整代码。

回到顶部