How do you force authentication (login) before checkout?

[drewgillen]

How do I redirect a user to checkout after sign in IF they came from the product page? Using Next.js and NextAuth. Should I use nextauth callbacks or redirect? Or use useRouter then after sign in push them to checkout?

I am using stripe for checkout as well. Just need to post a request to the stripe API folder. Any ideas or recommendations?

The ideal checkout flow for users that are not signed in would look like this:
Procut Page -> Sign In -> Stripe Checkout

Any recommendations or thoughts?

[drewgillen]

I am still having trouble force authenticating users before checkout. I have went ahead and made a video on YouTube to help better explain my situation. Found Here

I have tried using NextAuth callbackUrls listed Here, but this wont work because I am trying to redirect the user back to checkout which is hosted by stripe. I am using Next useRouter so the URL query paths contain the users product id, the method, and the API route to post too.

I have tried creating custom functions that parse the query route and then redirect the user to the checkout session. But the function runs before the signin page is reloaded. I need the function to run after the sign in page is reload, and then redirect the user to the stripe checkout. Below I will include some diagrams of what I am trying to accomplish and what I have found so far.

I am now at a crossroad. From my understanding I need to run a callback function after the signin page reloads and then redirect the user back to their checkout. Can this only be done from the redirect callback found here? or am I missing something and there is some other way?

Any help would be greatly appreciated!

User Checkout Flow

NextAuth Signin process flow

[zjbob]

Would really like any insight from anyone on this subject!

[noahqto]

Any help on this subject would be extremely beneficial, very confused and would greatly appreciate any insight on how to resolve this issue.

[tedikehara]

This is a really important step in the process, as without this user security would not be maintained. Any help on this would be greatly appreciated thank you!

[drewgillen]

Button Click
<button className="btn-google btn w-100 mb-2" type="submit" onClick={() => signIn("google" , { callbackUrl: callBack()})}>

Callback Function inside sign in page

async function callBack() {

        if (router.query !== {}) {
            console.log('Router Query INSDIE Callback ');
            console.log(router.query);
            console.log(router.query.priceId);
            console.log(router.query.route);
            const url = router.query.route;

            
            const response = axios.post(`${router.query.route}`, {
                priceId: router.query.priceId,
                identifier: 'signin',
            })

            router.push(response.data)

        } 
        

        return '/dashboard';
        
    }