Flutterwave Integration with Ionic 4

传递的公钥无效请在付款过程中遇到问题，这就是我收到的 "传递的公钥无效" API 几天来一直在返回此错误，问题是什么？我正在使用仪表板中的实时公钥和密钥。

this.rave.Card.charge(

{
"PBFPubKey":"FLWPUBK-33223e3cd910016924752a8373518225-X",
"cardno": "5438898014560229",
"cvv": "564",
"expirymonth": "10",
"expiryyear": "20",
"currency": "NGN",
"country": "NG",
"amount": "10",
"email": "user@gmail.com",
"phonenumber": "0902620185",
"firstname": "temi",
"lastname": "desola",
"IP": "355426087298442",
"txRef": "MC-" + Date.now(),// your unique merchant reference
"meta": [{ metaname: "flightID", metavalue: "123949494DC" }],
"redirect_url": "https://rave-webhook.herokuapp.com/receivepayment",
"device_fingerprint": "69e6b7f0b72037aa8428b70fbe03986c"
}
).then(resp => {
console.log(resp.body);
this.rave.Card.validate({
"transaction_reference": resp.body.data.flwRef,
"otp": 12345
}).then(response => {
console.log(response.body.data.tx);
console.log(response.body);
})
}).catch(err => {
console.log(err);
})

第 1 步：在此处获取 Flutterwave-Angular-v3 [https://github.com/Flutterwave/Flutterwave-Angular-v3]

根据您的运行时运行这些命令之一环境

npm install flutterwave-angular-v3 
or

yarn  add  flutterwave-angular-v3

第 2 步：将 FlutterwaveModule 导入应用程序根模块，即.app.module.ts 文件，并在导入数组中声明它。

从"Flutterwave-angular-v3"导入 { FlutterwaveModule }

@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FlutterwaveModule
],
providers: [],
bootstrap: [AppComponent]
})

您有 2 个选项之一在代码中使用或用作组件，具体取决于应用程序的体系结构模式。链接上的 README.md 很好解释。

第 3 步：出于此问题的目的，请选择

在代码中使用，方法 2(承诺)：异步付款响应

import {Component} from '@angular/core';
import {Flutterwave, AsyncPaymentOptions} from "flutterwave-angular-v3"

(因此，您可以获得承诺，并以编程方式使用响应数据执行任何您希望的操作)。

现在启动 chrome 并测试您的应用程序，当单击支付按钮提示 https://flutterwave.com/ng/付款页面模式时，这应该在 chrome 上正常工作，

P：S 如果您正在本机构建(即在设备上)，您可能会遇到问题，值得注意的是，当您单击支付按钮时，它会陷入无限循环，并且您有一个白色的空白屏幕，只是不断显示加载图标.. 通过在 Config.xml 文件中将 https://cordova.apache.org/docs/en/9.x/reference/cordova-plugin-whitelist/列入白名单来解决此问题.....

请确保这些配置包含在 config.xml 文件中：

<access origin="*" subdomains="true" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-navigation href="*" />

之后，删除您各自的平台构建文件夹并重建，即

ionic cordova build android

或

ionic cordova build ios

现在再次为您的项目提供服务并开始测试，这应该现在在您的设备或模拟器上完美运行。如果您在他们的论坛 https://developer.flutterwave.com/discuss 上遇到不同的错误，您肯定会在创纪录的时间内得到答案，他们的工程师正在做出色的工作。

如果你得到这个工作，考虑自己认可绝地的身份，请标记这个答案。

请确保转到仪表板并在设置>API下复制公钥。另请注意，该软件包是为离子 3 而不是离子 4 构建的。您可以将此软件包用于 Ionic 4 [Rave Ionic 4] (https://www.npmjs.com/package/rave-ionic4)。

我更新了离子 3 的当前版本以适用于离子 4

相关内容

最新更新

热门标签：