Stripe PaymentIntent Card how to implement?

Question

I'm trying to implement payments on stripe with PaymentIntent API. My problem is that I don't find where/how to feed the card details (number, exp_year, exp_month, cvc) for the PaymentIntent.

Here's my code https://github.com/rever96/example-stripe-paymentIntent that create the PaymentIntent, and than confirm it. The confirm change the status to succeded. So that makes me think: "Wow, it's working!" But what about card details?

Thats the server code interested:

const stripe = require('stripe')('sk_test_4eC39HqLyjWDarjtT1zdp7dc');

app.post("/createPayment", (req, res) => {
    console.log('i\'m trying to create a paymentIntent');
    (async () => {
        paymentIntent = await stripe.paymentIntents.create({
            amount: 1099,
            currency: 'eur',
            payment_method_types: ['card'],
        }).then(paymentIntentResponse => {
            console.log("paymentIntent created");
            res.send(paymentIntentResponse)
        });
    })();
});

app.post("/confirmPayment", (req, res) => {
    console.log(req.body);
    (async () => {
        paymentIntent = await stripe.paymentIntents.confirm(req.body.id, { payment_method: 'pm_card_visa' })
            .then(paymentIntentResponse => {
                console.log("paymentIntent confirmed");
                res.send(paymentIntentResponse)
            });
    })();
});

and that's the client code interested:

constructor(
    private http: HttpClient) {
  }
  ngOnInit() {
    this.http.post('http://localhost:8080/createPayment', {}).subscribe(res => {
      console.log('back from server!');
      console.log(res);
      this.paymentIntentID = res['id'];
      this.paymentIntentClientSecret = res['client_secret'];
    });
  }

  submitPaymentData() {
    this.collectCardDetails();
    console.log('confirm payment');
    this.http.post('http://localhost:8080/confirmPayment', { id: this.paymentIntentID }).subscribe(res => {
      console.log('back from server!');
      console.log(res);
    });
  }

Paul Asjes Paul Asjes · Accepted Answer · 2019-05-08T13:53:56

The flow of PaymentIntents generally goes:

Create PaymentIntent on the server
Pass client secret to frontend
Use Stripe Elements to collect card info
Use Stripe.js handleCardPayment to process the payment

You've done step 1, you need to complete the rest: https://stripe.com/docs/payments/payment-intents/quickstart#passing-to-client

Stripe PaymentIntent Card how to implement?

1 Answers