Search code examples
angularjsstripe-paymentscheckoutstripes

Stripe integration with angularjs

Currently I am using legacy checkout form of stripe ( open in popup ) in angularjs, and now I want to upgrade the stripe to version 3 with redirectToCheckout flow.

How to integrate Stripe v3 in angularjs with custom product? I can't add all my products in the stripe.

My current code is like :

var stripe = Stripe(data.stripeKey);

           stripe
           .redirectToCheckout({
             lineItems: [
               // Replace with the ID of your price
               // Here i want to add custom product names and price for that product
               {price: "123", quantity: 1},
             ],
             mode: 'payment',
             successUrl: 'https://your-website.com/success',
             cancelUrl: 'https://your-website.com/canceled',
           })
           .then(function(result) {
             // If `redirectToCheckout` fails due to a browser or network
             // error, display the localized error message to your customer
             // using `result.error.message`.
           });

And also, angularjs is a front end of restapi so, everything is managed by the request and response so, how to implement the charge and capture flow in this? ( can this be achieved without webhooks? )

Solution

  • You can't use 'ad-hoc' prices with the client-only redirectToCheckout. Instead you'd need to introduce a server-side component to create a Checkout Session, where you can use the price_data parameter.