Stripe Checkout: Something went wrong

I'm trying to integrate Stripe checkout (one time payment) into my angular application (deployed on firebase, with server backend on firebase functions), but my checkout gets stuck on stripe checkout page:

Something went wrong
You might be having a network connection problem, or the payment provider cannot be reached at the moment.

Here is my firebase functions code:

import * as functions from 'firebase-functions';

export const createStripeSessionTest = functions.https.onRequest(async (request, response) => {
  const STRIPE_SECRET_KEY = functions.config().stripe.test.secret;

  await execute(request, response, STRIPE_SECRET_KEY);
});

const execute = async (request: any, response: any, stripeSecretKey: string) => {
  const body = JSON.parse(request.body);

  const STRIPE_PRICE_ID = body.priceId
  const session = await createStripeSession(body, stripeSecretKey, STRIPE_PRICE_ID);

  response.setHeader('Access-Control-Allow-Origin', '*');
  response.setHeader('Access-Control-Allow-Methods', '*');
  response.setHeader("Access-Control-Allow-Headers", "X-Requested-With,Content-Type");

  response.send(session);
}

const createStripeSession = async (body: any, secretKey: string, priceId: string) => {

  const stripe = require('stripe')(secretKey);

  const session = await stripe.checkout.sessions.create({
    payment_method_types: ['card'],
    line_items: [{
      price: priceId,
      quantity: 1,
    }],
    mode: 'payment',
    success_url: body.success_url, //'https://example.com/success?session_id={CHECKOUT_SESSION_ID}',
    cancel_url: body.cancel_url, //'https://example.com/cancel',
  });

  return session;
}

I can confirm from firebase functions logs that I don't get any error there. Also, all the request parameters, e.g. priceId, are correctly populated (confirmed with console.log).

But I do see something on browser logs for stripe checkout page:

api.stripe.com/v1/payment_pages/cs_test_asdhfjkasfui32uhaisd:1 Failed to load resource: the server responded with a status of 401 ()

Any suggestions will be greatly appreciated. I've triple checked my keys and they all seem correctly configured.

I managed to fix it. Turns out, I was using NgxStripe library to initialize stripe, and was using stripe-js library directly in the application to invoke the checkout process.

Due to this the stripePublishableKey was never seen by stripe-js, which led to this key mismatch issue. (Hence the 401 - unauthorized error).

Passing stripePublishableKey directly into loadStripe(..) method (on client side) fixed the issue:

loadStripe('pk_test_mystripekey').then(
  stripe => this.stripe = stripe
).then(
  () => this.createStripeSession()
)

Stripe support said that a lot of these issue that are reported to them are indeed due to people using wrong publishableKey-secretKey combinations.