Ошибка «Требуется карта» при интеграции платежного шлюза Stripe в угловой 6 - PullRequest
Новая
       12

Ошибка «Требуется карта» при интеграции платежного шлюза Stripe в угловой 6

0 голосов
/ 07 января 2019

Здесь я пытаюсь интегрировать полосовой платежный шлюз в угловой версии с .net core. ниже моя часть интеграции. Добавление ниже кода, связанного с изменением кода, в мой файл index.html. 

<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
  <script type="text/javascript">
    Stripe.setPublishableKey('pk_test_o8SJmIFp8LKkBw9WAmjn8Al9');
  </script>

Мой файл component.html. 

<form [formGroup]="paymentForm" (ngSubmit)="purchaseTicket()" #formDir="ngForm">
    <span class="payment-message">{{message}}</span>
    <div class="form-row">
      <label>
        <span>Card Number</span>
        <input formControlName="cardNumber" name="card-number" type="text" size="20" data-stripe="number">
      </label>
    </div>
    <div class="form-row">
      <label>
        <span>Expiration (MM/YY)</span>
        <input formControlName="expiryMonth" name="expiry-month" type="text" size="2" data-stripe="exp_month">
      </label>
      <span> / </span>
      <input formControlName="expiryYear" name="expiry-year" type="text" size="2" data-stripe="exp_year">
    </div>
    <div class="form-row">
      <label>
        <span>CVC</span>
        <input formControlName="cvc" name="cvc" type="text" size="4" data-stripe="cvc">
      </label>
    </div>
    <input type="submit" value="Submit Payment">
  </form>

код component.ts как ниже. 

loginForm: FormGroup;
 myAppUrl: string = "";
  constructor(private formBuilder: FormBuilder,private _zone: NgZone, private _http: Http){
    this.myAppUrl = "https://localhost:44303/";
  }
  ngOnInit() {
    this.loginForm = this.formBuilder.group({
      cardNumber: [null,],
      expiryMonth: [null,],
      expiryYear: [null,],
      cvc:[null,]

    });

 }

  public model: any;
  public card: any;
  public errorMessage: string;
  public successMessage: string;
  cardNumber: string;
  expiryMonth: string;
  expiryYear: string;
  cvc: string;
  message: string;

  purchaseTicket() {
    console.log("clicked");
    (<any>window).Stripe.card.createToken(
      this.card,
      (status: number, response: any) => {
        if (status === 200) {
          this.model.token = response.id;
          this._http
            .get(this.myAppUrl + 'api/stripe/Pay')
            .subscribe(
              result => {
                this.successMessage = 'Thank you for purchasing a ticket!';
                console.log(this.successMessage);
              },
              error => {
                this.errorMessage = 'There was a problem registering you.';
                console.error(error);
              }
            );
        } else {
          this.errorMessage = 'There was a problem purchasing the ticket.';
          console.error(response.error.message);
        }
      }
    );
  }

и теперь, когда я выполняю этот код, он выдает мне ошибку: «Ошибка ОШИБКИ: требуется карта» , которая является переменной, объявленной внутри моего класса компонентов. Поскольку я пытался присвоить номер карты той же переменной, но все равно он показывает ту же ошибку.

Это статья, которой я следовал

...