创建使用已成功创建的令牌和stripe.js

时间:2019-02-18 20:58:05

标签: python django stripe-payments

我正在使用官方文档中的stripe元素来创建令牌。现在,我正在尝试在view.py中构建一个收费功能以对信用卡进行收费。但是,如何在我的views.js中从stripe.js中正确获取令牌,因为“ request.POST.get('stripeToken'):”在我的代码中不起作用。

我正在尝试在django中建立一个用户注册表单,在该表单中,用户在注册时需要支付一笔费用(不保存令牌以进行定期付款)。我现在正在尝试在views.py中构建收费功能,以使用已经成功创建的令牌向卡收费。我想将stripe元素与stripe.js一起使用的原因是美观的形式。 我对这种环境还比较陌生,因此我不知道该如何进行。 感谢您的提前帮助!

views.py

import stripe

def charge(request):
    # Set your secret key: remember to change this to your live secret key in production
    # See your keys here: https://dashboard.stripe.com/account/apikeys
    stripe.api_key = "sk_test_..."

    # Token is created using Checkout or Elements!
    # Get the payment token ID submitted by the form:
    if request.POST.get('stripeToken'):
        print(request.POST)
        token = request.POST.get('stripeToken')

        charge = stripe.Charge.create(
            amount=999,
            currency='usd',
            description='Boosted Post',
            source=token,
        )
        print('Charge:', charge)
        return HttpResponseRedirect('/')
    else:
        print('NO')

    context = {
        'amount': 999,
    }

    return render(request, 'subscribers/subscriber_new.html', context)


subscriber_new.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  {% load static %}
  <link rel="stylesheet" href="{% static 'css/stripe.css' %}">
</head>
<body>
  <form action="" method="POST">{% csrf_token %}
    <label>
      <div id="card-element" class="field is-empty"></div>
      <span><span>Credit or debit card</span></span>
    </label>
    <button type="submit">Pay $25</button>
    <div class="outcome">
      <div class="error" role="alert"></div>
      <div class="success">
        Success! Your Stripe token is <span class="token"></span>
      </div>
    </div>
    </form>
    <script src="https://js.stripe.com/v3/"></script>
    <script src="{% static 'js/stripe.js' %}"></script>
</body>
</html>


stripe.js

var stripe = Stripe('pk_test_...');
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');
    }
  });
});

function setOutcome(result) {
  var successElement = document.querySelector('.success');
  var errorElement = document.querySelector('.error');
  successElement.classList.remove('visible');
  errorElement.classList.remove('visible');

  if (result.token) {
    // Use the token to create a charge or a customer
    // https://stripe.com/docs/charges
    successElement.querySelector('.token').textContent = result.token.id;
    successElement.classList.add('visible');
  } else if (result.error) {
    errorElement.textContent = result.error.message;
    errorElement.classList.add('visible');
  }
}

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

document.querySelector('form').addEventListener('submit', function(e) {
  e.preventDefault();
  var form = document.querySelector('form');
  stripe.createToken(card).then(setOutcome);
});

已经成功创建令牌并且在条纹的仪表板中也可以看到令牌之后,收费功能应该获取令牌并成功为卡充值。 但是实际上,控制台直接显示了打印的“否”,浏览器立即重定向到home.html页面,甚至没有显示users_new.html文件,该文件可能会成功地在views.py文件中生成无需收费功能的令牌

0 个答案:

没有答案