Callback payload returned in FormData rather than in Query format

[yaaamin]

Question 💬

I'm trying to authorize using the authorization endpoint with some parameters, but I keep getting an error that says "State cookie was missing". After looking into it, I realized that the data is being returned in Form Data mode instead of a query string, which is causing issues with parsing.

Unfortunately, the OAuth provider restricts the data to be returned only in "form_post" method during the callback, and I'm not sure what to do. Is there any way to resolve this issue or convert the formData to a query string during the callback process?

I have provided the NextAuth config down as below.

Thanks for your help!

How to reproduce ☕️

import NextAuth from 'next-auth'
import GoogleProvider from 'next-auth/providers/google

export default NextAuth(providers: [
    {
      id: 'customProvider',
      name: 'Custom Provider',
      type: 'oauth',
      version: '2.0',
      /wellKnown: 'https://customprovider.com/.well-known/openid-configuration',
      clientId: process.env.NEXT_PUBLIC_CLIENT_ID,
      clientSecret: process.env.NEXT_PUBLIC_CLIENT_SECRET,
      scope: ['openid', 'profile'],
      issuer: 'https://customprovider.com',
      authorization: {
        url: 'https://customprovider.com/connect/authorize',
        params: {
          client_id: process.env.NEXT_PUBLIC_CLIENT_ID,
          response_type: 'code id_token',
          scope: 'openid profile',
          response_mode: 'form_post',
        },
      },
      token: {
        url: 'https://customprovider.com/connect/token',
        params: {
          client_id: process.env.NEXT_PUBLIC_CLIENT_ID,
          client_secret: process.env.NEXT_PUBLIC_CLIENT_SECRET,
          grant_type: 'authorization_code',
          scope: 'openid profile',
        },
      },
      userinfo: { url: 'https://customprovider.com/userinfo' },
      profile: (profile, token) => {
        console.log(profile, token)
        return {
          id: '1234',
          name: 'foo',
          email: 'bar',
          image: '',
        }
      },
    },
    GoogleProvider({
      clientId:
        process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
      clientSecret: process.env.NEXXT_PUBLIC_GOOGLE_CLIENT_SECRET,
    }),
  ],
  secret: process.env.NEXTAUTH_SECRET,
  debug: true,
  session: {
    jwt: true,
  },
  callbacks: {
    async jwt(token, user, account, profile, isNewUser) {
      // ...
      return token
    },
    async session(session, token) {
      // ...
      return session
    },
  },
})

Contributing 🙌🏽

Yes, I am willing to help answer this question in a PR

[balazsorban44]

Quick note. NEXT_PUBLIC_CLIENT_SECRET is likely not what you want! Client and secret don't go well together. I recommend immediately rotating the secret if it's used in production, and drop the NEXT_PUBLIC_ prefix.

[stale]

It looks like this issue did not receive any activity for 60 days. It will be closed in 7 days if no further activity occurs. If you think your issue is still relevant, commenting will keep it open. Thanks!

[stale]

To keep things tidy, we are closing this issue for now. If you think your issue is still relevant, leave a comment and we might reopen it. Thanks!