I've added a checkout button for Stripe but nothing happens when I click on it? Here is my code but I can't see anything wrong:
<?php
namespace Phppot;
require_once __DIR__.'/Common/Config.php';
?>
<html>
<title>Stripe Prebuilt Hosted Checkout</title>
<head>
<link href="css/style.css" type="text/css" rel="stylesheet" />
<script src="https://js.stripe.com/v3/"></script>
</head>
<body>
<div class="phppot-container">
<h1>Stripe Prebuilt Hosted Checkout</h1>
<div id="payment-box">
<img src="<?php echo Config::PRODUCT_IMAGE; ?>" />
<h4 class="txt-title"><?php echo Config::PRODUCT_NAME; ?></h4>
<div class="txt-price">$<?php echo Config::PRODUCT_PRICE; ?></div>
<button id="checkout-button">Checkout</button>
</div>
</div>
<script>
var stripe = Stripe('<?php echo Config::STRIPE_PUBLISHIABLE_KEY; ?>');
var checkoutButton = document.getElementById('checkout-button');
checkoutButton.addEventListener('click', function() {
fetch('ajax-endpoint/create-checkout-session.php', {
method: 'POST',
})
.then(function(response) {
return response.json();
})
.then(function(session) {
return stripe.redirectToCheckout({ sessionId: session.id });
})
.then(function(result) {
if (result.error) {
alert(result.error.message);
}
})
.catch(function(error) {
console.error('Error:', error);
});
});
</script>
</body>
</html>
I've been following the phppot tutorial https://phppot.com/php/stripe-one-time-payment-with-prebuilt-hosted-checkout-in-php/ and sure everything is there? It just seem to be linking up?
question from:
https://stackoverflow.com/questions/65901124/unable-to-click-on-stripe-checkout-button 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
