Flutter支付集成插件paytmpayments_allinonesdk的使用

Flutter支付集成插件paytmpayments_allinonesdk的使用

使用此插件作为库

1. 添加依赖

在你的项目 pubspec.yaml 文件中添加以下依赖:

dependencies:
  paytmpayments_allinonesdk: ^1.0.0

2. 安装依赖

你可以通过命令行安装依赖包:

使用 Flutter 命令:

$ flutter pub get

或者,你的编辑器可能支持自动获取依赖包。查阅你的编辑器文档以了解更多信息。

3. 导入插件

在你的 Dart 代码中导入插件:

import 'package:paytmpayments_allinonesdk/paytmpayments_allinonesdk.dart';

4. 调用交易方法

示例代码如下:

try {
  var response = PaytmpaymentsAllinonesdk.startTransaction(
      mid, orderId, amount, txnToken, callbackUrl, isStaging, restrictAppInvoke);
  response.then((value) {
    print(value);
    setState(() {
      result = value.toString();
    });
  }).catchError((onError) {
    if (onError is PlatformException) {
      setState(() {
        result = onError.message + " \n  " + onError.details.toString();
      });
    } else {
      setState(() {
        result = onError.toString();
      });
    }
  });
} catch (err) {
  result = err.message;
}

示例代码

以下是完整的示例代码:

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter/services.dart';
import 'package:paytmpayments_allinonesdk/paytmpayments_allinonesdk.dart';
import 'network/initiate_transaction_helper.dart';
import 'edit_text.dart';
import 'dart:math';

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(brightness: Brightness.dark),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Flutter App'),
        ),
        body: const HomeScreen(),
      ),
    );
  }
}

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

  [@override](/user/override)
  State<StatefulWidget> createState() {
    return _HomeScreenState();
  }
}

class _HomeScreenState extends State<HomeScreen> {
  String mid = "", orderId = "", amount = "1", txnToken = "";
  String result = "";
  bool isStaging = false;
  bool isApiCallInprogress = false;
  String callbackUrl = "";
  bool restrictAppInvoke = false;
  bool enableAssist = true;

  [@override](/user/override)
  void initState() {
    super.initState();
    orderId = generateOrderId();
  }

  String generateOrderId() {
    final randomNum = Random().nextDouble() * DateTime.now().millisecondsSinceEpoch;
    return 'PARCEL${1 + (randomNum % 2000).floor()}A${(randomNum % 100000).floor() + 10000}';
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Card(
      child: SingleChildScrollView(
        child: Container(
          margin: const EdgeInsets.all(8),
          child: Column(
            children: <Widget>[
              EditText('商户ID', mid, onChange: (val) => mid = val),
              EditText('订单ID', orderId, onChange: (val) => orderId = val),
              EditText('金额', amount, onChange: (val) => amount = val),
              EditText('交易令牌', txnToken, onChange: (val) => txnToken = val),
              EditText('回调URL', callbackUrl, onChange: (val) => callbackUrl = val),
              Container(
                margin: const EdgeInsets.all(16),
                child: ElevatedButton(
                  onPressed: _generateTxnToken,
                  child: const Text('生成交易令牌'),
                ),
              ),
              Row(
                children: <Widget>[
                  Checkbox(
                    activeColor: Colors.lightBlue,
                    value: isStaging,
                    onChanged: (bool? val) {
                      setState(() {
                        isStaging = val!;
                      });
                    },
                  ),
                  const Text("测试环境")
                ],
              ),
              Row(
                children: <Widget>[
                  Checkbox(
                    activeColor: Colors.lightBlue,
                    value: restrictAppInvoke,
                    onChanged: (bool? val) {
                      setState(() {
                        restrictAppInvoke = val!;
                      });
                    },
                  ),
                  const Text("限制应用调用")
                ],
              ),
              Container(
                margin: const EdgeInsets.all(16),
                child: ElevatedButton(
                  onPressed: isApiCallInprogress
                      ? null
                      : () {
                          _startTransaction();
                        },
                  child: const Text('开始交易'),
                ),
              ),
              Container(
                alignment: Alignment.bottomLeft,
                child: const Text("消息 :"),
              ),
              Text(result),
            ],
          ),
        ),
      ),
    );
  }

  Future<void> _generateTxnToken() async {
    setState(() {
      result = '';
      txnToken = '';
    });

    if (mid.isEmpty) {
      setState(() {
        result = '商户ID字段为空';
      });
      return;
    }

    if (orderId.isEmpty) {
      setState(() {
        result = '订单ID字段为空';
      });
      return;
    }

    try {
      var initTransactionResponse =
          await InitiateTransactionHelper(mid, amount, orderId, isStaging)
              .makeInitTransactionRequest();
      if (initTransactionResponse.body?.txnToken != null &&
          initTransactionResponse.body?.txnToken?.isNotEmpty == true) {
        setState(() {
          txnToken = initTransactionResponse.body!.txnToken!;
        });
        return;
      } else {
        setState(() {
          result = initTransactionResponse.body?.resultInfo?.resultMsg ??
              '交易API失败';
        });
        return;
      }
    } catch (err) {
      setState(() {
        result = err.toString();
      });
      return;
    }
  }

