.net Angular7 Net2.2信用卡处理应用程序

我正在为我的NET2.2/7 web应用程序实现信用卡处理功能。如何连接到服务器端的银行以获得信用卡批准

我找到了一张信用卡。这是我的前端代码，用于获取要发送到网络服务器的信用卡信息

export class CreditcardComponent implements OnInit {
ccForm: FormGroup;
submitted: boolean = false;

constructor(private _fb: FormBuilder) {
 }

ngOnInit() {
  this.ccForm = this._fb.group({
  creditCard: ['', [<any>CreditCardValidator.validateCCNumber]],
  expirationDate: ['', [<any>CreditCardValidator.validateExpDate]],
  cvc: ['', [<any>Validators.required, <any>Validators.minLength(3), 
  <any>Validators.maxLength(4)]] 
});
  }
  onSubmit(ccForm) {
   this.submitted = true;
   console.log(ccForm);
 } 
}

导出类CreditcardComponent实现OnInit{
ccForm:FormGroup；
提交：布尔值=false；
构造函数（私有_fb:FormBuilder）{
}
恩戈尼尼特（）{
this.ccForm=this.\u fb.group({
信用卡：[''，[CreditCardValidator.validateCCNumber]]，
到期日期：[''[CreditCardValidator.validateExpDate]]，
cvc:[''，[validator.required，validator.minLength（3），
验证程序。最大长度（4）]]
});
}
onSubmit（ccForm）{
this.submitted=true；
控制台日志（ccForm）；
} 
}

这是html代码：

<h2>Input credit card number</h2>
<form [formGroup]="ccForm" (ngSubmit)="onSubmit()" novalidate>
  <div class="form-group">
    <label for="cc-number">Credit card number</label>
    <input id="cc-number" formControlName="creditCard" type="tel" 
     autocomplete="off" ccNumber>
    <!--add error on wrong formate of number using <div> -->
  </div>
  <div class="form-group">
      <label for="cc-exp-date">expiration date</label>
      <input id="cc-exp-date" formControlName="expirationDate" type="tel" 
      autocomplete="cc-exp" ccExp>
      <!--add error on wrong formate of number using <div> -->
  </div>    
  <div class="form-group">
      <label for="cc-cvc">cvc</label>
      <input id="cc-cvc" formControlName="cvc" type="tel" 
    autocomplete="off" ccCvc>
      <!--add error on wrong formate of number using <div> -->
  </div> 

输入信用卡号
信用卡号码
到期日期
cvc

---

我会将姓名、地址、信用卡信息发送到服务器，并将其存储在SQL数据库中。我不确定这是否是最有效的方法。

我会创建一个信用卡服务并使用post到您的服务器端代码

类型：Ng g s“服务名称（将为信用卡）”--模块应用程序 创建信用卡服务

下面是一篇文章的示例，您需要设置正确的参数和URL以及预期的响应ApproveCreditCardResponse模型：

approve(creditCard: string, cvc: string): Observable<ApproveCreditCardResponse> {

    return <Observable<ApproveCreditCardResponse>> this.http.post(environment.apiBaseUrl + '/api/creditcardurl',
      {
        'creditCard': creditCard,
        'cvc': cvc
      });
   }

不要忘记在构造函数中导入服务：

private creditCardService: CreditCardService

---

如果你需要更多的帮助，请告诉我。这应该是一个很好的起点。

听说过吗？这是一罐你可能不想打开的虫子，但如果你想与银行合作，你就必须打开。Worldpay非常出色。他们有一个沙箱来测试信用卡界面。谢谢你。我找到了一个很棒的worldpay界面来测试我的信用卡应用程序。他们有一个网络SDK来测试它！

private creditCardService: CreditCardService