OAuth 到底是什么？OAuth 2.0、访问令牌以及如何在你的网站中实现它

什么是 OAuth 2.0？

OAuth 2.0 实际应用

OAuth 令牌

如何为您的网站实施 OAuth 2.0

下一步是什么？

快速了解 OAuth 2.0 是什么以及如何使用 OAuth 2.0 登录 - 以 Google 登录为例进行简单解释。

我们很高兴地告诉您，Cotter 现在会在身份验证时生成访问令牌和刷新令牌。在了解如何使用之前，我们先来了解一下 OAuth 2.0 和令牌的概念。

概述

1. 什么是 OAuth 2.0
2. OAuth 2.0 实际应用
3. OAuth 令牌：短期访问令牌和长期刷新令牌
4. 如何为您的网站实施 OAuth 2.0

什么是 OAuth 2.0？

OAuth 2.0 是一个授权框架，它定义了第三方应用如何安全地访问服务，而无需用户提供安全信息（用户名、密码等）。OAuth 2.0 的一个常见示例是使用“使用 Google 登录”登录其他网站。

OAuth 2.0 实际应用

一般来说，OAuth 2.0 流程如下所示：

我们以“使用 Google 登录”为例。

Albert 是一位 Google 日历用户，他正在尝试使用 Calendly.com 来管理日历。我们将在下一个示例中详细讲解相关术语。

• (1) Calendly.com 想要访问 Albert 的 Google 日历。Calendly.com 将 Albert 重定向到他的 Google 帐户，Albert 在该帐户中授予 Calendly.com 日历访问权限。(2) Google 返回授权许可，并将 Albert 重定向到 Calendly.com。(3) Calendly.com 将授权许可授予 Google，(4) 收到访问令牌。(5) Calendly.com 现在可以使用此访问令牌 (6) 访问 Albert 的 Google 日历，但不能访问他的 Google 云端硬盘或其他资源。

这里，Calendly.com 是客户端，Albert 是资源所有者，Google Account 是授权服务器，Google Calendar 是资源服务器。

让我们尝试通过一个更简单的例子来理解这些术语。

让我们以艾伯塔为例，她住在一家酒店，并希望她的保姆坎迪进入她的房间。

1. 艾伯塔同意坎迪进入她的房间，并要求坎迪从接待员那里领取自己的房间钥匙。艾伯塔给了坎迪一份身份证复印件和一张写着“仅限白天进入”的纸条。
2. 坎迪拿着艾伯塔的身份证复印件和那张纸条去找接待员。接待员核实了身份后，给了坎迪一把只能在白天使用的特殊房间钥匙。坎迪回到房间，用钥匙进入房间。

• Candy 是客户（与 Ca​​lendly.com 类似），她想要访问 Alberta 的数据。Alberta 授予客户有限的访问权限。授权文件包括 Alberta 的身份证复印件及其备注。
• 前台是授权服务器，他们可以为 Candy 生成房间钥匙，以便她进入房间。这个房间钥匙相当于访问令牌 (Access Token)，可以用来获取资源。
• 房间锁是资源服务器，它保存着Candy想要的资源：房间。

OAuth 2.0 提供了几种不同的流程，本例遵循的是授权码流程。我们将在另一篇文章中讨论这些不同的流程 :)

OAuth 令牌

如上所述，在流程结束时，客户端会收到一个访问令牌。通常，这些访问令牌是短暂有效的；那么，当它过期时会发生什么呢？

短期访问令牌和长期刷新令牌

在步骤 4 中，授权服务器可以生成两个令牌：一个访问令牌和一个刷新令牌。访问令牌的有效期较短，通常只能持续几小时到几周。

当访问令牌过期时，应用程序可以使用刷新令牌获取新的访问令牌。这样就无需要求用户重新进行身份验证。

访问令牌

好了，既然我们了解了工作原理，那就开始思考如何生成访问令牌吧。有了短期访问令牌，我们可以使用 JWT 令牌来创建自编码访问令牌。

