Flutter支付处理插件flutter_moyasar的使用

Flutter支付处理插件flutter_moyasar的使用

本库用于通过Moyasar支付网关进行在线支付。

功能支持

支付
  • 卡支持(mada、visa、mastercard)
  • Apple Pay
  • stc pay
支付视图

开始使用

请查看我们的示例项目以更好地理解实现方式。

MoyasarPayment(
    moyasarPaymentData: MoyasarPaymentData(
      appName: "UNICODE",
      secretKey: "sk_key",
      publishableSecretKey: "pk_key",
      purchaseAmount: 75.50,
      locale: PaymentLocale.en,
      paymentEnvironment: PaymentEnvironment.test,
      paymentOptions: [
        PaymentOption.card,
        PaymentOption.applepay,
        PaymentOption.stcpay,
      ],
    ),
    onPaymentSucess: (response) {
        //TODO 处理成功支付响应
      debugPrint("Success ------> ${response.toMap()}");
    },
    onPaymentFailed: (response) {
      //TODO 处理失败支付响应
      debugPrint("Failed ------> ${response.toMap()}");
    },
  )

Apple Pay设置

为了在您的项目中使用Apple Pay,您首先需要将您的域名添加到Moyasar仪表板中的Apple Pay - 域名设置中。

请访问他们的官方文档以了解更多如何添加Apple Pay的域名。

unicode-moyasar.web.app

请跳过步骤1和2,并使用上面提供的URL。

完整示例Demo

以下是完整的示例代码:

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

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Moyasar',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: Colors.indigo),
      home: const PaymentView(),
    );
  }
}

class PaymentView extends StatefulWidget {
  const PaymentView({Key? key}) : super(key: key);

  [@override](/user/override)
  State<PaymentView> createState() => _PaymentViewState();
}

class _PaymentViewState extends State<PaymentView> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Checkout"),
        shape: const StadiumBorder(),
      ),
      body: MoyasarPayment(
        moyasarPaymentData: MoyasarPaymentData(
          appName: "FLUTTER MOYASAR",
          secretKey: "sk_test_key",
          publishableSecretKey: "pk_test_key",
          purchaseAmount: 75.50,
          locale: PaymentLocale.en,
          paymentEnvironment: PaymentEnvironment.test,
          description: "description",
          paymentOptions: [
            PaymentOption.card,
            PaymentOption.applepay,
            PaymentOption.stcpay,
          ],
        ),
        onPaymentSucess: (response) {
          //TODO 处理成功支付响应
          debugPrint("Success ------&gt; ${response.toMap()}");
        },
        onPaymentFailed: (response) {
          //TODO 处理失败支付响应
          debugPrint("Failed ------&gt; ${response.toMap()}");
        },
      ),
    );
  }
}

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

1 回复

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


在Flutter项目中集成和使用flutter_moyasar插件进行支付处理,你可以按照以下步骤进行。这里我们假设你已经有一个Flutter项目,并且已经配置好了基本的开发环境。

1. 添加依赖

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

dependencies:
  flutter:
    sdk: flutter
  flutter_moyasar: ^最新版本号  # 请替换为实际可用的最新版本号

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

2. 配置Android和iOS

Android

android/app/src/main/AndroidManifest.xml中,你可能需要添加一些必要的权限,比如网络权限:

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

iOS

对于iOS,你通常不需要手动修改太多配置,除非flutter_moyasar有特定的iOS配置需求。你可以查看其官方文档获取更多信息。

3. 初始化Moyasar SDK

在你的Flutter项目的Dart代码中,你需要初始化Moyasar SDK。这通常在你的主应用入口文件(比如main.dart)或者一个专门的支付处理模块中进行。

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Moyasar Example'),
        ),
        body: Center(
          child: PaymentScreen(),
        ),
      ),
    );
  }
}

class PaymentScreen extends StatefulWidget {
  @override
  _PaymentScreenState createState() => _PaymentScreenState();
}

class _PaymentScreenState extends State<PaymentScreen> {
  late Moyasar moyasar;

  @override
  void initState() {
    super.initState();
    // 初始化Moyasar SDK
    moyasar = Moyasar(
      publicKey: '你的Moyasar公钥',  // 请替换为你的Moyasar公钥
      secretKey: '你的Moyasar私钥',  // 请注意,私钥通常不在客户端使用,这里仅作为示例
      environment: MoyasarEnvironment.sandbox,  // 或者MoyasarEnvironment.production
    );
  }

  void makePayment() async {
    try {
      // 创建一个支付请求
      var payment = await moyasar.createPayment(
        amount: 1000,  // 支付金额,单位是最小货币单位(例如,对于USD是美分)
        currency: 'USD',
        description: '测试支付',
        source: MoyasarSource.card(
          number: '4111111111111111',  // 测试卡号
          expiryMonth: '12',
          expiryYear: '25',
          cvv: '123',
        ),
        metadata: {
          'order_id': '123456',
        },
      );

      // 处理支付结果
      print('Payment successful: ${payment.id}');
    } catch (e) {
      // 处理错误
      print('Payment failed: ${e.message}');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Text('点击按钮进行支付'),
        ElevatedButton(
          onPressed: makePayment,
          child: Text('支付'),
        ),
      ],
    );
  }
}

注意

  1. 安全性:不要在客户端代码中硬编码私钥。私钥应该只在服务器端使用,用于创建支付令牌等敏感操作。
  2. 支付信息:在实际应用中,支付信息(如卡号、CVV等)应该通过安全的方式收集和传输。
  3. 错误处理:确保在生产环境中对支付流程中的各种可能错误进行妥善处理。
  4. 测试环境:在开发过程中,使用Moyasar的Sandbox环境进行测试,以避免产生实际的支付交易。

这个示例展示了如何使用flutter_moyasar插件进行基本的支付处理。根据你的实际需求,你可能需要调整代码来适应特定的业务逻辑和支付流程。

回到顶部