title: Stripe Checkout: Something went wrong
body: <p>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:</p>
  <pre><code>Something went wrong
  You might be having a network connection problem, or the payment provider cannot be reached at the moment.
  </code></pre>
  <p><a href="https://i.stack.imgur.com/X29U1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/X29U1.png" alt="enter image description here" /></a></p>
  <p>Here is my firebase functions code:</p>
  <pre class="lang-js prettyprint-override"><code>import * as functions from 'firebase-functions';
  
  export const createStripeSessionTest = functions.https.onRequest(async (request, response) =&gt; {
    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) =&gt; {
    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(&quot;Access-Control-Allow-Headers&quot;, &quot;X-Requested-With,Content-Type&quot;);
  
    response.send(session);
  }
  
  const createStripeSession = async (body: any, secretKey: string, priceId: string) =&gt; {
  
    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;
  }
  </code></pre>
  <p>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).</p>
  <p>But I do see something on browser logs for stripe checkout page:</p>
  <pre><code>api.stripe.com/v1/payment_pages/cs_test_asdhfjkasfui32uhaisd:1 Failed to load resource: the server responded with a status of 401 ()
  </code></pre>
  <p>Any suggestions will be greatly appreciated. I've triple checked my keys and they all seem correctly configured.</p>