Issue with Next Auth + Shopify Theme extension app embed

infinityp913
Shopify Partner
11 2 2

Hi - for my shopify app embed, I set the App URL to my external website's login page. If the login is successful, the user is redirected to their dashboard.

This is so that the Shopify app admin page shows the merchant user's dashboard.

 

Now, my website uses Next Auth for authentication with a custom sign in page and it works flawlessly on the external website. I use the signIn() function from Next Auth as follows:

const status = await signIn('credentials',{
      redirect: false,
      email: values.email,
      password: values.password,
      callbackUrl: "/"
    })

Now, when this code works, status.url should be "https://mywebsite.com".

As I mentioned, this works perfectly if I login to my website in a separate tab.

 

However, things weird on the Shopify admin page (where the app url is set to my website). When I try to login on my Shopify app page displaying my website, it redirects to the following page:

infinityp913_0-1713759194595.png

This seems to be a default next auth login page. And, on console logging the status.url I get "https://mydomain.com/api/auth/signin?csrf=true". On, going to this link in a new tab, it displays the same page as above.

 

So, I'm not sure why, when I log in on the Shopify app page, the Sigin() function returns a callback URL that's different from what I set in the function parameter. And, why it doesn't happen when I login on my website in a separate tab.

 

Anyone who has worked with Next Auth and Shopify app embeds know what's going wrong here?

Replies 0 (0)