  Future<void> _startTransaction() async {
    setState(() {
      result = '';
    });

    if (txnToken.isEmpty) {
      setState(() {
        result = '交易令牌字段为空';
      });
      return;
    }

    if (mid.isEmpty) {
      setState(() {
        result = '商户ID字段为空';
      });
      return;
    }

    if (orderId.isEmpty) {
      setState(() {
        result = '订单ID字段为空';
      });
      return;
    }

    try {
      var response = PaytmpaymentsAllinonesdk().startTransaction(
          mid,
          orderId,
          amount,
          txnToken,
          callbackUrl,
          isStaging,
          restrictAppInvoke,
          enableAssist);
      response.then((value) {
        setState(() {
          result = value.toString();
        });
      }).catchError((onError) {
        if (onError is PlatformException) {
          setState(() {
            result = "${onError.message} \n  ${onError.details}";
          });
        } else {
          setState(() {
            result = onError.toString();
          });
        }
      });
    } catch (err) {
      setState(() {
        result = err.toString();
      });
    }
  }
}

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

1 回复

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


当然,下面是一个关于如何在Flutter项目中集成并使用paytm_allinonesdk插件进行支付的代码示例。paytmpayments_allinonesdk是Paytm提供的用于集成其支付网关的Flutter插件。请注意,这里假设您已经有一个Flutter项目,并且已经配置好了基本的开发环境。

1. 添加依赖

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

dependencies:
  flutter:
    sdk: flutter
  paytm_allinonesdk: ^latest_version # 请替换为最新版本号

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

2. 配置Android

android/app/src/main/AndroidManifest.xml中添加必要的权限和配置:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

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

    <application
        ... >
        
        <!-- Paytm SDK配置 -->
        <meta-data
            android:name="com.paytm.sdk.CHECKSERVER_URL"
            android:value="https://pgt.paytmserver.com/oltp-web/checkServerStatus" />
        <activity
            android:name="io.paytm.paytmonsdk.PaytmPGActivity"
            android:configChanges="orientation|keyboardHidden|screenSize"
            android:launchMode="singleTop"
            android:screenOrientation="portrait"
            android:theme="@style/AppTheme"
            android:windowSoftInputMode="adjustResize">
        </activity>
    </application>
</manifest>

3. 配置iOS(可选)

如果您也需要在iOS上集成,您可能需要在Info.plist中添加一些配置,但通常Paytm SDK的iOS集成比较复杂,这里只展示Android部分。iOS集成请参考官方文档。

4. 初始化Paytm SDK并发起支付

在您的Flutter代码中,您需要初始化Paytm SDK并发起支付请求。以下是一个示例:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Paytm Payment Integration'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () async {
              // 替换为您的MID, MERCHANT_KEY, ORDER_ID, CHANNEL_ID, INDUSTRY_TYPE, WEBSITE
              String mid = "YOUR_MID";
              String merchantKey = "YOUR_MERCHANT_KEY";
              String orderId = "YOUR_ORDER_ID";
              String channelId = "WAP"; // 或者其他适用的渠道ID
              String industryType = "Retail"; // 或者其他适用的行业类型
              String website = "YOUR_WEBSITE";

              // 创建请求参数
              Map<String, String> requestParams = {
                "MID": mid,
                "CHANNEL_ID": channelId,
                "INDUSTRY_TYPE": industryType,
                "WEBSITE": website,
                "ORDER_ID": orderId,
                "CUST_ID": "CUST_001", // 自定义客户ID
                "MOBILE_NO": "1234567890", // 手机号
                "EMAIL": "user@example.com", // 邮箱
                "TXN_AMOUNT": "100.00", // 交易金额
                "CHECKSUMHASH": await generateChecksum(merchantKey, requestParams), // 需要生成的校验哈希
              };

              // 发起支付请求
              PaytmResponse response = await PaytmAllinOneSdk.startPayment(
                requestParams: requestParams,
                inSandboxEnvironment: true, // 如果是测试环境,设置为true
                callback: (PaytmResponse res) {
                  // 支付结果回调
                  print("Payment Response: ${res.toMap()}");
                },
              );

              // 处理支付响应
              if (response != null) {
                print("Payment Status: ${response.responseCode}, Message: ${response.responseMessage}");
              }
            },
            child: Text('发起支付'),
          ),
        ),
      ),
    );
  }

  // 生成校验哈希的方法(注意:这是一个示例,实际实现可能需要更多的逻辑)
  Future<String> generateChecksum(String merchantKey, Map<String, String> params) async {
    // 这里需要实现生成校验哈希的逻辑,通常涉及到排序参数、拼接字符串、加密等步骤
    // 由于这涉及到Paytm的安全机制,具体实现请参考Paytm官方文档
    // 这里仅返回一个示例值
    return "EXAMPLE_CHECKSUM";
  }
}

注意事项

  1. 校验哈希生成:生成校验哈希是支付安全的关键步骤,您必须按照Paytm提供的算法来生成。上面的generateChecksum方法只是一个占位符,您需要实现具体的生成逻辑。
  2. 测试环境:在startPayment方法中,inSandboxEnvironment参数用于指定是否使用测试环境。在生产环境中,请确保将其设置为false
  3. 错误处理:在实际应用中,您应该添加更多的错误处理和用户反馈机制。

以上代码提供了一个基本的框架,您可能需要根据具体需求进行调整和扩展。有关更多详细信息,请参考Paytm官方文档

回到顶部