使用JavaScript和BUN的Google Oauthententication的分步指南

本指南展示了Google OAuth2用户身份验证的基本JavaScript和Express Server实现。 尽管库简化了过程，但这种动手方法阐明了核心概念。我们将使用bun，快速的JavaScript运行时。

---

Google OAuth2设置

在编码之前，配置您的Google Cloud项目：

步骤1：创建一个Google Cloud Project

1. 访问Google Cloud Console。
2. 创建一个新项目（或使用现有项目）。

>步骤2：配置OAuth同意屏幕

1. >导航到> api＆services＆gt; oauth同意屏幕。
2. 提供应用程序名称，支持电子邮件和其他必需的详细信息。
3. （可选）自定义品牌，以提供更有信息的同意屏幕。

步骤3：定义范围

1. 在> scopes 下，添加：
   • ：访问用户的电子邮件。email
   • ：openID Connect用于身份验证。openid>
   • ：访问基本配置文件数据（名称，图片）。 profile

步骤4：生成OAuth客户端ID

（允许几分钟进行处理。）

>

1. 转到凭据＆gt;创建证书＆GT; OAuth客户端ID。
2. 选择> Web应用程序作为应用程序类型。
>
3. set 指定ahttp://localhost:3000>重定向uri
：
4. 。 请记住要更新这些URI进行生产部署。 Google在身份验证后将用户重定向到重定向URI，包括授权代码和状态。为简单起见，我们使用同一页面。 http://localhost:3000 >步骤5：添加测试用户

>用于测试，添加测试用户的电子邮件地址。彻底测试后发布您的应用程序。

google oauth2代码实现

---

> 项目结构

我们使用BUN版本1.2。

<code>project/
├── public/
│   └── index.html
├── src/
│   └── index.js
├── .env
└── bun.lock</code>

>此HTML为Google登录和OAuth回调处理提供了一个简单的接口。 （简洁而省略了代码，但包含在原始提示中）index.html

（服务器端逻辑）

（省略了简洁的代码，但包含在原始提示中）index.js>

>运行项目

>安装bun（BUN网站上可用的说明）。

>用您的
1. ，
和
2. 。 .env运行服务器：GOOGLE_CLIENT_IDGOOGLE_CLIENT_SECRET> GOOGLE_REDIRECT_URI测试流量：访问
，与Google登录，然后检查令牌的控制台。
3. bun run index.js
4. http://localhost:3000结论

---

此手册实现提供了对Google OAuth2的深刻了解。尽管护照或NextAuth等图书馆提供了便利，但这种方法阐明了基本的身份验证机制。

以上是使用JavaScript和BUN的Google Oauthententication的分步指南的详细内容。更多信息请关注PHP中文网其他相关文章！