Flutter支付集成插件flutter_paypal的使用

Flutter支付集成插件flutter_paypal的使用

功能特性

它利用了 Flutter Webview 来完成支付过程。“这是一个简单的咒语,但非常难以破解”。

使用方法

在将插件添加到您的 pubspec.yaml 文件后,请确保导入该包:

import 'package:flutter_paypal/flutter_paypal.dart';

您可以在 /example 文件夹中查看一个简单的示例。

完整示例代码

以下是一个完整的示例代码,展示了如何使用 flutter_paypal 插件进行支付集成:

import 'package:flutter/material.dart';
import 'package:flutter_paypal/flutter_paypal.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(
      title: 'Flutter Paypal',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Paypal 示例'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
          child: TextButton(
              onPressed: () => {
                    Navigator.of(context).push(
                      MaterialPageRoute(
                        builder: (BuildContext context) => UsePaypal(
                            sandboxMode: true, // 设置为true以使用沙盒模式
                            clientId: // 您的客户端ID
                                "AW1TdvpSGbIM5iP4HJNI5TyTmwpY9Gv9dYw8_8yW5lYIbCqf326vrkrp0ce9TAqjEGMHiV3OqJM_aRT0",
                            secretKey: // 您的密钥
                                "EHHtTDjnmTZATYBPiGzZC_AZUfMpMAzj2VZUeqlFUrRJA_C0pQNCxDccB5qoRQSEdcOnnKQhycuOWdP9",
                            returnURL: "https://samplesite.com/return", // 返回URL
                            cancelURL: "https://samplesite.com/cancel", // 取消URL
                            transactions: const [
                              {
                                "amount": {
                                  "total": '10.12', // 总金额
                                  "currency": "USD", // 货币类型
                                  "details": {
                                    "subtotal": '10.12', // 小计
                                    "shipping": '0', // 运费
                                    "shipping_discount": 0 // 运费折扣
                                  }
                                },
                                "description": // 描述
                                    "The payment transaction description.",
                                // "payment_options": {
                                //   "allowed_payment_method":
                                //       "INSTANT_FUNDING_SOURCE"
                                // },
                                "item_list": {
                                  "items": [
                                    {
                                      "name": "A demo product", // 商品名称
                                      "quantity": 1, // 数量
                                      "price": '10.12', // 价格
                                      "currency": "USD" // 货币类型
                                    }
                                  ],

                                  // 发货地址不是必需的
                                  "shipping_address": {
                                    "recipient_name": "Jane Foster", // 收件人姓名
                                    "line1": "Travis County", // 地址行1
                                    "line2": "", // 地址行2
                                    "city": "Austin", // 城市
                                    "country_code": "US", // 国家代码
                                    "postal_code": "73301", // 邮政编码
                                    "phone": "+00000000", // 电话号码
                                    "state": "Texas" // 州
                                  },
                                }
                              }
                            ],
                            note: "Contact us for any questions on your order.", // 备注
                            onSuccess: (Map params) async {
                              print("onSuccess: $params"); // 成功回调
                            },
                            onError: (error) {
                              print("onError: $error"); // 错误回调
                            },
                            onCancel: (params) {
                              print('cancelled: $params'); // 取消回调
                            }),
                      ),
                    )
                  },
              child: const Text("Make Payment")), // 支付按钮
        ));
  }
}

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

1 回复

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


在Flutter项目中集成flutter_paypal插件以支持PayPal支付,可以遵循以下步骤和代码示例。这个插件允许你通过PayPal处理支付事务。以下是一个简单的集成指南和代码示例。

前提条件

  1. Flutter环境:确保你的Flutter开发环境已经正确设置。
  2. PayPal开发者账户:你需要一个PayPal开发者账户来创建和获取客户端ID。

步骤 1: 添加依赖

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

dependencies:
  flutter:
    sdk: flutter
  flutter_paypal: ^2.0.0  # 确保使用最新版本,版本号根据pub.dev上的最新版本进行调整

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

步骤 2: 配置PayPal客户端ID

在你的android/app/src/main/AndroidManifest.xml文件中添加你的PayPal客户端ID(从PayPal开发者仪表板获取):

<meta-data
    android:name="com.paypal.sdk.clientId"
    android:value="YOUR_PAYPAL_CLIENT_ID_HERE"/>

对于iOS,你需要在Info.plist中添加以下配置(但通常flutter_paypal插件会自动处理大部分iOS配置,除非有特定需求):

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>paypal.sdk.clientID.YOUR_PAYPAL_CLIENT_ID_HERE</string>
        </array>
    </dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>paypal</string>
    <string>paypalsandbox</string>
</array>

步骤 3: 实现支付功能

在你的Flutter代码中,你可以按照以下方式使用flutter_paypal插件:

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('PayPal Payment Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () => _initiatePayPalPayment(),
            child: Text('Pay with PayPal'),
          ),
        ),
      ),
    );
  }

  Future<void> _initiatePayPalPayment() async {
    try {
      var response = await PayPalPayment(
        client: PayPalClient(
          environment: PayPalEnvironment.sandbox, // 使用 'PayPalEnvironment.production' 进行生产环境支付
          clientId: 'YOUR_PAYPAL_CLIENT_ID_HERE',
        ),
        amount: '10.00',
        currencyCode: 'USD',
        description: 'Test payment',
        intent: PayPalPaymentIntent.sale,
      ).start(context);

      if (response?.status == PaymentStatus.completed) {
        // 支付成功,处理支付结果
        print('Payment successful!');
        print('Details: ${response.details}');
      } else if (response?.status == PaymentStatus.canceled) {
        // 支付取消
        print('Payment canceled.');
      } else if (response?.status == PaymentStatus.failed) {
        // 支付失败
        print('Payment failed.');
      }
    } catch (e) {
      // 处理异常
      print('Error: $e');
    }
  }
}

注意事项

  • 环境配置:确保在开发过程中使用PayPalEnvironment.sandbox,而在生产环境中切换到PayPalEnvironment.production
  • 错误处理:在实际应用中,应该添加更详细的错误处理和用户反馈机制。
  • 支付金额和货币:根据实际需求调整支付金额和货币代码。

通过以上步骤,你应该能够在Flutter应用中成功集成PayPal支付功能。

回到顶部