Flutter插件aggrepay_flutter的使用详解
Flutter插件 aggrepay_flutter是围绕原生 Android 和 iOS SDK 构建的包装器。它可以帮助开发者在 Flutter 应用中集成 Aggrepay 支付服务。
目录
Getting Started
此 Flutter 插件是基于原生 Android 和 iOS SDK 的封装。要了解有关 Aggrepay Flutter SDK 支付流程和步骤的更多信息,请阅读官方文档。
Prerequisites
在开始之前,请熟悉 Aggrepay 的支付流程。注册 Aggrepay 网站账户并联系 Aggrepay 团队以获取 API 密钥和盐值密钥。
Installation
在项目的 pubspec.yaml
文件中添加以下依赖项:
dependencies:
aggrepay_flutter: ^0.0.2+1
然后运行 flutter pub get
来安装插件。
Requirements
1. 添加主题兼容性
Agreggpay SDK 要求在 AndroidManifest.xml
文件中添加主题兼容性:
<application
android:theme="@style/Theme.AppCompat.Light">
</application>
2. 在 build.gradle
文件中添加依赖项
打开项目中的 build.gradle
文件(路径:Android/app/src/build.gradle
),并添加以下依赖项:
dependencies {
implementation 'androidx.appcompat:appcompat:1.3.1'
}
Usage
1. 导入插件
在代码中导入插件:
import 'package:aggrepay_flutter/aggrpay_flutter.dart';
2. 创建支付哈希
创建一个方法用于生成支付哈希。首先定义一个 Map<String, dynamic>
类型的变量来存储支付参数,然后创建一个包含所有键名的字符串列表,并对其进行排序。接着遍历该列表,将非空值拼接到哈希数据中。最后使用 SHA512 算法生成哈希值。
示例代码如下:
void createHash(String amount, String order) {
var params = {
'api_key': api_key,
'hash': hash,
'order_id': orderController.text,
'mode': mode,
'description': description,
'currency': currency,
'amount': amountController.text,
'name': name,
'email': email,
'phone': phone,
'city': city,
'state': state,
'country': country,
'zip_code': zip_code,
'address_line_1': address_line_1,
'return_url': return_url
};
List<String> _hashList = [
"address_line_1",
"amount",
"api_key",
"city",
"country",
"currency",
"description",
"email",
"mode",
"name",
"zip_code",
"order_id",
"phone",
"return_url",
"state",
];
_hashList.sort();
var hashData = 'your salt key';
for (int i = 0; i < _hashList.length; i++) {
if (params.keys.contains(_hashList[i])) {
if (params[_hashList[i]].toString().isNotEmpty) {
hashData += '|' + params[_hashList[i]]!.trim().toString();
}
}
}
var hashed = sha512.convert(utf8.encode(hashData.toString()));
setState(() {
hash = hashed.toString().toUpperCase();
});
}
3. 调用 Aggrepay SDK
创建一个异步方法,通过 Aggrepay SDK 发起支付请求。使用 AggrepayFlutter.pay()
方法传递支付参数,并处理返回的支付响应。
示例代码如下:
void open(Map<String, dynamic> params) async {
try {
final response = await AggrepayFlutter.pay(params);
log("Response :" + response.toString());
PaymentResponse data = PaymentResponse.fromJson(response);
if (data.status.toString().contains('success')) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (_) => PaymentSuccess(paymentResponse: data),
),
);
} else {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Transaction failed!'),
backgroundColor: Colors.black,
),
);
}
} on PlatformException catch (exception) {
log(exception.message.toString());
}
}
完整示例代码
以下是完整的示例代码,展示了如何在 Flutter 应用中使用 aggrepay_flutter
插件:
// ignore_for_file: non_constant_identifier_names
import 'dart:convert';
import 'dart:developer';
import 'package:aggrepay_flutter/aggrepay_flutter.dart';
import 'package:aggrepay_flutter_example/payment_response.dart';
import 'package:aggrepay_flutter_example/payment_success.dart';
import 'package:crypto/crypto.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: const MaterialColor(
0xff209366,
<int, Color>{
50: Color(0xff209366),
100: Color(0xff209366),
200: Color(0xff209366),
300: Color(0xff209366),
400: Color(0xff209366),
500: Color(0xff209366),
600: Color(0xff209366),
700: Color(0xff209366),
800: Color(0xff209366),
900: Color(0xff209366),
},
),
),
home: _AppState(),
);
}
}
class _AppState extends StatefulWidget {
[@override](/user/override)
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<_AppState> {
TextEditingController amountController = TextEditingController();
TextEditingController orderController = TextEditingController();
String paymentResponse = "";
String api_key = 'your api key';
String hash = '';
String order_id = '23';
String mode = 'TEST';
String description = 'test';
String currency = 'INR';
String amount = '28';
String name = 'Username';
String email = 'user@gmail.com';
String phone = '8123456789';
String city = 'usercity';
String state = 'user state';
String country = 'IND';
String zip_code = 'user pin code';
String address_line_1 = 'user address';
String address_line_2 = '';
String udf1 = '';
String udf2 = '';
String udf3 = '';
String udf4 = '';
String udf5 = '';
String return_url = 'return url';
[@override](/user/override)
void initState() {
super.initState();
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
title: const Text('Aggrepay Flutter'),
),
body: Padding(
padding: const EdgeInsets.all(15),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
TextField(
controller: amountController,
keyboardType: TextInputType.number,
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(r'[0-9]'))
],
decoration: InputDecoration(
hintText: 'Amount',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
),
const SizedBox(height: 20),
TextField(
controller: orderController,
decoration: InputDecoration(
hintText: 'Order Id',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
),
const SizedBox(
height: 30,
),
ElevatedButton(
onPressed: () {
setState(() {
order_id = orderController.text;
amount = amountController.text;
});
createHash(amountController.text, orderController.text);
Map<String, String> params = {
'api_key': api_key,
'hash': hash,
'order_id': order_id,
'mode': mode.toUpperCase(),
'description': description,
'currency': currency,
'amount': amount,
'name': name,
'email': email,
'phone': phone,
'city': city,
'state': state,
'country': country,
'zip_code': zip_code,
'address_line_1': address_line_1,
'return_url': return_url
};
open(params);
},
child: Text('Pay Now'.toUpperCase()),
style: ButtonStyle(
minimumSize: MaterialStateProperty.all(
Size(MediaQuery.of(context).size.width, 55),
),
elevation: MaterialStateProperty.all(5),
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
),
),
),
],
),
),
);
}
void open(Map<String, dynamic> params) async {
try {
final response = await AggrepayFlutter.pay(params);
log("Response :" + response.toString());
PaymentResponse data = PaymentResponse.fromJson(response);
if (data.status.toString().contains('success')) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (_) => PaymentSuccess(paymentResponse: data),
),
);
} else {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Transaction failed!'),
backgroundColor: Colors.black,
),
);
}
} on PlatformException catch (exception) {
log(exception.message.toString());
}
}
void createHash(String amount, String order) {
var params = {
'api_key': api_key,
'hash': hash,
'order_id': orderController.text,
'mode': mode,
'description': description,
'currency': currency,
'amount': amountController.text,
'name': name,
'email': email,
'phone': phone,
'city': city,
'state': state,
'country': country,
'zip_code': zip_code,
'address_line_1': address_line_1,
'return_url': return_url
};
List<String> _hashList = [
"address_line_1",
"amount",
"api_key",
"city",
"country",
"currency",
"description",
"email",
"mode",
"name",
"zip_code",
"order_id",
"phone",
"return_url",
"state",
];
_hashList.sort();
var hashData = 'your salt key';
for (int i = 0; i < _hashList.length; i++) {
if (params.keys.contains(_hashList[i])) {
if (params[_hashList[i]].toString().isNotEmpty) {
hashData += '|' + params[_hashList[i]]!.trim().toString();
}
}
}
var hashed = sha512.convert(utf8.encode(hashData.toString()));
setState(() {
hash = hashed.toString().toUpperCase();
});
}
}
更多关于Flutter插件aggrepay_flutter的使用详解的实战教程也可以访问 https://www.itying.com/category-92-b0.html