视频字幕
NextAuth 是专为 Next.js 设计的身份验证库，它提供了简单而强大的方式来实现用户登录功能。今天我们将学习如何使用 NextAuth 集成 GitHub 和 Google 登录，让用户可以通过这些流行的第三方平台快速登录我们的应用。
首先我们需要安装 NextAuth 依赖包。使用 npm install next-auth 命令进行安装。接下来配置环境变量文件，创建 .env.local 文件来存储 OAuth 应用的密钥。然后在 pages/api/auth 目录下创建 [...nextauth].js 文件作为 API 路由。最后在 _app.js 中设置 SessionProvider 来管理用户会话状态。
接下来需要在 GitHub 和 Google 平台创建 OAuth 应用。对于 GitHub，访问 Settings 页面的 Developer settings，创建新的 OAuth App，设置回调 URL 为 localhost:3000/api/auth/callback/github。对于 Google，在 Google Cloud Console 中创建 OAuth 客户端 ID，配置授权回调 URL 为 localhost:3000/api/auth/callback/google。这些步骤完成后，我们就能获得必要的客户端 ID 和密钥。
NextAuth.js 是专为 Next.js 设计的强大身份验证库，它支持多种第三方登录提供商。今天我们将学习如何使用 NextAuth.js 实现 GitHub 和 Google 第三方登录功能。
首先我们需要安装 NextAuth.js 包。然后创建环境变量文件，设置应用的 URL 和安全密钥。接下来创建动态 API 路由文件，这是 NextAuth.js 的核心配置文件。
接下来需要在 GitHub 和 Google 平台创建 OAuth 应用。在 GitHub 中创建 OAuth App，在 Google Cloud Console 创建 OAuth 2.0 客户端。这两个平台都会提供客户端 ID 和密钥，用于身份验证。记住要正确设置回调 URL。
现在我们来看具体的代码实现。在 [...nextauth].js 文件中，我们导入 NextAuth 和相应的 Provider，然后配置 GitHub 和 Google 提供器，使用环境变量中的客户端 ID 和密钥。在 _app.js 中用 SessionProvider 包装整个应用。最后创建登录页面，添加登录按钮并调用 signIn 方法来触发第三方登录流程。
整个登录流程非常简洁：用户点击登录按钮后，会被重定向到第三方认证页面，用户授权后返回应用，NextAuth 自动处理回调并创建安全会话。通过这个教程，我们成功实现了 GitHub 和 Google 第三方登录功能，提供了安全的会话管理和良好的用户体验。
整个登录流程非常简洁明了。用户点击登录按钮后，应用会重定向到选择的第三方认证平台，用户完成授权后返回应用，NextAuth 自动处理回调并创建安全的用户会话。通过这个教程，我们成功实现了 GitHub 和 Google 第三方登录功能，为用户提供了便捷安全的登录体验。