本文介绍了在纯静态网站环境下，如何利用 Stripe Payment Link 实现商品售卖，并着重讨论了在不暴露 Stripe 密钥的前提下，客户端创建 Payment Link 的可行性。分析了直接在客户端使用密钥的风险，并提出了预先生成 Payment Link 或使用后端服务动态生成 Payment Link 的替代方案，同时建议对于高度定制化的购物车场景，直接使用 Checkout Sessions。
在构建静态网站，例如使用 GitHub Pages 托管的网站，并希望集成 Stripe 支付功能时，直接在客户端创建 Payment Link 可能会遇到安全问题。这是因为 Stripe API 需要使用密钥进行身份验证，而将密钥直接嵌入到客户端代码中会将其暴露给用户，存在极大的安全风险。
直接在客户端使用密钥的风险
直接在客户端代码中使用 Stripe 密钥（Secret Key）会带来以下风险：
- 密钥泄露： 任何查看网站源代码的人都可以轻松获取密钥，从而冒充你的身份进行恶意操作。
- 权限滥用： 即使使用限制性密钥（Restricted Key），攻击者仍然可能利用其权限进行破坏，例如停用所有 Payment Link。
解决方案：避免在客户端直接创建 Payment Link
由于安全风险，不建议直接在客户端创建 Stripe Payment Link。以下是几种替代方案：
1. 预先生成 Payment Link
对于商品种类较少，或者价格固定的情况，可以预先在 Stripe 后台创建 Payment Link，并将链接直接嵌入到网站中。这种方式不需要在客户端使用密钥，安全性较高。
优点：
- 安全性高，无需在客户端处理密钥。
- 实现简单，无需编写复杂的代码。
缺点：
- 不适用于商品种类繁多或价格经常变动的情况。
- 无法根据用户的购物车动态生成 Payment Link。
2. 使用后端服务动态生成 Payment Link
使用后端服务（例如 Node.js, Python, PHP 等）来处理 Payment Link 的创建。客户端将购物车信息发送到后端，后端使用 Stripe 密钥创建 Payment Link，并将链接返回给客户端，然后客户端重定向到 Stripe 结账页面。
优点：
- 安全性高，密钥保存在后端服务器上，不会暴露给客户端。
- 可以根据用户的购物车动态生成 Payment Link。
- 灵活性高，可以实现更复杂的业务逻辑。
缺点：
- 需要搭建和维护后端服务器。
- 增加了开发和部署的复杂性。
示例（后端代码，Node.js）：
const stripe = require('stripe')('YOUR_STRIPE_SECRET_KEY');
const express = require('express');
const app = express();
app.use(express.json());
app.post('/create-payment-link', async (req, res) => {
try {
const { line_items } = req.body;
const paymentLink = await stripe.paymentLinks.create({
line_items: line_items,
after_completion: {
type: 'redirect',
redirect: {
url: 'https://your-website.com/success',
},
},
});
res.json({ url: paymentLink.url });
} catch (error) {
console.error(error);
res.status(500).json({ error: error.message });
}
});
app.listen(4242, () => console.log('Running on port 4242'));客户端代码 (JavaScript):
async function createPaymentLink(cartItems) {
const response = await fetch('/create-payment-link', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
line_items: cartItems.map(item => ({
price: item.price_id, // 假设你的商品在 Stripe 中有 price_id
quantity: item.quantity,
})),
}),
});
const data = await response.json();
if (data.url) {
window.location.href = data.url;
} else {
console.error('Failed to create payment link:', data.error);
}
}
// 示例用法：
const cart = [
{ price_id: 'price_123', quantity: 2 },
{ price_id: 'price_456', quantity: 1 },
];
createPaymentLink(cart);3. 使用 Checkout Sessions
如果需要根据用户的购物车动态生成 Payment Link，并且对购物车中的商品有高度定制化的需求，建议直接使用 Stripe Checkout Sessions。Checkout Sessions 提供了更灵活的支付流程控制，可以更好地满足复杂业务场景的需求。
优点：
- 灵活性高，可以实现复杂的支付流程。
- 支持多种支付方式。
- 安全性高，Stripe 负责处理支付流程，无需自己处理敏感信息。
缺点：
- 配置较为复杂。
- 需要对 Stripe Checkout Sessions 有一定的了解。
总结
在客户端创建 Stripe Payment Link 会带来安全风险，建议采用预先生成 Payment Link 或使用后端服务动态生成 Payment Link 的方案。对于高度定制化的购物车场景，直接使用 Checkout Sessions 可能是更好的选择。选择哪种方案取决于你的具体需求和技术能力。始终牢记安全性，避免在客户端暴露任何敏感信息。
