Stripe checkout - IE 弹出窗口在第二次付款时被阻止答案

【问题标题】：Stripe checkout - IE popup is blocked on second paymentStripe checkout - IE 弹出窗口在第二次付款时被阻止
【发布时间】：2018-03-06 06:51:46
【问题描述】：

O/S：BrowserStack Live

浏览器：IE11

我正在使用带有 js sdk 的 Stripe checkout 来在用户单击按钮时显示一个弹出窗口。代码如下：

Payment.prototype = {
    pay: function (options, callback) {
        let tokenTriggered = false;
        _handler = StripeCheckout.configure({
            key: Constants[Constants.ENV].STRIPE_KEY,
            image: 'image.jpg',
            locale: 'auto',
            token: function token(token) {
                tokenTriggered = true;
                const data = {
                    stripeToken: token.id,
                    stripeEmail: token.email,
                    amount: options.amount,
                    currency: CURRENCY,
                    capture: options.capture
                };
                $.ajax({
                    type: 'POST',
                    data: JSON.stringify(data),
                    contentType: 'application/json',
                    url: '/api/stripe',
                    success: function success(charge) {
                        callback(null, charge);
                    },
                    error: function error(error) {
                        callback(error.responseText);
                    }
                });
            },
            closed: function () {
                if (!tokenTriggered) {
                    // close button click behavior goes here
                    callback(1);
                }
            }
        });
    },
    open: function (amount, name, description) {
        // Open Checkout with further options:
        _handler.open({
            name: name,
            description: description,
            zipCode: true,
            currency: 'aud',
            amount: amount
        });
    }
};

调用“支付”函数，然后调用“打开”函数。我的应用程序的工作流程要求用户在一个会话中支付两次费用。在 IE11 中，第二次付款时不会显示 Stripe 弹出窗口。有什么想法吗？

下面的 url https://stripe.com/docs/checkout 解释了“handler.open”代码不应该在回调中，它不是。

控制台错误是：“SCRIPT70: Permission denied”。

** 编辑 07/03/2017 **

仅在以下情况下才会出现此错误：付款，导航到另一个页面，然后尝试进行另一次付款。

【问题讨论】：

我尝试在 JSFiddle 中重现您的错误，但无法 - 结帐仍在 IE11 中打开两次。你能制作一个带有错误的 JSFiddle 给我看吗？
@postmoderngres 感谢您设置小提琴，我添加了有关我的情况的更多信息。

标签： javascript stripe-payments stripe.js

【解决方案1】：

我通过在加载网站时仅初始化一次 StripeCheckout 来解决此问题。然后，我将功能从“StripeCheckout.configure”移到“handler.open”函数中，并在需要付款时调用它。

    init: function () {
        _handler = StripeCheckout.configure({
            key: Constants[Constants.ENV].STRIPE_KEY,
            image: 'image.jpg',
            locale: 'auto'
        });
    },
    open: function (options, callback) {
        let tokenTriggered = false;
        // Open Checkout with further options:
        _handler.open({
            name: 'An app',
            description: options.description,
            zipCode: true,
            currency: CURRENCY,
            amount: options.amount,
            token: function token(token) {
                tokenTriggered = true;
                const data = {
                    stripeToken: token.id,
                    stripeEmail: token.email,
                    amount: options.amount,
                    currency: CURRENCY,
                    capture: options.capture
                };
                $.ajax({
                    type: 'POST',
                    data: JSON.stringify(data),
                    contentType: 'application/json',
                    url: '/api/stripe',
                    success: function success(charge) {
                        // _instantiated = true;
                        callback(null, charge);
                    },
                    error: function error(error) {
                        callback(error.responseText);
                    }
                });
            },
            closed: function () {
                if (!tokenTriggered) {
                    // close button click behavior goes here
                    callback(1);
                }
            }
        });
    },

【讨论】：