Flutter谷歌支付集成插件tap_google_pay_kit_flutter的使用
Flutter谷歌支付集成插件tap_google_pay_kit_flutter的使用
TapGooglePayKit-Flutter
A standalone Flutter kit for handling Google Pay™ (仅适用于Android)
开始使用
1. 安装
在 pubspec.yaml 文件中添加以下依赖项:
dependencies:
tap_google_pay_kit_flutter: ^0.0.4
运行 flutter pub get 来安装插件。
2. 额外的Android配置
要使用Google Pay功能,您需要进行一些额外的配置:
-
在
build.gradle文件中添加以下依赖:implementation "com.google.android.gms:play-services-wallet:18.1.3" -
确保您的
minSdkVersion是 21 或更高版本:minSdkVersion 21 targetSdkVersion 32 -
在
AndroidManifest.xml文件中,确保在<application>标签内添加以下元数据:<meta-data android:name="com.google.android.gms.wallet.api.enabled" android:value="true" />
配置您的应用
在使用 TapGooglePayKit 之前,需要进行初始化配置。请确保这些代码在任何使用 TapGooglePayKit 的地方之前被调用。
/**
* 配置SDK。
*/
TapGooglePayKitFlutter.configureSDK(
secretKey: "sk_test_xxxxxxxxxxxxxxxxxx", // 您的密钥
bundleId: "com.xxx.xxxxxxx", // 您的应用包名
countryCode: "US", // 国家代码
transactionCurrency: "USD", // 交易货币
sdkMode: SDKMode.Sandbox, // 测试模式
allowedMethods: AllowedMethods.ALL, // 允许的方法
allowedCardNetworks: [AllowedCardNetworks.VISA.name], // 允许的卡网络
gatewayID: "xxxxx", // 网关ID
gatewayMerchantID: "122xxxxx", // 商户ID
amount: "23", // 交易金额
);
SDK 枚举
以下是SDK中的一些常用枚举值:
SDK 模式
sdkMode: SDKMode.Sandbox
- Sandbox(测试模式)
- Production(生产模式)
允许的方法
allowedMethods: AllowedMethods.ALL
- PAN_ONLY
- CRYPTOGRAM
- ALL
允许的卡网络
allowedCardNetworks: [AllowedCardNetworks.VISA.name]
- AMEX
- MASTERCARD
- VISA
Google Pay按钮类型
googlePayButtonType: GooglePayButtonType.NORMAL_GOOGLE_PAY
- BUY_WITH_GOOGLE_PAY
- DONATE_WITH_GOOGLE_PAY
- NORMAL_GOOGLE_PAY
- PAY_WITH_GOOGLE_PAY
- SUBSCRIBE_WITH_GOOGLE_PAY
- CHECKOUT_WITH_GOOGLE_PAY
- ORDER_WITH_GOOGLE_PAY
- BOOK_WITH_GOOGLE_PAY
Google Pay按钮
TapGooglePayKitFlutter.googlePayButton(
googlePayButtonType: GooglePayButtonType.NORMAL_GOOGLE_PAY,
onTap: () {
// 调用SDK方法
},
)
SDK 方法
获取Google Pay令牌
var tapGooglePaySDKResult = await TapGooglePayKitFlutter.getGooglePayToken;
获取Tap令牌
var tapTokenSDKResult = await TapGooglePayKitFlutter.getTapToken;
完整示例
以下是一个完整的示例代码:
import 'dart:async';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:tap_google_pay_kit_flutter/models/model.dart';
import 'package:tap_google_pay_kit_flutter/tap_google_pay_kit_flutter.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
[@override](/user/override)
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
var mSDKResponse;
// 配置应用以使用TapGooglePayKitFlutter
Future<void> configureApp() async {
TapGooglePayKitFlutter.configureSDK(
secretKey: "sk_test_xxxxxxxxxxxxxxxxxx",
bundleId: "com.xxx.xxxxxxx",
countryCode: "US",
transactionCurrency: "USD",
sdkMode: SDKMode.Sandbox,
allowedMethods: AllowedMethods.ALL,
allowedCardNetworks: [AllowedCardNetworks.VISA.name],
gatewayID: "xxxxx",
gatewayMerchantID: "122xxxxx",
amount: "23",
);
}
// 启动SDK并调用TapGooglePayKitFlutter的方法
Future<void> startSDK() async {
try {
configureApp();
var tapGooglePaySDKResult =
await TapGooglePayKitFlutter.getGooglePayToken;
setState(() {
mSDKResponse = tapGooglePaySDKResult;
});
} catch (ex) {
if (kDebugMode) {
print("Exception >>>> ${ex.toString()}");
}
}
}
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Google Pay 示例'),
),
body: Center(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
mSDKResponse == null
? "等待用户操作..."
: "SDK 响应: ${mSDKResponse.toString()}",
),
),
),
bottomSheet: TapGooglePayKitFlutter.googlePayButton(
googlePayButtonType: GooglePayButtonType.NORMAL_GOOGLE_PAY,
onTap: () {
startSDK();
},
),
),
);
}
}
更多关于Flutter谷歌支付集成插件tap_google_pay_kit_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter谷歌支付集成插件tap_google_pay_kit_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
tap_google_pay_kit_flutter 是一个用于在 Flutter 应用中集成 Google Pay 功能的插件。以下是如何使用该插件的详细步骤:
1. 添加依赖
首先,你需要在 pubspec.yaml 文件中添加 tap_google_pay_kit_flutter 插件的依赖。
dependencies:
flutter:
sdk: flutter
tap_google_pay_kit_flutter: ^1.0.0 # 请使用最新版本
然后运行 flutter pub get 来安装依赖。
2. 配置 Android 项目
在 android/app/build.gradle 文件中,确保 minSdkVersion 至少为 21。
android {
defaultConfig {
minSdkVersion 21
...
}
...
}
3. 初始化 Google Pay
在你的 Flutter 项目中,首先需要初始化 Google Pay。
import 'package:tap_google_pay_kit_flutter/tap_google_pay_kit_flutter.dart';
void initializeGooglePay() async {
bool isGooglePayAvailable = await TapGooglePayKitFlutter.isGooglePayAvailable();
if (isGooglePayAvailable) {
// Google Pay 可用,继续初始化
await TapGooglePayKitFlutter.initialize(
environment: GooglePayEnvironment.Test, // 或 GooglePayEnvironment.Production
merchantName: 'Your Merchant Name',
countryCode: 'US', // 你的国家代码
currencyCode: 'USD', // 你的货币代码
);
} else {
// Google Pay 不可用,显示错误或备用支付方式
print('Google Pay is not available on this device.');
}
}
4. 创建支付请求
接下来,创建一个支付请求并启动 Google Pay 支付流程。
void makePayment() async {
final paymentRequest = GooglePaymentRequest(
totalPrice: '10.00', // 总金额
transactionId: 'txn_123456', // 交易ID
paymentMethodTokenizationParameters: PaymentMethodTokenizationParameters(
tokenizationType: 'PAYMENT_GATEWAY',
parameters: {
'gateway': 'your_gateway', // 你的支付网关
'gatewayMerchantId': 'your_merchant_id', // 你的商户ID
},
),
);
try {
final paymentResult = await TapGooglePayKitFlutter.requestPayment(paymentRequest);
if (paymentResult.status == GooglePayStatus.Success) {
// 支付成功
print('Payment successful: ${paymentResult.paymentMethodToken}');
} else {
// 支付失败或取消
print('Payment failed or cancelled: ${paymentResult.status}');
}
} catch (e) {
// 处理异常
print('Error during payment: $e');
}
}
5. 处理支付结果
在 makePayment 方法中,你可以根据 paymentResult.status 来处理支付结果。如果支付成功,你可以获取到 paymentMethodToken,然后将其发送到你的服务器进行进一步处理。
6. 测试和调试
在测试环境中,确保你使用的是 GooglePayEnvironment.Test。在发布应用之前,切换到 GooglePayEnvironment.Production。
7. 发布应用
在发布应用之前,确保你已经完成了所有必要的配置,并且已经测试了 Google Pay 功能。
8. 处理错误和异常
在实际应用中,可能会遇到各种错误和异常。确保你的应用能够妥善处理这些情况,并提供适当的用户反馈。
9. 参考文档
如果你在使用过程中遇到问题,可以参考插件的官方文档或 GitHub 仓库,获取更多信息和示例代码。
10. 示例代码
以下是一个完整的示例代码,展示了如何初始化 Google Pay 和发起支付请求:
import 'package:flutter/material.dart';
import 'package:tap_google_pay_kit_flutter/tap_google_pay_kit_flutter.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Google Pay Example'),
),
body: Center(
child: ElevatedButton(
onPressed: () async {
await initializeGooglePay();
makePayment();
},
child: Text('Pay with Google Pay'),
),
),
),
);
}
}
void initializeGooglePay() async {
bool isGooglePayAvailable = await TapGooglePayKitFlutter.isGooglePayAvailable();
if (isGooglePayAvailable) {
await TapGooglePayKitFlutter.initialize(
environment: GooglePayEnvironment.Test,
merchantName: 'Your Merchant Name',
countryCode: 'US',
currencyCode: 'USD',
);
} else {
print('Google Pay is not available on this device.');
}
}
void makePayment() async {
final paymentRequest = GooglePaymentRequest(
totalPrice: '10.00',
transactionId: 'txn_123456',
paymentMethodTokenizationParameters: PaymentMethodTokenizationParameters(
tokenizationType: 'PAYMENT_GATEWAY',
parameters: {
'gateway': 'your_gateway',
'gatewayMerchantId': 'your_merchant_id',
},
),
);
try {
final paymentResult = await TapGooglePayKitFlutter.requestPayment(paymentRequest);
if (paymentResult.status == GooglePayStatus.Success) {
print('Payment successful: ${paymentResult.paymentMethodToken}');
} else {
print('Payment failed or cancelled: ${paymentResult.status}');
}
} catch (e) {
print('Error during payment: $e');
}
}

