Next.js 13.4+Supabase Auth重置密码后刷新自动登录问题求助

我使用Next.js 13.4和Supabase Auth开发密码重置流程时遇到问题：用户点击邮件中的密码重置链接后，刷新页面会触发自动登录。预期行为是用户必须完成密码重置操作后才能登录，当前不刷新页面时功能正常。

在Supabase社区看到一种解决方案：密码更新表单应放在已登录区域而非认证区域，因为用户需登录才能修改密码。

相关代码 #

1. 包含登录、注册、密码重置页面的layout.js #

import { createServerComponentSupabaseClient } from '@supabase/auth-helpers-nextjs'
import { headers, cookies } from 'next/headers'
import { redirect } from 'next/navigation'

export default async function AuthLayout({ children }) {
    const supabase = createServerComponentSupabaseClient({
        headers,
        cookies,
    })
    const { data } = await supabase.auth.getSession()

    if (data.session) {
        redirect('/admin')
    } // 这行代码导致了问题，但我不能删除它

    return children
}

2. <SupabaseProvider>代码 #

'use client'

import { createContext, useContext, useEffect, useState } from 'react'
import { createBrowserSupabaseClient } from '@supabase/auth-helpers-nextjs'
import { useRouter } from 'next/navigation'

const Context = createContext(undefined)

export default function SupabaseProvider({ children }) {
    const [supabase] = useState(() => createBrowserSupabaseClient())
    const router = useRouter()

    useEffect(() => {
        const {
            data: { subscription },
        } = supabase.auth.onAuthStateChange((event, session) => {
            console.log("EVENT (provider) => ", event)

            if (event === 'PASSWORD_RECOVERY') {
                router.push('/admin/auth/reset')
            }

            if (session && (event === 'SIGNED_IN' || event == 'TOKEN_REFRESHED')) {
                router.refresh()
            }

            if (event === 'SIGNED_OUT') {
                router.refresh()
            }

        })

        return () => {
            subscription.unsubscribe()
        }
    }, [router, supabase])

    return (
        <Context.Provider value={{ supabase }}>
            <> {children} </>
        </Context.Provider>
    )
}

export const useSupabase = () => {
    const context = useContext(Context)

    if (context === undefined) {
        throw new Error('useSupabase must be used inside SupabaseProvider')
    }

    return context
}

控制台输出（点击重置链接后刷新页面触发自动登录时） #

EVENT (provider) => INITIAL_SESSION
EVENT (provider) => PASSWORD_RECOVERY

参考文档 #

• Supabase 监听认证事件
• Supabase 发送密码重置请求

内容的提问来源于stack exchange，提问作者Emre