0

I'm using firebase stripe extension "run subscriptions with stripe". In this extension integration i'm not able to redirect the checkout page (redirectToCheckout function did not work)..Any ideas how can i do that???

Here is my stripe webhooks events:

customer.subscription.updated
customer.subscription.deleted
customer.subscription.created
checkout.session.completed
price.updated
price.deleted
price.created
product.updated
product.deleted
product.created

Here is my first screen code in which user is creating...!

import firebase from 'firebase';
// import getStripe from './stripe';
import { loadStripe } from '@stripe/stripe-js/pure';
import '@stripe/stripe-js';
import redirectToCheckout from '@stripe/stripe-js';


const firestore = firebase.firestore();

firebase.auth().onAuthStateChanged((user) => {
    if (user) {
       console.log(user.uid)        
      // User logged in already or has just logged in.
    } else {
      // User not logged in or has just logged out.
    }
  });




export async function createCheckoutSession(){
  

    let uid = "static uid";
    const checkoutSessionRef =  await firestore.collection('stripe').doc(uid).collection('checkout_sessions').add(
        
        {price : 'price id',
         success_url : 'https://localhost:3000/success',
         cancel_url: 'https://localhost:3000/fail',
    });

    checkoutSessionRef.onSnapshot(async (snap) => {
        const {error , sessionId} = snap.data();
        if (error) {
          // Show an error to your customer and 
          // inspect your Cloud Function logs in the Firebase console.
          alert(`An error occured: ${error.message}`);
        }
        if (sessionId) {
             const stripe =  await loadStripe('pk_test_1234');
             stripe.redirectToCheckout({ sessionId });
        }
    });
}
neel
  • 29
  • 3
  • Did you verify that you have a sessionId and that redirectToCheckout is actually invoked? Also, redirectToCheckout returns a promise that might have an error event you are missing. Try await stripe.redirectToCheckout({ sessionId }) – Deadron Mar 23 '21 at 16:03
  • Yes the seessionId is generated in firebase...and as you say try using await stripe.redirectToCheckout({sessionId})...i tried this but it did not work for me..any other idea? – neel Mar 23 '21 at 16:38
  • 1
    What error(s) are you seeing in the console when `stripe.redirectToCheckout` fails? If you do `const result = await stripe.redirectToCheckout({ sessionId });` and check `result.error` do you get any useful information? – Justin Michael Mar 23 '21 at 23:35
  • Yup i tried this but it did not show any error in console...this is my code .. ` const result = await stripe.redirectToCheckout({ sessionId }); console.log(result.error) `...What can i do now?? – neel Mar 24 '21 at 05:40

1 Answers1

0

I am using the same code and it's working fine. The only difference I see here which might be the reason for your problem is that you are importing loadStripe from @stripe/stripe-js/pure which might need to be from "@stripe/stripe-js" and I don't think you need any other stripe import, for example, your imports should be like

import firebase from 'firebase';
import { loadStripe } from '@stripe/stripe-js';

I have these imports and they are working fine

Sulman Azhar
  • 977
  • 1
  • 9
  • 26