Stripe 无法在 webview 中进行支付错误

Posted 2023-02-23

【中文标题】Stripe 无法在 webview 中进行支付错误

【英文标题】：Stripe cannot make make payment error in webview

【发布时间】：2021-01-22 12:50:34

【问题描述】：

我在我的应用程序中使用条带支付网关，当我输入卡详细信息后一切正常，然后在输入 otp 并提交后重定向到 OTP 页面并提交它会引发此错误

此问题仅在实时模式下出现，在测试模式借记卡不会要求 OTP

I/flutter ( 5342): errprint : PlatformException(failed, failed, null, null)

payment-service.dart

import 'dart:convert';
import 'package:flutter/services.dart';
import 'package:http/http.dart' as http;
import 'package:stripe_payment/stripe_payment.dart';

class StripeTransactionResponse 
  String message;
  bool success;
  StripeTransactionResponse(this.message, this.success);


class StripeService 
  static String apiBase = 'https://api.stripe.com/v1';
  static String paymentApiUrl = '$StripeService.apiBase/payment_intents';
  static String secret = 'xxxMy_secretxxx';
  static Map<String, String> headers = 
    'Authorization': 'Bearer $StripeService.secret',
    'Content-Type': 'application/x-www-form-urlencoded'
  ;
  static init() 
    StripePayment.setOptions(StripeOptions(
        publishableKey: "xxxMy_keyxxx",
        androidPayMode: 'production'));
  

  static Future<StripeTransactionResponse> payViaExistingCard(
      String amount, String currency, CreditCard card) async 
    try 
      var paymentMethod = await StripePayment.createPaymentMethod(
          PaymentMethodRequest(card: card));
      var paymentIntent =
          await StripeService.createPaymentIntent(amount, currency);
          print("payment intent $paymentIntent");
      var response = await StripePayment.confirmPaymentIntent(PaymentIntent(
          clientSecret: paymentIntent['client_secret'],
          paymentMethodId: paymentMethod.id));
          print("Payment confirm $response.status");
      if (response.status == 'succeeded') 
        return new StripeTransactionResponse(
            message: 'Transaction successful', success: true);
       else 
        return new StripeTransactionResponse(
            message: 'Transaction failed', success: false);
      
     on PlatformException catch (err) 
      print("errprint : $err");
      return StripeService.getPlatformExceptionErrorResult(err);
     catch (err) 
      print("errprint$err");
      return new StripeTransactionResponse(
          message: 'Transaction failed: $err.toString()', success: false);
    
  

  static Future<Map<String, dynamic>> createPaymentIntent(
      String amount, String currency) async 
    try 
      Map<String, dynamic> body = 
        'amount': amount,
        'currency': currency,
        'payment_method_types[]': 'card',
        'description': 'Software development services',
        'shipping[name]': 'Jenny Rosen',
        'shipping[address][line1]': '510 Townsend St',
        'shipping[address][postal_code]': '98140',
        'shipping[address][city]': 'San Francisco',
        'shipping[address][state]': 'TN',
        'shipping[address][country]': 'IN',
      ;
      var response = await http.post(StripeService.paymentApiUrl,
          body: body, headers: StripeService.headers);
          print("check post res$jsonDecode(response.body)");
      return jsonDecode(response.body);
     catch (err) 
      print('err charging user: $err.toString()');
    
    return null;
  

这是我的 pubspec.yaml

name: message
description: A new Flutter project.

# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# In Android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In ios, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1

