条带MVC密钥未定义|无法从控制器传递ClientSecret密钥| Asp.net MVC

Question

我正在研究一个代码，采取在ASP.net框架MVC应用付款。在没有使用旧API createtoken()的SCA方法的情况下，代码工作正常，正在生成付款，但我需要添加3d安全功能，因此需要PaymentIntent() CreatePaymentIntent。我无法传递我的PI密钥，它仍未定义。以下是我的代码

index.cshtml

<div class="col-md-6">
            <form>
                <h1 style="color:white"> Payment Details £<span class="faretxt"></span></></h1>

                <label>
                    <h4 class="errormessage alert-danger"></h4>
                </label>
                <label>
                    <input class="field is-empty" id="faretxt" value="" type="hidden" />
                    <div id="card-element" class="field is-empty"></div>
                    <span><span>Credit or debit card</span></span>
                </label>
                <label>
                    <h4 class="errormessage alert-danger"></h4>
                </label>
                <div class="outcome">
                    <div class="error" role="alert"></div>
                    <div class="success">
                        Success! Your Stripe token is <span class="token"></span>
                    </div>
                </div>
                <button id="btnsubmit" type="button">Pay £<span class="faretxt"></span></button>
            </form>
  </div>

脚本：

<script src="https://js.stripe.com/v3/"></script>
var stripe = Stripe('######');
    var elements = stripe.elements();

    var card = elements.create('card', {
        iconStyle: 'solid',
        style: {
            base: {
                iconColor: '#8898AA',
                color: 'white',
                lineHeight: '36px',
                fontWeight: 300,
                fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
                fontSize: '19px',

                '::placeholder': {
                    color: '#8898AA',
                },
            },
            invalid: {
                iconColor: '#e85746',
                color: '#e85746',
            }
        },
        classes: {
            focus: 'is-focused',
            empty: 'is-empty',
        },
    });
    card.mount('#card-element');
    var inputs = document.querySelectorAll('input.field');
    Array.prototype.forEach.call(inputs, function (input) {

        input.addEventListener('focus', function () {
            input.classList.add('is-focused');
        });
        input.addEventListener('blur', function () {
            input.classList.remove('is-focused');
        });
        input.addEventListener('keyup', function () {
            if (input.value.length === 0) {
                input.classList.add('is-empty');
            } else {
                input.classList.remove('is-empty');
            }
        });
    });

    

    card.on('change', function (event) {
        setOutcome(event);
    });

   // document.querySelector('form').addEventListener('submit', function (e) {
    $('#btnsubmit').click(function (e) {
        //e.preventDefault();

        $(this).attr("disabled", true);

        var form = document.querySelector('form');
        var extraDetails = {
            //name: form.querySelector('input[name=cardholder-name]').value,
        };

        Swal.fire({
            title: 'Please Wait ..submit last code.',
            onBeforeOpen() {
                Swal.showLoading()
            },
            onAfterClose() {
                Swal.hideLoading()
            },
            allowOutsideClick: false,
            allowEscapeKey: false,
            allowEnterKey: false,
            showConfirmButton: false,
            showCancelButton: false,
        });
        console.log("Working till here: ") ;

       // stripe.createToken(card, extraDetails).then(setOutcome);
        payWithCard(stripe, card, clientSecret);


       



        var payWithCard = function (stripe, card, clientSecret) {
            debugger
            stripe
                .confirmCardPayment(clientSecret, {
                    payment_method: {
                        card: card
                    }
                })
                .then(function (result) {
                    if (result.error) {
                        // Show error to your customer
                        showError(result.error.message);
                    } else {
                        // The payment succeeded!
                        orderComplete(result.paymentIntent.id);
                    }
                });
        };
       });

HomeController.cs

     public ActionResult Create(string clientSecret, string amount, string jobref){
 StripeConfiguration.ApiKey = "####";
        Description = "testt"
        double amountcal = Math.Round(Convert.ToDouble(amount));
     
        var services = new PaymentIntentService();
        var opt = new PaymentIntentCreateOptions
        {
            Amount = long.Parse(amountcal.ToString()) * 100,
            Currency = "GBP",
            Description = description,
        };
        var paymentIntent = services.Create(opt);

        //clientSecret = paymentIntent.clientSecret;
        return Json(new { clientSecret = paymentIntent.ClientSecret });

我无法获取客户端密钥。任何帮助都将不胜感激。

Answer 1

现在，您的javascript代码并未尝试从您的后端端点获取客户端密码，这就是它未定义的原因。您需要实现以下内容：

fetch("/create-payment-intent", {
  method: "POST",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify(purchase)
})
  .then(function(result) {
    return response.json();
  })
  .then(function(data) {
    // Use data.client_secret to confirm the card payment.
  };

你可以在https://stripe.com/docs/payments/integration-builder的集成构建器中看到完整的样例