服务器端提交的条纹支付意图示例

Posted 2023-03-21

【中文标题】服务器端提交的条纹支付意图示例

【英文标题】：Stripe payment intents examples for server side submit

【发布时间】：2021-10-28 12:00:34

【问题描述】：

我正在研究带有支付意图 API 的 Stripe 支付网关。官方页面上的所有示例都包含带有功能的 jquery 提交示例 - payWithCard（功能名称）。

我们是否有任何示例可以在服务器上提交并在发送付款之前进行一些验证？

使用 Charge API，我们可以在服务器上发布数据，然后我们可以发送付款。

是否可以使用 Payment Intent API 或者我需要使用 Jquery？

【问题讨论】：

您是指稍后确认付款意图吗？ stripe.com/docs/api/payment_intents/confirm

@Alex，我正在尝试类似“Charge”的 API。一旦我们点击提交按钮，整个过程就会被发送到服务器端，但是使用支付 Intent API，点击提交按钮时，整个执行发生在客户端。

如果包含confirm=true，则无需单独确认：stripe.com/docs/api/payment_intents/…

如果您正在寻找 ASP.NET - C# 中 Stripe 的最新解决方案，请查看此演示：techtolia.com/Stripe

【参考方案1】：

您可以通过 Stripe 文档了解详细信息。在实现 Stripe 时，我们实际上同时使用了服务器端和 javascript。我在这里提供示例工作代码。

下载 Stripe 包，我在这里使用来自 Github 存储库的 php。

然后在html页面中使用下面的javascript

    function handleStripe()                

        var stripe = Stripe("STRIPE PUBLISHABLE KEY");

        var data = 
            "sess": "Some valuable data",
            "rcom": "Some valuable data"
        ;
    
        fetch("stripe-intent-book.php", 
            method: "POST",
            headers: 
                "Content-Type": "application/json"
            ,
            body: JSON.stringify(data)
        )
        .then(function(result) 
            return result.json();
        )
        .then(function(data) 
            var elements = stripe.elements(
                fonts: [
                    
                        cssSrc: 'https://fonts.googleapis.com/css?family=Quicksand',
                    ,
                ],
                locale: window.__exampleLocale,
            );         

            var elementStyles = 
                base: 
                    color: '#32325D',
                    fontWeight: 500,
                    fontFamily: 'Source Code Pro, Consolas, Menlo, monospace',
                    fontSize: '16px',
                    fontSmoothing: 'antialiased',

                    '::placeholder': 
                        color: '#CFD7DF',
                    ,
                    ':-webkit-autofill': 
                        color: '#e39f48',
                    ,
                ,
                invalid: 
                    color: '#E25950',

                    '::placeholder': 
                        color: '#FFCCA5',
                    ,
                ,
            ;

            var elementClasses = 
                focus: 'focused',
                empty: 'empty',
                invalid: 'invalid',
            ;
        
            var cardNumber = elements.create('cardNumber', 
                style: elementStyles,
                classes: elementClasses,
            );
            cardNumber.mount('#card-number');

            var cardExpiry = elements.create('cardExpiry', 
                style: elementStyles,
                classes: elementClasses,
            );
            cardExpiry.mount('#card-expiry');

            var cardCvc = elements.create('cardCvc', 
                style: elementStyles,
                classes: elementClasses,
            );
            cardCvc.mount('#card-cvc');
        
            var inputs = document.querySelectorAll('.stripeCC .input');
            Array.prototype.forEach.call(inputs, function(input) 
                input.addEventListener('focus', function() 
                    input.classList.add('focused');
                );
                input.addEventListener('blur', function() 
                    input.classList.remove('focused');
                );
                input.addEventListener('keyup', function() 
                    if (input.value.length === 0) 
                        input.classList.add('empty');
                     else 
                        input.classList.remove('empty');
                    
                );
            );

            cardNumber.on("change", function (event) 
                document.querySelector("button").disabled = event.empty;
                document.querySelector("#card-error").textContent = event.error ? event.error.message : "";
            );
        
            $('#submit').click(function() 
                payWithCard(stripe, cardNumber, data.clientSecret);
            );

        );
    
    

以及下面的服务器端PHP代码

    <?php   

        \Stripe\Stripe::setApiKey("Stripe Secret key");

        header('Content-Type: application/json');

        try 

            $json_str = file_get_contents('php://input');
            $json_obj = json_decode($json_str);
            $sess           = $json_obj->sess;
            $rcom           = $json_obj->rcom;
    
            $amt            = 10; /* Specify the amount to be charged here */
            $amt            = $amt * 100;

            $paymentIntent = \Stripe\PaymentIntent::create([
                'amount' => $amt,
                'currency' => 'gbp'
            ]);

            $output = [
                'clientSecret' => $paymentIntent->client_secret,
            ];

            echo json_encode($output);
         catch (Error $e) 
            http_response_code(500);
            echo json_encode(['error' => $e->getMessage()]);
        

    ?>

来自下面的 Stripe API 参考是 .Net 代码，请您通过Stripe API doc 请

    // Set your secret key. Remember to switch to your live secret key in production.
    // See your keys here: https://dashboard.stripe.com/apikeys
    StripeConfiguration.ApiKey = "sk_test_tR3PYbcVNZZ796tH88S4VQ2u";

    var options = new PaymentIntentCreateOptions
    
        Amount = 1099,
        Currency = "usd",
        PaymentMethodTypes = new List<string> 
            "card",
        ,
    ;

    var service = new PaymentIntentService();
    var intent = service.Create(options);

【讨论】：

payWithCard 函数是 jquery 函数如果我是对的并且我正在寻找服务器端的 MVC c#。

@Hector 编辑了我的答案以包含 .Net 代码。

@Subhasis 我已经看到了这段代码，但我想在服务器上发布自定义模型，我将在服务器上的支付页面中捕获它，然后从服务器发送支付确认，但我认为我们需要在 jquery 中处理所有内容使用新的 API。