我正在使用 React-Static 构建一个小型网站。网站已全部建成,但我需要集成基本的捐赠功能。我有几个问题让我很困惑。按照 Thomasz Jancuk 的指南,我遇到了一些障碍。
1.) 当页面最初加载为 html 时,会创建按钮。然而,一旦做出反应,它就会删除我的按钮。我想我需要通过 React 而不是当前的内联来集成表单 JS。
<form action="WEBTASK.IO_URL" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key={my_public_stripe_key}
data-image=""
data-name=""
data-description=""
data-amount="2500"
data-zip-code="true"
data-currency="usd"
data-locale="auto"
data-panel-label="Donate"
data-label="">
</script>
</form>
2.)如果我强制一个按钮并单击它,我会通过最初的 Stripe Checkout 内容并将其发布到 webtask.io url。但是我收到一个错误:
"code": 500,
"error": "Script generated an unhandled synchronous exception.",
"details": "TypeError: Cannot read property 'stripeToken' of undefined"
这是我的 webtask.io 脚本。我已经包含了 NPM 模块和正确的秘密。
'use latest';
import bodyParser from 'body-parser';
import stripe from 'stripe';
bodyParser.urlencoded();
module.exports = function (ctx, req, res) {
stripe(ctx.secrets.stripeSecretKey).charges.create({
amount: 2500,
currency: 'usd',
source: ctx.body.stripeToken,
description: 'Contribute to the Campaign'
}, function (error, charge) {
var status = error ? 400 : 200;
var message = error ? error.message : 'Thank You for your Contribution!';
res.writeHead(status, { 'Content-Type': 'text/html' });
return res.end('<h1>' + message + '</h1>');
});
};