Flutter支付集成插件razorpay_flutter_31的使用

当然，以下是如何在Flutter项目中集成并使用razorpay_flutter_31插件的示例代码。这个插件允许你集成Razorpay支付网关到你的Flutter应用中。

步骤 1: 添加依赖

首先，在你的pubspec.yaml文件中添加razorpay_flutter_31依赖：

dependencies:
  flutter:
    sdk: flutter
  razorpay_flutter_31: ^1.2.8  # 请检查最新版本号并替换

然后运行flutter pub get来获取依赖。

步骤 2: 配置Android

在android/app/src/main/AndroidManifest.xml中添加以下权限和Activity声明：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

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

    <application
        ...>
        
        <activity
            android:name="com.razorpay.CheckoutActivity"
            android:theme="@style/Theme.AppCompat.Light.NoActionBar"
            android:screenOrientation="portrait"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize"
            android:windowSoftInputMode="adjustResize" />

        <activity
            android:name="com.razorpay.PrePaymentActivity"
            android:theme="@style/Theme.AppCompat.Light.NoActionBar"
            android:screenOrientation="portrait"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize"
            android:windowSoftInputMode="adjustResize" />
            
        <!-- Add more activities if needed -->
        
    </application>

</manifest>

在android/app/build.gradle文件中，确保你的minSdkVersion是16或更高：

android {
    compileSdkVersion 30

    defaultConfig {
        applicationId "com.example.yourapp"
        minSdkVersion 16
        targetSdkVersion 30
        versionCode 1
        versionName "1.0"
    }
    ...
}

步骤 3: 配置iOS

在ios/Runner/Info.plist中添加以下键：

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

在ios/Podfile中，确保你有使用最新的Cocoapods版本，并添加以下post_install脚本（如果需要）：

post_install do |installer|
  installer.pods_project.targets.each do |target|
    flutter_additional_ios_build_settings(target)
    target.build_configurations.each do |config|
      config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= [
        '$(inherited)',
        'RAZORPAY_VERSION=@"1.2.8"'  # 请检查最新版本号并替换
      ]
    end
  end
end

然后运行pod install在iOS目录下。

步骤 4: 初始化并使用Razorpay

在你的Flutter代码中，初始化并使用Razorpay进行支付：

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Razorpay Integration'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: _initRazorpay,
            child: Text('Pay Now'),
          ),
        ),
      ),
    );
  }

  Future<void> _initRazorpay() async {
    final Razorpay _razorpay = Razorpay();
    
    _razorpay.on(Razorpay.EVENT_PAYMENT_SUCCESS, (paymentId) {
      print("Payment Success: $paymentId");
    });

    _razorpay.on(Razorpay.EVENT_PAYMENT_ERROR, (code, message, description) {
      print("Payment Error: $code, $message, $description");
    });

    _razorpay.on(Razorpay.EVENT_EXTERNAL_WALLET, (walletName) {
      print("External Wallet: $walletName");
    });

    var options = {
      "key": "your_key_id_here", // Replace with your Razorpay Key ID
      "amount": "1000", // Amount in currency subunits. 1000 subunits = ₹10
      "currency": "INR",
      "name": "Merchant Name",
      "description": "Payment Description",
      "image": "https://example.com/your_logo.png",
      "prefill": {
        "email": "test@example.com",
        "contact": "9199999999",
      },
      "theme": {
        "color": "#F37254"
      }
    };

    try {
      _razorpay.open(options);
    } catch (e) {
      print(e);
    }
  }
}

请确保将"your_key_id_here"替换为你的Razorpay Key ID。

注意事项

1. 安全性：不要在客户端代码中硬编码敏感信息，如API密钥。考虑使用环境变量或安全存储。
2. 测试环境：在生产环境中使用前，请在Razorpay的测试环境中彻底测试你的集成。
3. 错误处理：在生产代码中添加更多的错误处理和用户反馈。

这样，你就成功地在Flutter应用中集成了Razorpay支付插件。