Flutter支付集成插件my_fatoorah的使用
Flutter支付集成插件my_fatoorah的使用
My Fatoorah Payment
My Fatoorah是Flutter的一个支付集成插件,它可以帮助开发者轻松地将支付功能集成到他们的应用程序中。下面我们将详细介绍如何安装、配置和使用这个插件。
Screenshots in Test mode
Payment methods | Card inputs | Acs Emulator | result |
---|---|---|---|
Screenshots in Live(Release) mode
Payment methods | Card inputs | result |
---|---|---|
Getting Started
Installation
首先,在pubspec.yaml
文件中添加以下依赖:
dependencies:
my_fatoorah: any
然后运行flutter pub get
以安装插件。
Config
iOS
对于iOS平台,需要在Info.plist
文件中添加以下内容:
<key>io.flutter.embedded_views_preview</key>
<true/>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
如果URL不是使用SSL,则还需要允许任意加载:
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
Android
对于Android平台,在AndroidManifest.xml
文件中添加以下内容:
<application
...
android:usesCleartextTraffic="true"
...>
...
</application>
Dialog Usage
以下是一个简单的示例代码,演示了如何使用startPayment
方法启动支付流程:
import 'package:my_fatoorah/my_fatoorah.dart';
import 'dart:developer';
class Example extends StatelessWidget {
const Example({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('my_fatoorah Demo'),
),
body: Center(
child: Container(
padding: const EdgeInsets.all(8.0),
child: MaterialButton(
color: Colors.blue,
onPressed: () async {
var response = await MyFatoorah.startPayment(
context: context,
request: MyfatoorahRequest.test(
currencyIso: Country.SaudiArabia,
successUrl: "Your success call back",
errorUrl: "Your error call back",
invoiceAmount: 100,
language: ApiLanguage.Arabic,
token: "Your token here",
),
);
log(response.paymentId.toString());
},
splashColor: Colors.blueGrey,
child: const Text(
'Show Payment',
style: TextStyle(
color: Colors.white,
fontSize: 16,
),
),
),
),
),
);
}
}
Another usage way => Listview Usage
除了对话框方式外,还可以通过ListView
来使用:
MyFatoorah(
onResult: (response) {
print(response.status);
},
request: MyfatoorahRequest.test(
currencyIso: Country.SaudiArabia,
successUrl: 'https://www.facebook.com',
errorUrl: 'https://www.google.com',
invoiceAmount: widget.cartDetails.total,
language: ApiLanguage.Arabic,
token: "Your token here",
),
)
Tutorial
你可以参考Abdo tareq提供的视频教程:点击观看
Notes
- 在版本2.6.7之前,如果你传递null作为token,我们会处理测试版本。
- 自从我的fatoorah改变了他们的演示信息多次后,你需要在
MyfatoorahRequest
中传递测试版本的URLhttps://apitest.myfatoorah.com
和测试版本的token。 - 你可以在这里找到演示信息:My Fatoorah Demo Information
- 在版本3.0.2之后,你可以使用
MyfatoorahRequest.test
或MyfatoorahRequest.live
- 在重定向到成功URL后,你会得到一个paymentId,这将帮助你的后端跟踪与my fatoorah的支付状态
以上就是关于Flutter支付集成插件my_fatoorah的基本使用介绍,希望对您有所帮助!
更多关于Flutter支付集成插件my_fatoorah的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter支付集成插件my_fatoorah的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,以下是一个关于如何在Flutter应用中集成并使用my_fatoorah
支付插件的示例代码。假设你已经创建了一个Flutter项目,并且已经添加了my_fatoorah
依赖到你的pubspec.yaml
文件中。
首先,确保你的pubspec.yaml
文件中包含以下依赖项:
dependencies:
flutter:
sdk: flutter
my_fatoorah: ^latest_version # 请替换为实际的最新版本号
然后,运行flutter pub get
来安装依赖。
接下来,按照以下步骤配置和使用my_fatoorah
插件:
- 初始化MyFatoorah服务:
在你的Flutter项目的入口文件(通常是main.dart
)中,初始化MyFatoorah服务。你需要提供你的API密钥和其他必要的配置。
import 'package:flutter/material.dart';
import 'package:my_fatoorah/my_fatoorah.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
// 初始化MyFatoorah服务
MyFatoorah.initialize(
apiKey: 'YOUR_API_KEY', // 替换为你的API密钥
merchantId: 'YOUR_MERCHANT_ID', // 替换为你的商户ID
sandboxMode: true, // 根据需要设置为true(沙箱模式)或false(生产环境)
);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter MyFatoorah Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
- 创建支付请求:
在你的主页面或其他页面中,创建一个按钮来触发支付请求。
import 'package:flutter/material.dart';
import 'package:my_fatoorah/my_fatoorah.dart';
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter MyFatoorah Demo'),
),
body: Center(
child: ElevatedButton(
onPressed: () async {
// 创建支付请求
try {
final paymentRequest = PaymentRequest(
amount: 100.0, // 支付金额
currency: 'SAR', // 货币代码
description: 'Test Payment', // 支付描述
returnUrl: 'https://yourwebsite.com/return', // 支付成功后的返回URL
notifyUrl: 'https://yourwebsite.com/notify', // 支付通知URL
customer: Customer(
email: 'customer@example.com', // 顾客邮箱
phone: '1234567890', // 顾客电话
),
);
final paymentResponse = await MyFatoorah.startPayment(paymentRequest);
print('Payment Response: ${paymentResponse.toJson()}');
} catch (e) {
print('Error: $e');
}
},
child: Text('Start Payment'),
),
),
);
}
}
class PaymentRequest {
final double amount;
final String currency;
final String description;
final String returnUrl;
final String notifyUrl;
final Customer customer;
PaymentRequest({
required this.amount,
required this.currency,
required this.description,
required this.returnUrl,
required this.notifyUrl,
required this.customer,
});
}
class Customer {
final String email;
final String phone;
Customer({
required this.email,
required this.phone,
});
}
注意:PaymentRequest
和Customer
类在这里只是为了演示目的而创建的简单数据模型。实际使用时,你应该根据my_fatoorah
插件的文档使用正确的数据模型。
- 处理支付响应:
在上面的代码中,MyFatoorah.startPayment(paymentRequest)
方法将启动支付流程,并返回一个paymentResponse
对象。你可以根据这个响应对象来处理支付结果。
请注意,上述代码仅用于演示目的,并可能需要根据my_fatoorah
插件的实际API进行调整。务必参考my_fatoorah
插件的官方文档以获取最新的API信息和配置要求。