使用Dart，Flutter Web和API进行Paytabs付款集成 [英] Paytabs payment integration using dart, flutter web and api

问题描述

我的网站项目扑朔迷离，我正在尝试实施付款解决方案.我发现，根据我的情况，paytabs是一个不错的选择.我想添加他们的api，但是我在Flutter网站上一直收到CORS erorr的提示.因此，我尝试了他们准备好的付款页面，但由于我之前对Web开发没有任何了解，因此我也无法实施.我只用飞镖和飞镖.但是我想实现api，因为它提供了更高的控制权.这是用于发布请求的网址

3. 您需要覆盖活动的onActivityResult

I have a flutter web project and I was trying to implement a payment solution. I found out that paytabs is a good choice for my situation. I wanted to add their api but I kept getting the CORS erorr over my flutter website. So I tried their ready payment page but I am also unable to implement since I have no previous knowledge about web development. I only use dart and flutter. But I would like to implement the api since it gives higher control. This is the url used for post requests https://www.paytabs.com/apiv2/create_pay_page Using the http package I always have the CORS appearing as an error. Documentation for the paytab service: https://dev.paytabs.com/docs/paypage/ Hope you can help

解决方案

There are not payment plugins available for flutter. but we can integrate PayTabs by using flutter platform channel.

step 1-> Create the Flutter platform client final Map result = await methodChannel.invokeMethod('getPayTabs'); Exemple :`

Future<void> _getPayTabs() async {
String batteryLevel;
try {
  debugPrint("this is dart getPayTabs");
  final Map result = await methodChannel.invokeMethod('getPayTabs');
  debugPrint("trasiction data $result");
} on PlatformException {
  debugPrint("trasiction data Failed");

}

step 2-> Importing the SDK android project

1. In Android Studio, Right click on the app choose New > Module
2. Choose the Downloaded paytabs_sdk-v4.0.1.aar. If not, download here
3. Right click on your App and choose Open Module Settings
4. Add the Module dependency
5. Choose the: paytabs_sdk-v4.0.1 module to be included
6. Confirm the Module import by changing the Android view to Project view in the sidebar
7. Add below dependencies.
8. You can start with code changes.

9. You have to include the following dependencies:

   allprojects {
   repositories {
   ...
   maven {
   url 'https://jitpack.io'
   
   }
   }
   }
   

   implementation 'com.android.support:design:28.0.0'
   implementation 'com.android.support:appcompat-v7:28.0.0'
   implementation 'com.squareup.retrofit2:retrofit:2.4.0'
   implementation 'com.google.code.gson:gson:2.8.5'
   implementation 'com.squareup.retrofit2:converter-gson:2.4.0'
   implementation 'com.github.dbachelder:CreditCardEntry:1.4.9'
   

step 3-> Add an Android platform-specific implementation
Start by opening the Android host portion of your Flutter app in Android Studio:

1. Open the file MainActivity.kt located in the kotlin folder in the Project view. (Note: If editing with Android Studio 2.3, note that the kotlin folder is shown as if named java.)
2. Inside the configureFlutterEngine() method, create a MethodChannel and call setMethodCallHandler(). Make sure to use the same channel name as was used on the Flutter client side.

3. You need to override your Activity’s onActivityResult

这篇关于使用Dart，Flutter Web和API进行Paytabs付款集成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！