Stripe Checkout 插件未显示在 Android 设备中

问：

我有以下问题。我尝试在物理 Android 设备上启动 Stripe 集成，但无法实现。

我在 Angular 的 ionic 7 中有一个项目，我使用“PaymentSheet”方法集成了 Stripe，该方法在浏览器中的 Web 版本中可以正常工作，与在线服务器上的 .Net 后端建立连接（它不在本地主机上），我在响应中收到以下数据： paymentIntent、ephemeralKey 和 customer。

当我在浏览器中执行它时，stripe 插件毫无问题地出现，我甚至可以完成付款过程，但是当我为 Android 的本机版本编译它时，这失败了，因为该插件无法在模拟设备或物理手机上打开。

我真的寻找了很多选择，但我没有成功，我希望你能帮助我解决这个问题，因为我认为主要问题来自以下几点：

未找到事件 paymentSheetLoaded 的侦听器。

我在这里留下一些屏幕截图，希望它们可以作为参考，可以帮助我解决这个问题。

谢谢

Android Studio 中 Logcat 面板的片段，您可以在其中查看“Listener”调用的问题

Capacitor/Plugin        io.ionic.starter                     V  To native (Capacitor plugin): callbackId: 118387073, pluginId: Stripe, methodName: addListener
Capacitor               io.ionic.starter                     V  callback: 118387073, pluginId: Stripe, methodName: addListener, methodData: {"eventName":"paymentSheetCompleted"}
EGL_emulation           io.ionic.starter                     D  app_time_stats: avg=6485.01ms min=6485.01ms max=6485.01ms count=1

Capacitor/Console       io.ionic.starter                     I  File: https://localhost/8799.aeaa722d625ca6fb.js - Line 1 - Msg: paymentIntent:  pi_3O4oB0L9Q7sDxvs01Aig5CZZ_secret_qJb4neieSTGdbDzeKgtKNrsni
Capacitor/Console       io.ionic.starter                     I  File: https://localhost/8799.aeaa722d625ca6fb.js - Line 1 - Msg: ephemeralKey:  ek_test_YWNjdF8xTnptNXdMOVE3c0R4dnMwLGZVY3NNRHVpTW5HVlBOOGMwSUNtNWQ0ejd3dDl2cXg_00lRq8Ohky
Capacitor/Console       io.ionic.starter                     I  File: https://localhost/8799.aeaa722d625ca6fb.js - Line 1 - Msg: customer:  cus_OsZJwnLJzFmGA1
Capacitor/Plugin        io.ionic.starter                     V  To native (Capacitor plugin): callbackId: 118387074, pluginId: Stripe, methodName: createPaymentSheet
Capacitor               io.ionic.starter                     V  callback: 118387074, pluginId: Stripe, methodName: createPaymentSheet, methodData: {"paymentIntentClientSecret":"pi_3O4oB0L9Q7sDxvs01Aig5CZZ_secret_qJb4neieSTGdbDzeKgtKNrsni","customerId":"cus_OsZJwnLJzFmGA1","customerEphemeralKeySecret":"ek_test_YWNjdF8xTnptNXdMOVE3c0R4dnMwLGZVY3NNRHVpTW5HVlBOOGMwSUNtNWQ0ejd3dDl2cXg_00lRq8Ohky"}

