嘿，我之前也碰到过这个困扰！你用的是Stripe的Legacy Checkout（也就是checkout.js），这个版本里直接在前端判断支付成功确实有点绕——因为你拿到的token其实只是用户授权的支付令牌，并不代表支付已经真正完成，真正的支付确认是要在你的后端完成的。所以要执行支付成功后的自定义JS，得这么做：

核心思路 #

前端拿到token后，把它传给你的后端接口，后端调用Stripe的API完成支付（比如创建Charge或者PaymentIntent），等后端确认支付成功后，再给前端返回响应，前端在这个响应的回调里执行自定义逻辑。

具体修改步骤 #

修改你代码里的token回调函数，加入向后端发送请求并处理响应的逻辑：

var handler = StripeCheckout.configure({
  key: 'MY_KEY',
  image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
  locale: 'auto',
  token: function(token) {
    // 把token和支付信息传给后端
    fetch('/your-backend-charge-endpoint', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        tokenId: token.id,
        amount: 25000, // 金额和前端保持一致，或者后端自行处理
        description: '1 Day Bike Hire'
      })
    })
    .then(response => response.json())
    .then(result => {
      if (result.success) {
        // 这里就是支付成功后的自定义JS代码！
        console.log('Payment went through!');
        // 示例：显示感谢弹窗、更新页面内容、跳转到成功页
        alert('Thanks for your booking!');
        document.getElementById('customButton').textContent = 'Booking Completed';
        // 或者 window.location.href = '/success-page';
      } else {
        // 处理支付失败的情况
        alert(`Payment failed: ${result.errorMessage}`);
      }
    })
    .catch(error => {
      // 处理网络请求失败的情况
      alert(`Oops, something went wrong: ${error.message}`);
    });
  }
});

关键注意事项 #

• 不要只依赖前端的token回调：因为即使拿到了token，后端可能因为用户余额不足、Stripe风控拦截等原因支付失败，必须等后端确认支付成功后再执行前端逻辑。
• 如果你想更可靠地接收支付成功通知，推荐用Stripe的Webhook：后端监听Stripe发送的charge.succeeded事件，然后可以通过WebSocket或者前端轮询的方式通知前端执行自定义代码。不过对于单个产品的简单场景，上面的方法已经足够好用。
• 另外提一句：Stripe现在已经不推荐使用checkout.js这个旧版本了，新的Stripe Checkout（比如Redirect Checkout或者Elements）有更完善的成功回调机制，但如果你暂时不想升级，上面的方案完全可以解决问题。

内容的提问来源于stack exchange，提问作者User_FTW