Flutter网页支付插件uni_pay_web的使用

发布于 1周前 作者 phonegap100 来自 Flutter

Flutter网页支付插件uni_pay_web的使用

支付网关库由UNICODE团队开发

A lightweight library for processing online payments and generating invoices with Moyasar, providing seamless payment info retrieval as well (🇸🇦💙🇧🇩❤️🇪🇬).

功能支持

  • 卡支持(mada, visa, mastercard, amex)
  • Apple Pay 集成 和 Xcode 设置
  • stcpay

当前支持的方法

  • CreateInvoice
    • 你可以通过传递 [金额, 货币, 描述, 过期时间, 成功URL, 返回URL, 元数据] 来创建发票。
  • GetPayment
    • 你可以通过 [ID] 获取支付详情。

开始使用

要在您的 Flutter 项目中使用 UniShipping,请遵循以下步骤:

安装

  1. uni_pay_web 添加到您的 pubspec.yaml 文件中:

    dependencies:
      uni_pay_web: latest_version
    
  2. 运行 flutter pub get 来安装包。

使用方法

现在您可以调用这些方法了:

// 1- 创建发票
final createInvoiceRes = UniPayWeb.createInvoice(
  psk: 'YOUR-PUBLISHABLE-SECRET-KEY', // 发布密钥
  dto: UniInvoiceDTO(
    amount: '100', // 金额
    currency: 'SAR', // 货币
    description: 'Test Description', // 描述
    expiredAt: 'expiredAt', // 过期时间
    successUrl: 'successUrl', // 成功后的跳转地址
    backUrl: 'backUrl', // 失败或取消后的跳转地址
    metadata: {
      'product_name': "your-product-name", // 商品名称
      'product_id': "abc123", // 商品ID
    },
  ),
);

// 2- 获取支付详情
final getPaymentRes = UniPayWeb.getPayment(
  transactionId: 'TRANSACTION-ID', // 交易ID
  psk: 'YOUR-PUBLISHABLE-SECRET-KEY', // 发布密钥
);

示例代码

以下是使用 uni_pay_web 的完整示例代码:

import 'package:uni_pay_web/uni_pay_web.dart';

void main() {
  /// 1- 创建发票示例
  var dto = UniInvoiceDTO(
    amount: '100', // 金额
    description: 'Test Description', // 描述
  );
  final createInvoiceRes = UniPayWeb.createInvoice(
    dto: dto,
    sk: 'YOUR-KEY', // 秘钥
  );
  print('createInvoiceRes: $createInvoiceRes');

  /// 2- 获取支付详情示例
  final getPaymentRes = UniPayWeb.getPayment(
    transactionId: 'TRANSACTION-ID', // 交易ID
    sk: 'YOUR-KEY', // 秘钥
  );
  print('uniPayWeb: $getPaymentRes');
}

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

1 回复

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


当然,以下是一个关于如何在Flutter项目中使用uni_pay_web插件进行网页支付的示例代码。请注意,uni_pay_web是一个假定的插件名称,实际中你可能需要查找并安装一个真实存在的适用于Flutter的网页支付插件。不过,以下代码提供了一个通用的思路和结构,你可以根据实际的插件文档进行调整。

1. 添加依赖

首先,你需要在pubspec.yaml文件中添加uni_pay_web(或实际插件的名称)作为依赖:

dependencies:
  flutter:
    sdk: flutter
  uni_pay_web: ^x.y.z  # 替换为实际版本号

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

2. 导入插件

在你的Flutter项目的Dart文件中导入插件:

import 'package:uni_pay_web/uni_pay_web.dart';

3. 配置支付参数

在需要进行支付的地方,配置支付参数。这通常包括订单信息、支付渠道等。以下是一个假设的示例:

Map<String, String> paymentParams = {
  'orderId': '1234567890',
  'amount': '100.00',
  'currency': 'CNY',
  'description': 'Product Description',
  // 其他必要的支付参数
};

4. 发起支付请求

使用插件提供的方法发起支付请求。以下是一个假设的方法调用示例:

void initiatePayment() async {
  try {
    // 假设uniPayWeb.startPayment是插件提供的发起支付的方法
    bool result = await UniPayWeb.startPayment(paymentParams);
    
    if (result) {
      print('支付成功');
      // 处理支付成功后的逻辑
    } else {
      print('支付失败');
      // 处理支付失败后的逻辑
    }
  } catch (e) {
    print('支付过程中发生错误: $e');
    // 处理异常
  }
}

5. 在UI中调用支付功能

在你的Flutter UI中,添加一个按钮或其他控件来触发支付功能:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Web 支付示例'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: initiatePayment,
            child: Text('立即支付'),
          ),
        ),
      ),
    );
  }
}

注意

  • 以上代码是一个假设的示例,实际使用时需要根据uni_pay_web(或你选择的插件)的文档进行调整。
  • 插件的具体方法和参数可能会有所不同,务必参考插件的官方文档。
  • 网页支付通常涉及与支付网关的交互,因此你可能需要在服务器端进行一些配置和处理。

希望这个示例能为你提供一个基本的框架,帮助你开始使用Flutter进行网页支付。如果你有更具体的问题或需要关于特定插件的帮助,请查阅该插件的官方文档或寻求社区支持。

回到顶部