environment:
  sdk: ">=2.7.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

  intro_slider: ^2.3.2

  firebase_auth: ^0.18.0+1
  
  cloud_firestore: ^0.14.0+2

  fluttertoast: ^7.0.2

  image_picker:  ^0.6.0+9

  shared_preferences: ^0.5.3+1

  firebase_storage: ^4.0.0

  #flutter_html: ^1.0.2

  firebase_core: ^0.5.0

  giffy_dialog:

  cached_network_image: ^2.2.0+1

  modal_progress_hud: ^0.1.3

  intl: ^0.16.1

  flutter_clipboard_manager:

  sentry: ^2.2.0
  
  timeago: ^2.0.27

  qr_flutter:

  graphql:

  image_cropper: ^1.0.2

  contacts_service: ^0.4.6

  permission_handler: ^5.0.1+1

  share: ^0.6.1

  fleva_icons: ^1.0.0
 
  google_fonts : ^0.2.0

  flutter_staggered_grid_view: ^0.3.0

  flutter_icons: ^1.0.0+1

  flutter_cache_store:

  web3dart: ^1.2.3

  bitcoins: ^1.0.3

  #bitcoinFlutter
  bitcoin_flutter: ^2.0.1

  carousel_slider: ^1.3.1

  transparent_image: ^1.0.0

  smooth_star_rating: ^1.0.3

  dots_indicator: ^1.1.0

  bip32: ^1.0.5

  bip39: ^1.0.3

  tuple:

  hex: ^0.1.2

  scoped_model: ^1.0.1

  equatable:

  crypto: ^2.1.5

  encrypt: ^4.0.2

  localstorage: 

  path_provider: 
    
  photo_view: ^0.4.0

  mime: ^0.9.6+2

  ntp: ^1.0.3

  decimal:

  virtual_keyboard:

  local_auth:

  url_launcher: ^5.7.2

  launch_review: ^2.0.0

  flutter_secure_storage: ^3.3.4

  giphy_client: ^0.2.0

  flutter_barcode_scanner:

  firebase_messaging: ^5.0.2

  font_awesome_flutter:
  
  #otpinput field
  pin_code_fields: ^5.0.1

  #otpanimation lib
  flare_flutter: ^2.0.6

  flutter_slidable: ^0.5.7

  file_picker: ^2.0.6

  ethereum_address:

  flutter_downloader:
  
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^0.1.3

  #upi payment gateway
  upi_india: ^2.1.2

  cool_alert: ^1.0.1

  #webview for paymentgateway
  #webview_flutter: ^1.0.0

  #paypal payment gateway
  http_auth: ^0.3.0

  #Razorpay payment gateway
  #razorpay_flutter: ^1.2.2

  #stripe payment gateway
  stripe_payment: ^1.0.8

  #stripeUI
  flutter_credit_card: ^0.1.3
  progress_dialog: ^1.2.2
  


dev_dependencies:
  flutter_test:
    sdk: flutter

# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec

# The following section is specific to Flutter.
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  # To add assets to your application, add an assets section, like this:
  assets:
     - assets/img_not_available.jpeg
     - assets/flags/
     - assets/emoji/
     - assets/images/
     - assets/bg1.jpg
     - assets/giphy.png
     - assets/anime/otp.flr
     - assets/splash.png
     - assets/splashc.jpg
     - assets/json/FacebookPost.json

  # An image asset can refer to one or more resolution-specific "variants", see
  # https://flutter.dev/assets-and-images/#resolution-aware.

  # For details regarding adding assets from package dependencies, see
  # https://flutter.dev/assets-and-images/#from-packages

  # To add custom fonts to your application, add a fonts section here,
  # in this "flutter" section. Each entry in this list should have a
  # "family" key with the font family name, and a "fonts" key with a
  # list giving the asset and other descriptors for the font. For
  # example:
  # fonts:
  #   - family: Schyler
  #     fonts:
  #       - asset: fonts/Schyler-Regular.ttf
  #       - asset: fonts/Schyler-Italic.ttf
  #         style: italic
  #   - family: Trajan Pro
  #     fonts:
  #       - asset: fonts/TrajanPro.ttf
  #       - asset: fonts/TrajanPro_Bold.ttf
  #         weight: 700
  #
  # For details regarding fonts from package dependencies,
  # see https://flutter.dev/custom-fonts/#from-packages

【参考方案1】：

假设“OTP”是作为 3D 安全流程一部分的“一次性密码”，那么您可以使用 SCA regulatory test cards（例如 3155 或 3184 卡）在测试模式下触发此操作。

目前尚不清楚您的错误来自何处，但如果您可以在测试模式下与重现分享更多细节，那么有人可能会提供更多建议。

【讨论】：

感谢您提出 3D Secure flow 的建议，这对我有很大帮助，问题是我的借记车不接受国际付款