Capacitor/StripePlugin  io.ionic.starter                     V  Notifying listeners for event paymentSheetLoaded
Capacitor/StripePlugin  io.ionic.starter                     D  No listeners found for event paymentSheetLoaded
Capacitor/Console       io.ionic.starter                     I  File: https://localhost/ - Line 328 - Msg: undefined
Capacitor/Plugin        io.ionic.starter                     V  To native (Capacitor plugin): callbackId: 118387075, pluginId: Stripe, methodName: presentPaymentSheet
Capacitor               io.ionic.starter                     V  callback: 118387075, pluginId: Stripe, methodName: presentPaymentSheet, methodData: {}
Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event pause
Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event pause
Capacitor               io.ionic.starter                     D  App paused
Capacitor               io.ionic.starter                     D  Unable to find a Capacitor plugin to handle requestCode, trying Cordova plugins 2127678468
Capacitor/StripePlugin  io.ionic.starter                     V  Notifying listeners for event paymentSheetFailed
Capacitor/StripePlugin  io.ionic.starter                     D  No listeners found for event paymentSheetFailed
Capacitor/StripePlugin  io.ionic.starter                     V  Notifying listeners for event paymentSheetFailed
Capacitor/StripePlugin  io.ionic.starter                     D  No listeners found for event paymentSheetFailed
Capacitor/AppPlugin     io.ionic.starter                     D  Firing change: true
Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event appStateChange
Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event appStateChange
Capacitor/AppPlugin     io.ionic.starter                     V  Notifying listeners for event resume
Capacitor/AppPlugin     io.ionic.starter                     D  No listeners found for event resume
Capacitor               io.ionic.starter                     D  App resumed
Capacitor/Console       io.ionic.starter                     I  File: https://localhost/8799.aeaa722d625ca6fb.js - Line 1 - Msg: Stripe Response:  [object Object]

（前端）我的payments.page.ts组件：

import { environment } from 'src/environments/environment';
import { Component, OnInit } from '@angular/core';
import { Stripe, PaymentSheetEventsEnum  } from '@capacitor-community/stripe';
import { HttpClient, HttpParams } from '@angular/common/http';
import { first, lastValueFrom } from 'rxjs';

@Component({
  selector: 'app-pagos',
  templateUrl: './pagos.page.html',
  styleUrls: ['./pagos.page.scss'],
})
export class PagosPage implements OnInit {

  data: any = {
    "amount": 1200,
    "customerDto": {
      "email": "[email protected]",
      "name": "Jhon Doe"
    }
  };

  constructor(
    private http: HttpClient,
  ) {
    Stripe.initialize({
      publishableKey: environment.stripe.publishableKey,
    });
  }

  ngOnInit() {
  }

  httpPostCreateIntent(body: any){
    return this.http.post<any>(environment.api2 + 'CreatePaymentIntentV2', body).pipe(first());
  }

  async paymentSheet()
  {
    try{ 
          
          Stripe.addListener(PaymentSheetEventsEnum.Completed, () => {
            console.log('PaymentSheetEventsEnum.Completed');
          });

          const data$ = this.httpPostCreateIntent(this.data);          
          const { clientSecret, ephemeralKey, customer } = await lastValueFrom(data$);

          console.log("paymentIntent: ", clientSecret);
          console.log("ephemeralKey: ", ephemeralKey);
          console.log("customer: ", customer);
        
          await Stripe.createPaymentSheet({            
            paymentIntentClientSecret: clientSecret,
            customerId: customer,
            customerEphemeralKeySecret: ephemeralKey,
          });

          
          const result = await Stripe.presentPaymentSheet();
          console.log('Stripe Response: ',result);         
          
          if (result && result.paymentResult === PaymentSheetEventsEnum.Completed) {            
            console.log("All is ok!!")
          }
    }
    catch(e){
      console.log(e);
    }
  }
 
}

我已经按照几个教程试图找到解决方案，但到目前为止，我还没有能够纠正错误。我尝试了以下方法：

• 在里面添加此行（它不起作用）AndroidManifest: android:usesCleartextTraffic="true"
• 更改 的类路径（它不起作用）capacitor-cordova-android-pluginsbuild.gradle
• 在我的项目中安装 Cordova 而不是 Capcitor 的版本，但这适得其反，因为它破坏了我使用电容器的其他模块。（它不起作用）
• 将 variables.gradle 中的 SDK 版本更改为以下内容：（不起作用）minSdkVersion = 26compileSdkVersion = 34