我有以下问题。我尝试在物理 Android 设备上启动 Stripe 集成，但这是不可能的。
我在 ionic 7 和 Angular 中有一个项目，我使用“PaymentSheet”方法集成了 Stripe，该方法在浏览器内的 Web 版本中可以正常工作，与在线服务器上的 .Net 后端建立连接（它是不在本地主机上），我在响应中收到以下数据： paymentIntent、ephemeralKey 和 customer。
当我在浏览器中执行它时，条带插件出现没有问题，我什至可以完成支付过程，但是当我为 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]
（前端）我的 payment.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.gradleminSdkVersion = 26compileSdkVersion = 34我已经解决了这个问题，经过多次尝试和失败，通过在我的 payment.pages.ts 文件前面的 Stripe 的 createPaymentSheet 函数中添加一个参数来解决这个问题。我添加的参数是这样的：merchantDisplayName：'Ionic插件专家'，函数调用的完整形式如下：
await Stripe.createPaymentSheet({
paymentIntentClientSecret: clientSecret,
customerId: customer,
customerEphemeralKeySecret: ephemeralKey,
merchantDisplayName: 'Ionic plugins expert'
});