i am stuck here for a while now.
I have this simple button in vanilla
<td><button class="button_accept" onclick="acceptInvite(event, 0)" type="submit">accept</button></td>
It fires this script:
async function LoadPaymentController(){
var stripe = Stripe('testKey');
// Call your backend to create the Checkout Session
fetch('/create-checkout-session', {
method: 'POST',
})
.then(function(response) {
return response.json();
})
.then(function(session) {
return stripe.redirectToCheckout({ sessionId: session.id });
})
.then(function(result) {
// If `redirectToCheckout` fails due to a browser or network
// error, you should display the localized error message to your
// customer using `error.message`.
if (result.error) {
alert(result.error.message);
}
});
}
But whenever I click this, firefox tells me that:
Stripe.js requires 'allow-same-origin' if sandboxed.
I spoke to a dev from the stripe team and I googled my ass off and it always says that I have to add the sandbox="allow-same-origin" attribute to my iframe.
But I am not using an iframe.
Adding this attribute to everything else also didnt work at all.
What am I missing?
I tried:
<meta http-equiv="Content-Security-Policy" content="allow-same-origin">
<script src="https://js.stripe.com/v3/"></script>
To no avail