使用 Next.js 登录和注册 使用 Next.js 登录和注册

2025-06-10

使用 Next.js 登录和注册

使用 Next.js 登录和注册

我最近开始学习 Next.js,我想提高我的 Next.js 技能,所以我决定使用 Next.js 和 MongoDB 制作一个简单的登录和注册网站。

该网站有 4 个页面和 3 个 API 路由:

  • /:用户可以在其中查看自己是否已登录,并查看他们可以访问的所有其他页面
  • /login:用户可以登录的页面
  • /signup:用户可以注册账户的页面
  • /profile:用户可以查看其帐户创建日期
  • /api/signup:创建用户帐户的 API 路由
  • /api/login:检查输入密码的 API 路由
  • /api/logout:删除用户名 cookie 的 API 路由

我已经使用 cookies 来检查用户是否已登录。cookie在路由
中设置和删除,/api但使用 读取getServerSideProps

完整的源代码可以在这个 GitHub repo 中查看:

使用 Next.js 登录和注册

该模板使用 Next.js 和 MongoDB 创建一个简单的登录和注册网站。

要使用此模板,只需分叉 repo,然后.env使用密钥将您的 MongoDB URI 添加到文件中MONGODB_URI

要查看模板的实际效果,请访问https://login-signup-nextjs.vercel.app




您能检查一下代码并告诉我改进的方法吗?

鏂囩珷鏉ユ簮锛�https://dev.to/vulcanwm/login-and-signup-with-nextjs-am7
PREV
如何在 Next.js 中使用 Fontawesome
NEXT
咖啡休息期间的 Vue - 使用带有自定义组件的 v-model。