title: Stripe redirectToCheckout error. Will not load stripe checkout when I click the button to submit
body: <p>So I've set everything up with stripe to load when I hit submit in my checkout page in react however, I only seem to get this error below. On the stripe dashboard I can see that the POST request is status 200 and the email I am using along with price from the basket etc is reaching stripe. I just don't seem to have the checkout loading. I have compared my code with a guide I'm using and it matches word for word, is it because it's a different version, or am I missing something?</p>
  <p><strong>This is the error I am getting.</strong></p>
  <pre><code>Uncaught (in promise) IntegrationError: stripe.redirectToCheckout: You must provide one of lineItems, items, or sessionId.
  at v (v3:1)
  at g (v3:1)
  at j (v3:1)
  at t.a (v3:1)
  at u (v3:1)
  at e.redirectToCheckout (v3:1)
  at handleGuestCheckout (stripe-checkout.jsx:32)
  </code></pre>
  <p><strong>This is the checkout.js server file</strong></p>
  <pre><code>
  async function createCheckoutSession(req, res) {
      const domainUrl = process.env.WEB_APP_URL;
      const { line_items, customer_email } = req.body;
      // check req body has line items and email
      if (!line_items || !customer_email) {
          return res.status(400).json({ error: 'missing required session parameters' });
      }
  
      let session;
  
      try {
          session = await stripeAPI.checkout.sessions.create({
              payment_method_types: ['card'],
              mode: 'payment',
              line_items,
              customer_email,
              success_url: `${domainUrl}/success?session_id={CHECKOUT_SESSION_ID}`,
              cancel_url: `${domainUrl}/canceled`,
              shipping_address_collection: { allowed_countries: ['GB', 'US'] }
          });
          res.status(200).json({ sessionID: session.id,});
      } catch (error) {
          console.log(error);
          res.status(400).json({ error: 'an error occured, unable to create session' });
      }
  }
  
  module.exports = createCheckoutSession;
  </code></pre>
  <p><strong>And this is the stripe-checkout.jsx file in react</strong></p>
  <pre><code>import React, { useContext, useState } from 'react';
  import { useStripe } from '@stripe/react-stripe-js';
  import { CartContext } from '../../../context/cart-context';
  import { fetchFromAPI } from '../../../helpers';
  
  const StripeCheckout = () =&gt; {
    const [email, setEmail] = useState('');
    const { cartItems } = useContext(CartContext);
    const stripe = useStripe();
    const handleGuestCheckout = async (e) =&gt; {
      e.preventDefault();
      const line_items = cartItems.map(item =&gt; {
        return {
          quantity: item.quantity,
          price_data: {
            currency: 'usd',
            unit_amount: item.price * 100, // amount is in cents
            product_data: {
              name: item.title,
              description: item.description,
              images: [item.imageUrl], 
            }
          }
        }
      });
  
      const response = await fetchFromAPI('create-checkout-session', {
        body: { line_items, customer_email: email },
      });
  
      const { sessionId } = response;
      const { error } = await stripe.redirectToCheckout({
        sessionId
      });
      
      if (error) {
        console.log('error');
      }
    }
  
    return (
      &lt;form onSubmit={handleGuestCheckout}&gt;
        &lt;div&gt;
          &lt;input 
            type='email'
            onChange={e =&gt; setEmail(e.target.value)}
            placeholder='Email'
            value={email}
            className='nomad-input'
          /&gt;
        &lt;/div&gt;
        &lt;div className='submit-btn'&gt;
          &lt;button type='submit' className='button is-black nomad-btn submit'&gt;
            Checkout
          &lt;/button&gt;
        &lt;/div&gt;
      &lt;/form&gt;
    );
  }
  
  export default StripeCheckout;
  </code></pre>