单点登录 (SSO) 变得简单

什么是单点登录 (SSO)？

前端单点登录 (SSO) 是一种用户身份验证和授权方法，使用户能够使用一组登录凭据访问多个应用程序或网站，从而消除重复登录和注册。 这改善了用户体验，降低了维护成本，并增强了安全性。

实施单点登录解决方案

前端 SSO 实现有几种关键方法：

基于 Cookie 的 SSO

这种广泛使用的方法利用了浏览器的 cookie 机制。 首次登录中央身份验证页面（例如页面 A）时，会创建一个包含用户数据和过期时间的加密 cookie。 Cookie 的域设置为顶级域（例如 example.com），从而允许在该域内的应用程序之间共享（a.example.com、b.example.com 等）。随后访问其他应用程序会检查此 cookie；如果存在，用户将自动登录；否则，重定向至认证页面。 虽然简单，但这种方法仅限于同域应用程序，面临跨域挑战，并且对 cookie 大小和数量有限制。

示例：设置和检索 cookie。

设置cookie（页面A）：

// Generate an encrypted cookie value
const encryptedValue = encrypt(userinfo);

// Set the cookie
document.cookie = `sso_token=${encryptedValue};domain=.example.com;path=/;max-age=86400;`;

检索和使用 cookie（页面 B）：

// Retrieve the cookie
const cookieValue = document.cookie
  .split(';')
  .find((cookie) => cookie.trim().startsWith('sso_token='))
  .split('=')[1];

// Decrypt the cookie
const userinfo = decrypt(cookieValue);

// Log in directly
login(userinfo);

基于令牌的 SSO

这种无状态方法涉及在认证中心成功登录后生成加密令牌（包含用户信息和过期时间）。该令牌存储在客户端（localStorage 或 sessionStorage）。 后续应用访问验证token；有效的令牌授予直接访问权限，而无效的令牌则重定向到身份验证中心。 基于令牌的 SSO 支持跨域功能并避免 cookie 限制，但需要额外的存储和网络开销，并且如果令牌被泄露，则会带来安全风险。

示例：存储和验证令牌。

存储令牌（页面 A）：

// Generate the token value
const token = generateToken(userinfo);

// Store the token
localStorage.setItem('sso_token', token);

检索和使用令牌（其他页面）：

// Retrieve the token
const token = localStorage.getItem('sso_token');

// Validate the token
const userinfo = verifyToken(token);

// Log in directly
login(userinfo);

基于 OAuth 2.0 的 SSO

此方法利用 OAuth 2.0 的授权代码流程。 首次登录会触发对认证中心的请求，认证中心返回授权码并重定向到应用程序的回调 URL。 应用程序将此代码交换为存储在客户端的访问和刷新令牌（包含用户数据和过期时间）。 后续应用程序访问会检查有效的访问令牌，如果找到则自动登录，否则重定向到身份验证中心。 虽然遵守 OAuth 2.0 标准并支持各种客户端类型（Web、移动、桌面），但它更加复杂，需要多个请求和重定向。

示例：授权代码流程。

发送授权请求（页面 A）：

// Generate an encrypted cookie value
const encryptedValue = encrypt(userinfo);

// Set the cookie
document.cookie = `sso_token=${encryptedValue};domain=.example.com;path=/;max-age=86400;`;

处理回调（页面A）：

// Retrieve the cookie
const cookieValue = document.cookie
  .split(';')
  .find((cookie) => cookie.trim().startsWith('sso_token='))
  .split('=')[1];

// Decrypt the cookie
const userinfo = decrypt(cookieValue);

// Log in directly
login(userinfo);

---

Leapcell：您的首要 Node.js 托管解决方案

Leapcell 是一个用于 Web 托管、异步任务和 Redis 的尖端无服务器平台，提供：

• 多语言支持： Node.js、Python、Go 和 Rust。
• 免费无限项目： 只需支付使用费用。
• 性价比：按需付费，无闲置费用。
• 简化的开发人员体验：直观的 UI、自动化 CI/CD、实时指标。
• 可扩展且高性能：自动扩展，零运营开销。

探索文档并尝试一下！

在 X 上关注我们：@LeapcellHQ

---

在我们的博客上阅读更多内容

以上是单点登录 (SSO) 变得简单的详细内容。更多信息请关注PHP中文网其他相关文章！