在 Next.js 中使用 Supabase 认证

学习如何为 Next.js App Router 配置 Supabase 认证

前往 database.new 创建一个新的Supabase项目。

您的新数据库已包含用于存储用户的表。您可以通过在SQL编辑器中运行SQL来查看当前该表为空。

1
select * from auth.users;

使用 create-next-app 命令和 with-supabase 模板创建一个预配置好的Next.js应用，包含：

1
npx create-next-app -e with-supabase

将 .env.example 重命名为 .env.local 并填入您项目的URL和Anon Key。

1
2
NEXT_PUBLIC_SUPABASE_URL=your-project-url  NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key

启动开发服务器，在浏览器中访问 http://localhost:3000，您应该能看到 app/page.tsx 的内容。

要注册新用户，请访问 http://localhost:3000/sign-up 并点击 Sign up。注意：必须先重命名.env.example为.env.local才能访问此路由

1
npm run dev