Stripe.js requires 'allow-same-origin' if sandboxed

I am trying to open the payment gateway (checkout page) of stripe js. I did this:

 async function LoadPaymentController(){
      var stripe = Stripe('pk_test_51JBxkrB1SsiUQAfnzEWMqNgSCr9yV7tvULhePuQxwP3iCVr1kkNZskUA51TOtE5gw7f1X1ZSw41FKbHoIAHDolgI00DStmrT1m');
    // 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);
      }
    });
    }

This function is called when a button is clicked in my page. But it returns the error

Stripe.js requires 'allow-same-origin' if sandboxed

When I google that, I only find examples of this being used inside an iframe, which I am not doing.

Can anyone help me out here?

from Stripe.js requires 'allow-same-origin' if sandboxed