【Nuxt-Auth】Google OAuth2でredirect_uri_mismatchを防ぐ

ドキュメントを参考に書く

参考: AuthJS Quickstart - NuxtAuth
一部いじくってますが基本ドキュメント通りです。

export default NuxtAuthHandler({
  secret: useRuntimeConfig().SECRET,
  providers: [
    //@ts-expect-error
    GoogleProvider.default({
      clientId: useRuntimeConfig().G_CLIENT_ID,
      clientSecret: useRuntimeConfig().G_CLIENT_SECRET,
    }),
  ],
});

ただ、これだけだと認証時にGoogleからredirect_uri_mismatchを返されます。

redirect_uriを指定してやる

GoogleProvider.defaultにこいつをぶちこみます

authorization: {
  params: {
    redirect_uri: useRuntimeConfig().REDIRECT_URI,
  },
},

runtimeConfigはこんな感じでいいんじゃないでしょうか

runtimeConfig: {
  REDIRECT_URI: process.env.NODE_ENV === 'production' ? `${process.env.PROD_HOST}/api/callback/google` : 'http://localhost:3000/api/auth/callback/google',
}

これでやってみると動くはずです。

完成形

import { NuxtAuthHandler } from '#auth';
import GoogleProvider from 'next-auth/providers/google';

export default NuxtAuthHandler({
  secret: useRuntimeConfig().SECRET,
  providers: [
    //@ts-expect-error
    GoogleProvider.default({
      clientId: useRuntimeConfig().G_CLIENT_ID,
      clientSecret: useRuntimeConfig().G_CLIENT_SECRET,
      authorization: {
        params: {
          redirect_uri: useRuntimeConfig().REDIRECT_URI,
        },
      },
    }),
  ],
});

それでは。