配置 Okta

假设我们已经构建了一个应用程序，并希望为其添加用户身份验证功能。以下是实现这一目标的步骤：

创建 Okta 组织

首先，我们需要一个组织。正如我们在前几节课中看到的，组织是由 Okta 提供的私有数据空间，用于存放所有用于处理用户身份验证的资源。

在本课程中，我们将注册一个 Okta 开发者版组织。该版本免费，并支持最多 100 名每月活跃用户。请按照以下步骤创建组织：

步骤 1： 访问 Okta Developer 门户，点击顶部菜单栏中的“注册”按钮。

步骤 2： 填写注册表单。必须使用您的企业邮箱进行注册。

步骤 3： 您将收到来自 Okta 开发者团队的邮件。点击邮件中的“激活”按钮以激活账户。

步骤 4： 您将被重定向到密码重置页面。输入新密码以完成注册流程。

此时，您将被重定向到 Okta 管理控制台。

Okta 域和 Issuer

Okta 域（也称为 Okta URL）是访问组织的基础 URL。所有用户的授权请求都会被导向包含此基础 URL 的端点。我们调用的所有 Okta API 端点也都以该域作为基础。

登录到您的 Okta 组织管理员账户后，可以在全局页眉的右上角找到您的 Okta 域。点击顶部菜单栏中的用户名，在下拉菜单中，用户名下方显示的就是 Okta 域。

您的 Okta 域可能如下所示：

• example.oktapreview.com
• example.okta.com
• example.okta-emea.com

请复制 Okta 域并妥善保存。

接下来，我们将使用该域名生成“Issuer”，即执行身份验证的授权服务器的 URL。所有开发者账户都默认拥有一个授权服务器。“Issuer”的生成方式如下：

https://{DOMAIN}/oauth2/default

步骤 1： 点击下方小工具中的“编辑”按钮，输入 Okta 域，然后点击“保存”按钮。

步骤 2： 点击“运行”按钮，“Issuer”将自动生成，并以名为 ISSUER 的独立键值存储。

步骤 3： 点击“保存”按钮，保存 ISSUER。

1console.log("Issuer: https://{{DOMAIN}}/oauth2/default")

创建 Okta 应用集成

为了实现用户登录，我们需要创建一个代表我们应用程序的 Okta 应用集成。

步骤 1： 在管理控制台页面中，从左侧菜单栏进入“应用”，然后从下拉菜单中点击“应用”。

步骤 2： 点击“创建应用集成”按钮，这将打开一个弹窗。

步骤 3： 在“登录方法”中选择“OIDC - OpenID Connect”，在“应用类型”中选择“单页应用 (SPA)”，然后点击“下一步”。

步骤 4： 您将被重定向到“新建单页应用集成”页面。为您的应用集成输入一个名称。

步骤 5： 在“授权类型”中选择“授权码”。

步骤 6： 在“登录重定向 URI”中，输入下方小工具中提供的 URL。Okta 会将用户的登录请求的认证响应和 ID 令牌发送到这些 URI。

1{{EDUCATIVE_LIVE_VM_URL}}/login/callback

注意： 如果您的 OpenID Connect 客户端有多个重定向 URI，且希望使用带有通配符的子域名单个重定向 URI，可以勾选“允许在登录 URI 重定向中使用通配符 *”。但强烈建议不要使用通配符子域名，因为这可能导致攻击者将其控制的页面接收令牌或授权码。

步骤 7： 在“登出重定向 URI”中，输入下方小工具中提供的 URL。当应用程序联系 Okta 关闭用户会话后，Okta 会将用户重定向到其中一个 URI。

1{{EDUCATIVE_LIVE_VM_URL}}

步骤 8： 在“分配”部分的“受控访问”中，选择“允许组织内所有人访问”，以便所有人都能访问您的应用。您也可以选择“限制仅特定组访问”，并指定允许访问应用的组。

步骤 9： 点击“保存”按钮，完成 Okta 应用集成的创建。您将获得“客户端 ID”及其他相关信息。

步骤 10： 复制并安全保存“客户端 ID”。

“客户端 ID”是客户端的公开标识符，所有 OAuth 流程都需要它。点击下方小工具中的“编辑”按钮，输入 CLIENT_ID，然后点击“保存”按钮。

现在点击“运行”按钮，即可显示 CLIENT ID。

1console.log("Client ID: {{CLIENT_ID}}")

添加可信来源

现在我们已成功创建了 Okta 应用集成，需要将我们的来源（即 Web 应用程序的 URL）添加到 Okta 管理员仪表板中的可信来源列表中。

只有我们定义的可信来源才能访问该应用集成的 Okta API，这有助于减少潜在攻击面。跨源资源共享（CORS） 允许托管在我们网站上的 JavaScript 使用 XMLHttpRequest 向 Okta API 发起请求，并携带 Okta 会话 Cookie。

请按以下步骤添加可信来源：

步骤 1： 从左侧菜单栏进入“安全”，然后从下拉菜单中点击“API”。

步骤 2： 点击“可信来源”标签。

步骤 3： 点击“添加来源”按钮。

步骤 4： 在“来源名称”中输入您的组织名称。

步骤 5： 在“来源 URL”中输入下方小工具中提供的网页应用 URL。

1{{EDUCATIVE_LIVE_VM_URL}}

步骤 6： 在“选择类型”中，勾选“跨源资源共享（CORS）”和“重定向”。

步骤 7： 点击“保存”按钮。

您将看到该来源已添加至可信来源列表。