带加载屏幕的 Stripe Checkout API 上的模棱两可的关闭回调

Question

Stripe Checkout 关闭回调中有什么方法可以确定它是如何触发的？

例如，当有人单击结帐按钮时，我会触发以下代码：

        // fade in our loading screen
        $("#loading-screen").stop(true,true).fadeIn(200);

        var handler = StripeCheckout.configure({
            key: STRIPE_PUBLISHABLE_KEY,
            image: STRIPE_ICON,
            closed: function () {
                // if user clicks close button, also hide the loading screen
                $("#loading-screen").stop(true,true).fadeOut(200);
            },
            token: function(token) {
                // post payment info back to the server via ajax
                var data = {
                    action : 'checkout',
                    paymentToken: token.id
                };
                $.post(
                    ajaxurl,
                    data,
                    function (response) {
                        // after response from server, fade out loading screen and update page or trigger error
                        $("#loading-screen").stop(true,true).fadeOut(200);
                        if (response.success) {
                            $("#checkout-form").html(response.output);
                        } else {
                            alert("unknown error. try again later.");
                        }
                    },
                    "json"
                );

            }

这里的想法是，当我单击支付窗口上的关闭按钮，或者一旦我从服务器获得某种响应，加载屏幕就会消失。

但是，close 回调似乎不仅会在有人点击关闭按钮时触发，而且会在 Stripe 端的付款成功完成之后，但在我的 ajax 调用完成之前触发。

因此，加载屏幕会在操作完成之前被移除，这让用户感到困惑。显然可以做一些事情来优化服务器端的慢速命令，但我也想尝试在客户端解决这个问题。

所以基本上，我需要找到一种方法来区分通过取消按钮关闭和通过成功付款关闭，不幸的是，Stripe Checkout Documentation 没有提供有关该过程的大量详细信息。

有什么建议吗？

---

更新：

我想我可能已经找到了一种方法，但这取决于令牌回调总是在关闭回调之前发生。

基本上我只是设置了一个标志来指示是否触发了令牌回调。

        var token_triggered = false;

        // fade in our loading screen
        $("#loading-screen").stop(true,true).fadeIn(200);

        var handler = StripeCheckout.configure({
            key: STRIPE_PUBLISHABLE_KEY,
            image: STRIPE_ICON,
            closed: function () {
                // if user clicks close button, also hide the loading screen
                if (!token_triggered) {
                    $("#loading-screen").stop(true,true).fadeOut(200);
                }
            },
            token: function(token) {
                token_triggered = true;
                // post payment info back to the server via ajax
                var data = {
                    action : 'checkout',
                    paymentToken: token.id
                };
                $.post(
                    ajaxurl,
                    data,
                    function (response) {
                        // after response from server, fade out loading screen and update page or trigger error
                        $("#loading-screen").stop(true,true).fadeOut(200);
                        if (response.success) {
                            $("#checkout-form").html(response.output);
                        } else {
                            alert("unknown error. try again later.");
                        }
                    },
                    "json"
                );

            }

在我完成的几个测试中，它似乎工作正常，但是有没有人知道是否有任何保证令牌在关闭之前总是会触发？

---

更新 #2：

在freenode的#stripe频道询问后，我被告知as of April 6, it appears Stripe has ensured that token always will fire prior to closed.

所以我相信这解决了我的问题并让我能够区分这两个事件。

Answer 1

正如我在上面的更新中指出的那样，从 2015 年 4 月 6 日起，令牌回调应始终在关闭回调之前触发。这意味着我们可以设置一个标志来指示是否触发了令牌回调，从而使我们能够区分事件。

var token_triggered = false;
var handler = StripeCheckout.configure({
     ...
     closed: function() {
          if (!token_triggered) {
              // close button click behavior goes here
          } else {
              // payment completion behavior goes here
          }
     },
     token: function(token) {
          token_triggered = true;
     }
     ...
});