Laravel的Stripe.js误差

Question

我似乎对Stripe.js有问题，我正在使用Laravel作为收银员的框架。

我使用的是stripe.js，所以我不会通过我的服务器传递和信用卡数据，所以我也不会存储任何数据。到目前为止，浏览器似乎存在问题。让我进一步解释一下，Chrome工作，Firefox，不工作。

Chrome上的：当前当您提交字段时，表单的行为与预期相同。当您按“提交”按钮时，它将显示卡错误。例如，卡号、过期月份等(它会验证它)。

火狐和IE上的：表单不会验证，相反它说：

A network error has occurred, and you have not been charged. Please try again.

并且会自动提交表单，而不知道卡号是否被接受等。此外，当您提交表单时，它会直接转到一个Laravel错误页面，页面上写着：

Missing required param: card

我认为这意味着stripe.js没有被充分使用，而且可能表单没有注意定制的js。

Stripe.js

$(document).ready(function() {
    Stripe.setPublishableKey('pk_test_HdoLAxfuWl53vjchF01fMphS');

    $('#subscription-form button').on('click', function() {
        var form                    = $('#subscription-form');
        var submit                  = form.find('button');
        var submitInitialText       = submit.text();

        submit.attr('disabled', 'disabled').text('Just one moment...');

        Stripe.card.createToken(form, function(status, response) {
            var token;
            if(response.error) {
                form.find('.stripe-errors').text(response.error.message).show();
                submit.removeAttr('disabled');
                submit.text(submitInitialText);
                return false;
            } else {
                token = response.id;
                form.append($('<input type="hidden" name="token">').val(token));
                form.submit();
            }
        });
    });
});

你可以去http://account.mcjoin.us试用这个应用程序，并更好地指导我可能出现的问题。永远，谢谢你的帮助！

Answer 1

我的问题的解决方案很明显: Internet和Firefox没有贬低e.preventDefault()；

这可能会让人困惑，但让我解释一下。在Chrome上，e.preventDefault()是不必要的，它所做的就是防止默认的表单函数。在Internet或Firefox上，如果不存在这种情况，Javascript将无法“劫持”表单并做它需要做的事情。为此，添加e.preventDefault()将使表单不存在默认交互。

现在让我们进一步研究一下代码，下面是stripe.js：

$(document).ready(function() {
    Stripe.setPublishableKey('pk_live_DdMQOXgak0v4yS0yH7vnsHqu');

    $('#subscription-form button').on('click', function(e) {
        var form = $('#subscription-form');
        var submit = form.find('button');
        var submitInitialText = submit.text();

        submit.attr('disabled', 'disabled').text('Just one moment...');
        e.preventDefault();

        Stripe.card.createToken(form, function(status, response) {
            var token;
            if(response.error) {
                form.find('.stripe-errors').text(response.error.message).show();
                submit.removeAttr('disabled');
                submit.text(submitInitialText);
            } else {
                token = response.id;
                form.append($('<input type="hidden" name="token">').val(token));
                form.submit();
            }

        });
    });
});

就这样!就这么简单！

Answer 2

我看了一下您的页面，但它需要身份验证。我怀疑你会得到这个结果，因为只有在火狐和IE上才会出现JavaScript错误，从而阻止了Stripe.js代码的工作。我会检查错误控制台。删除页面上的所有其他JavaScript并重新测试也将证实这一理论。

我还会更新您的服务器端代码，这样就不会在没有令牌的情况下进行收费尝试。

干杯，拉里

我在Stripe做支持工作。