JSON Web Tokens (JWT) 是一个经过签名的 JSON 对象。这意味着您可以通过验证签名来信任 JSON 对象中包含的数据。为了授权用户，您可以在 JWT 中包含用户的 ID 和电子邮件地址。

当您将 JWT 访问令牌提供给资源服务器（您的后端 API 服务器）时，您的服务器可以验证 JWT 令牌，而无需访问数据库来检查它是否有效。

您的服务器需要做的就是使用库验证 JWT 令牌是否有效，查看从令牌发出请求的用户的用户 ID，并相信该用户 ID 已经过身份验证。

刷新令牌

刷新令牌是一种用于获取新访问令牌的特殊令牌。由于刷新令牌具有长期有效性，因此它通常是存储在数据库中的不透明字符串。将刷新令牌存储在数据库中后，您可以通过从数据库中删除该令牌来撤销它们。

由于访问令牌无法过期，因此我们应该将其设置为短期有效。撤销刷新令牌可以防止恶意方刷新已过期的访问令牌。这意味着，如果您的访问令牌在 1 小时后过期，那么获取该访问令牌的攻击者只能在令牌过期前的 1 小时内访问您的 API。

如何为您的网站实施 OAuth 2.0

这听起来很多，但您只需几分钟即可使用 Cotter 实现 OAuth 2.0 并使用访问令牌授权 API 请求。

您的网站作为客户端，Cotter作为授权服务器

对于上面的 OAuth 流程，它看起来是这样的：

• 您的网站是客户
• 您的用户是资源所有者
• Cotter 是授权服务器
• 您的后端服务器是资源服务器

登录并生成访问令牌

我们有几个 5 分钟的快速入门，用于验证用户身份和生成访问令牌：

• Web： HTML 、 React、Angular（另请查看我们的Gatsby和Next.js教程）。
• 移动端： React Native、Flutter、iOS、Android

本指南以 React 为例。我们将构建一个带有电子邮件魔术链接的登录表单，并在流程结束时获取访问令牌。

进口 Cotter：

yarn add cotter

初始化并显示电子邮件登录表单：

import React, { useEffect } from "react";
import Cotter from "cotter"; // 1️⃣ Import Cotter

function App() {
  useEffect(() => {
    // 2️⃣ Initialize and show the form
    var cotter = new Cotter(API_KEY_ID); // 👈 Specify your API KEY ID here
    cotter
      .signInWithLink() // use Magic link
      .showEmailForm() // show email login form
      .then(resp => console.log(resp))
      .catch(err => console.log(err));
  }, []);

  return (
    // 3️⃣ Put a <div> with id "cotter-form-container"
    // that will contain the form
    <div id="cotter-form-container" style={{ width: 300, height: 300 }} />
  );
}

export default App;

您可以通过创建免费帐户API_KEY_ID从仪表板获取您的信息。

就是这样。检查控制台日志以获取访问令牌。

上述函数涵盖了 OAuth 2.0 流程中的步骤 1-4。来自的响应showEmailForm()会返回一个访问令牌。如上所述，您应该使用此访问令牌访问后端服务器中的资源。

例如，您可以将此访问令牌包含到您的端点/api/private-resource，并在继续请求之前检查访问令牌是否有效。

下一步是什么？

现在您已经知道如何获取访问令牌，下面还有一些内容可以帮助您完成登录流程。

• Cotter 的 OAuth 令牌：您获得了什么令牌，它们是什么样子的。
• 如何验证访问令牌并允许对私有端点的请求。
• 如何在前端安全地存储它。我们将在下周介绍，敬请期待！

问题和反馈

如果你需要帮助或有任何反馈，请在Cotter 的 Slack 频道上联系我们！我们随时准备提供帮助。

准备好使用 Cotter 了吗？

如果您喜欢本教程并希望将 Cotter 集成到您的网站或应用程序中，您可以创建一个免费帐户并查看我们的文档。