Flutter支付插件flutter_payoo_vn的使用

Flutter支付插件flutter_payoo_vn的使用

该插件帮助在Flutter应用项目中集成Payoo原生移动SDK。目前，Payoo仅支持Android和iOS平台。

这是来自Romantic Project的一个礼物。更多详情请访问Romantic Developer。

开始使用

首先，在使用该插件之前，确保您的应用已经注册为Payoo的商户，并且您拥有Android（.aar文件）和iOS（框架文件）的SDK。

安卓设置

步骤1：通过AAR文件创建模块

• 参考文档

• 目前，每个Payoo的aar文件都是一个模块，名称如下：

  

步骤2：设置一些配置属性

• 将以下属性添加到你的项目路径下的android/gradle.properties文件中：

payoo.vn.native.sdk.dir=＜包含Payoo安卓模块的目录＞
payoo.vn.protocol.scheme.dev=＜开发环境的协议方案＞
payoo.vn.protocol.scheme.prod=＜生产环境的协议方案＞

• 在你的项目路径下的android/build.gradle文件中添加以下代码：

buildscript {
    ext.kotlin_version = '1.3.50'
    repositories {
        google()
        jcenter()
        maven { url 'https://plugins.gradle.org/m2/' }
        mavenCentral()
    }

    dependencies {
        classpath 'com.android.tools.build:gradle:3.5.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

rootProject.allprojects {
    repositories {
        google()
        jcenter()
        maven { url 'https://jitpack.io' }
    }
}

• 在你的项目路径下的android/app/build.gradle文件中添加以下代码：

def globalProperties = new Properties()
def globalPropertiesFile = new File(rootProject.projectDir, "gradle.properties")
println "propertiesFile: ${globalPropertiesFile}"
if (globalPropertiesFile.exists()) {
    globalPropertiesFile.withReader('UTF-8') { reader ->
        globalProperties.load(reader)
    }
}
def payooSchemeDev = globalProperties.getProperty("payoo.vn.protocol.scheme.dev")
def payooSchemeProd = globalProperties.getProperty("payoo.vn.protocol.scheme.prod")
//TODO 你可以根据你的应用口味设置Payoo协议方案。

android {
    compileSdkVersion 30

    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 30
        resValue "string", "payoo_protocol_scheme", "${payooSchemeDev}"
    }
    lintOptions {
        disable 'InvalidPackage'
    }
    packagingOptions {
    }
}

dependencies {
    implementation project(':payoo_core')
    implementation project(':payoo_paybill')
    implementation project(':payoo_payment')
    implementation project(':payoo_topup')

    // 这些依赖项由Payoo.vn所需。如果有问题，请联系Payoo协调员。
    implementation "androidx.core:core-ktx:1.3.2"
    implementation 'androidx.appcompat:appcompat:1.3.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.0.4'
    implementation 'androidx.recyclerview:recyclerview:1.2.1'
    implementation 'com.google.android.material:material:1.2.1'
    implementation 'com.squareup.retrofit2:retrofit:2.4.0'
    implementation 'com.squareup.retrofit2:converter-gson:2.4.0'
    implementation 'com.squareup.retrofit2:adapter-rxjava2:2.4.0'
    implementation 'androidx.lifecycle:lifecycle-livedata-ktx:2.2.0'
    implementation 'org.fabiomsr:moneytextview:1.1.0'
    implementation 'joda-time:joda-time:2.10.5'
    implementation 'com.github.barteksc:android-pdf-viewer:2.8.2'
    implementation 'com.github.zhukic:sectioned-recyclerview:1.2.3'
    implementation 'androidx.paging:paging-runtime-ktx:2.1.0'
    implementation 'com.github.wendux:DSBridge-Android:3.0.0'
    implementation(platform("com.squareup.okhttp3:okhttp-bom:4.9.0"))
    implementation("com.squareup.okhttp3:okhttp")
    implementation("com.squareup.okhttp3:logging-interceptor")
    implementation 'io.reactivex:rxkotlin:2.0.0-RC1'
    implementation "io.reactivex.rxjava2:rxjava:2.2.1"
    implementation 'io.reactivex.rxjava2:rxandroid:2.0.2'
}

• 启用MultipleDex。参见文档

步骤3：更新Proguard规则

• 添加以下行到proguard-rules.pro文件中：

#------------ Start Proguard rules for payoo_vn ----------------#
####################################################################################
# PAYMENT SDK
####################################################################################
-keep class vn.payoo.core.** { *; }
-dontwarn vn.payoo.core.**
-keepclassmembers enum vn.payoo.core.** { *; }

-keep class vn.payoo.model.** { *; }
-dontwarn vn.payoo.model.**
-keepclassmembers enum vn.payoo.model.** { *; }

-keep class vn.payoo.paymentsdk.PayooPaymentSDK {
    public static <methods>;
}
-keepclassmembers class vn.payoo.paymentsdk.PayooPaymentSDK {
   public static ** Companion;
}
-keepclassmembers enum vn.payoo.paymentsdk.** { *; }

####################################################################################
# DATA EXCEPTION
####################################################################################
-keep class vn.payoo.paymentsdk.data.exception.** { *; }
-dontwarn vn.payoo.paymentsdk.data.exception.**

####################################################################################
# DATA MODEL
####################################################################################
-keep class vn.payoo.paymentsdk.data.model.** { *; }
-dontwarn vn.payoo.paymentsdk.data.model.**
#------------ End Proguard rules for payoo_vn ----------------#

iOS设置

打开你的项目路径下的ios/Runner.xcworkspace文件在Xcode中。

步骤1：为目标创建ExternalFrameworks组

• 为你的Runner目标创建一个新的组，命名为’ExternalFrameworks’，并添加所有Payoo的框架文件。参见文档

• 操作后，你会看到如下的图像：

  

步骤2：将ExternalFrameworks链接到flutter_payoo_vn目标

• 选择左侧面板中的Pods目标。

• 在中心面板中，选择TARGETS中的flutter_payoo_vn。

• 在Build Phases选项卡下，点击Link Binary With Libraries项下的(+)按钮，链接所有Payoo框架文件。

  

步骤3：将ExternalFrameworks嵌入到Runner目标

• 对Runner目标执行相同的步骤。

步骤4：添加NSContactsUsageDescription

• Payoo需要访问通讯录权限，在iOS上，你需要在Info.plist中添加NSContactsUsageDescription。参见文档

步骤5：添加NSAppTransportSecurity

• 还需要添加NSAppTransportSecurity以帮助应用程序在开发环境中进行HTTP连接。参见文档

在Flutter中使用

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

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    _initialize();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('插件示例应用'),
        ),
        body: Center(
          child: Column(
            children: [
              Text('这是Payoo'),
              ElevatedButton(
                  onPressed: () {
                    _navigate(PayooVnServiceIds.topup);
                  },
                  child: Text(PayooVnServiceIds.topup)),
              ElevatedButton(
                  onPressed: () {
                    _navigate(PayooVnServiceIds.electric);
                  },
                  child: Text(PayooVnServiceIds.electric)),
              ElevatedButton(
                  onPressed: () {
                    _navigate(PayooVnServiceIds.water);
                  },
                  child: Text(PayooVnServiceIds.water)),
            ],
          ),
        ),
      ),
    );
  }

  Future<dynamic> _navigate(String serviceId) async {
    final res = await PayooVnPlugin.navigate(serviceId);
    print('_MyAppState._navigate: $res');
  }

  void _initialize() async {
    final res = await PayooVnPlugin.initialize(PayooVnSettings(
        isDev: true,
        merchantId: "your-merchant-id",
        secretKey: "your-merchant-secret-key"));
  }
}

开发环境

[✓] Flutter (Channel stable, 2.2.3, on macOS 11.2.3 20D91 darwin-x64, locale en-VN)
    • Flutter version 2.2.3 at /Users/admin/fvm/versions/stable
    • Framework revision f4abaa0735 (8天前), 2021-07-01 12:46:11 -0700
    • Engine revision 241c87ad80
    • Dart version 2.13.4

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Users/admin/Library/Android/sdk
    • Platform android-30, build-tools 30.0.3
    • ANDROID_HOME = /Users/admin/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
    • 所有Android许可证均已接受。

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode_12.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter插件可以从以下地址安装：
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart插件可以从以下地址安装：
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java版本 OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)