Payment Intent Stripe Strong Customer Authentication (SCA)
Stripe
Stripe javascript

To start you need to add the following in every page on your site, in doing so, it helps keep your site PCI compliant.

<script src="https://js.stripe.com/v3/"></script>

Create Payment of Intent

Every time you update your basket or additional add shipping fees, you need to update you Intent and add it to your form.

public static class StripePayment
    {
        public static string PaymentOfIntent()
        {
            StripeConfiguration.ApiKey  = "****";
            var service                 = new PaymentIntentService();
            var option                  = new PaymentIntentCreateOptions
            {
                Amount              = 29805,
                Currency            = "gbp",
                PaymentMethodTypes  = new List<string> {"card"}
            };
            string intentId = service.Create(option).ClientSecret;

            return intentId;
        }
}

Custom JavaScript

Here is the custom code that this demo uses to call the stripe.handleCardPayment.

var stripe = Stripe('***');
var elements = stripe.elements();
var cardElement = elements.create('card');
cardElement.mount('#card-element');

var cardholderName = document.getElementById('cardholder-name');
var cardButton = document.getElementById('card-button');
var clientSecret = cardButton.dataset.secret;

cardButton.addEventListener('click', function (ev) {
    ev.preventDefault();
    stripe.handleCardPayment(
        clientSecret, cardElement, {
            payment_method_data: {
                billing_details: { name: cardholderName.value }
            }
        }
    ).then(function (result) {
        if (result.error) {
            alert("Failed");
        } else {
            alert("The payment has succeeded. Display a success message.");
        }
    });
});

Strong Customer Authentication (SCA)
Fulfillment

You should not attempt to handle the fulfilment on the client, instead create a webhook so that Stripe can make an API call and handle the fulfilment there.

using System;
using System.IO;
using System.Web.Mvc;
using Stripe;

namespace Web.Stripe.Controllers
{
    public class StripeWebhookController : UmbracoApiController
    {
        [HttpPost]
        public string Post()
        {
           var stripeEvent = StripeWebhook.GetWebHookStripeEvent();

            return "whatever";
        }
    }
    public static class StripeWebhook
    {
        private const string WhSecret = "***";
        public static string GetWebHookStripeEvent()
        {
            var json = new StreamReader(HttpContext.Current.Request.InputStream).ReadToEnd();
            var stripeEvent = EventUtility.ConstructEvent(json, HttpContext.Current.Request.Headers["Stripe-Signature"], WhSecret);

            PaymentIntent intent;
            string paymentId = "";
            switch (stripeEvent.Type)
            {
                case "payment_intent.succeeded":
                    intent = (PaymentIntent) stripeEvent.Data.Object;
                    paymentId = $"Payment success for {intent.Id}";
                    break;
                case "payment_intent.payment_failed":
                    intent = (PaymentIntent)stripeEvent.Data.Object;
                    paymentId = $"Payment failed for {intent.Id}";
                    break;
                default:
                    //DO SOMETHING
                    break;
            }

            return paymentId;
    }
}

In my developer Stripe account, I can now see that the payment has been made successfully.

Blog Form

 Please complete the required fields (*required)

 *
*