我正在使用官方文档中的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文件中生成无需收费功能的令牌>