为你的 WordPress 应用添加认证 (Authentication)
为了获得更好的用户体验,我们现在推荐使用我们的官方 WordPress 插件 而不是遵循本教程。
本教程将向你展示如何将 Logto 集成到你的 WordPress 网站中。
前提条件
- 一个 Logto Cloud 账户或一个 自托管 Logto。
- 一个已创建的 Logto 传统应用。
- 一个 WordPress 项目:在继续之前,请按照官方 WordPress 安装指南 设置你的 WordPress 网站。
集成
安装插件
我们将使用 OpenID Connect Generic 插件通过 OIDC 协议将 Logto 集成到你的 WordPress 网站中。
- 登录到你的 WordPress 网站。
- 导航到“插件”并点击“添加新插件”。
- 搜索“OpenID Connect Generic”并安装 daggerhart 的插件。
- 激活插件。
配置重定向 URI
首先,让我们配置重定向 URI。你可以在插件设置中找到它,向下滚动到“Notes”部分,并复制“Redirect URI”值。
切换到 Logto 控制台的应用详情页面。添加一个重定向 URI,并点击“保存更改”。
设置插件
请参考下表获取必要的配置详情:
插件字段 | 描述 |
---|---|
Client ID | 你的 Logto 应用的 app ID |
Client Secret | 你的 Logto 应用的 app secret |
OpenID Scope | 输入 email profile openid offline_access |
Login Endpoint URL | 你的 Logto 应用的授权 (Authorization) 端点 URL,它是 https://[tenant-id].logto.app/oidc/auth,你可以在 Logto 应用页面点击“显示端点详情”来获取 URL。 |
Userinfo Endpoint URL | 你的 Logto 应用的 userinfo 端点 URL,它是 https://[tenant-id].logto.app/oidc/me。 |
Token Validation Endpoint URL | 你的 Logto 应用的令牌验证端点 URL,它是 https://[tenant-id].logto.app/oidc/token。 |
End Session Endpoint URL | 你的 Logto 应用的结束会话端点 URL,它是 https://[tenant-id].logto.app/oidc/session/end。 |
Identity Key | ID 令牌中包含用户身份的唯一键,它可以是 email 或 sub,具体取决于你的配置。 |
Nickname Key | ID 令牌中包含用户昵称的键,你可以将其设置为 sub 并在以后更改。 |
检查点:测试你的应用
现在,你可以测试你的应用:
- 登出你的 WordPress 网站。
- 访问 WordPress 登录页面并点击“使用 Logto 登录”按钮。
- 你将被重定向到 Logto 登录页面。
- 使用你的 Logto 账户登录。
- 你将被重定向回 WordPress 网站并自动登录。
角色 (Roles) 映射
WordPress 有一个内置的用户角色管理系统,用于定义用户在网站上可以执行的操作(能力)。默认用户角色包括管理员、编辑、作者、贡献者和订阅者,每个角色都有自己的一组能力。
Logto 使用基于角色的访问控制 (RBAC) 作为其授权 (Authorization) 模型,利用“权限 (Scopes)”作为权限的最小单位。这些权限 (Scopes) 定义了认证 (Authentication) 用户在应用中被允许执行的具体操作。然而,WordPress 在管理用户权限方面采用了不同的原则,依赖于预定义的“角色 (Roles)”,这些角色 (Roles) 将各种能力捆绑在一起。
鉴于这种根本性的差异,我们建议在 Logto 中创建与 WordPress 中定义的角色 (Roles) 相对应的特殊角色 (Roles)。这些角色 (Roles) 可能没有任何权限 (Scopes),它们仅用作将用户映射到 WordPress 角色 (Roles) 的参考。
前提条件
- 在 Logto 中设置与 WordPress 中角色 (Roles) 相对应的角色 (Roles)。例如,如果你在 WordPress 中有一个“editor”角色 (Role),请在 Logto 中创建一个“group:editors”角色 (Role)。
实现角色 (Roles) 映射
要实现角色 (Roles) 映射,我们将在 WordPress 主题的 functions.php
文件中添加自定义代码。这涉及使用 wp_login
动作钩子,该钩子在用户登录时触发。以下是如何设置的分步指南:
步骤 1:访问你的主题的 functions.php
打开你的主题的 functions.php
文件。你可以通过导航到外观 > 主题编辑器并从右侧文件列表中选择 functions.php
来访问此文件。或者在源代码中,导航到你的 WordPress 主题目录并找到 functions.php
文件。此文件允许你添加自定义 PHP 函数,以扩展 WordPress 网站的功能。
步骤 2:编写角色 (Roles) 映射函数
下面是一个简单的函数示例,你可以将其添加到 functions.php 中。此函数将在用户登录时触发,并根据从 Logto 获取的用户 角色 (Roles)
声明分配角色 (Roles)。
function logto_handler($user_login, $user = null) {
if (!$user) {
$user = get_user_by('login', $user_login);
}
$oidc_claims = get_user_meta($user->ID, 'openid-connect-generic-last-user-claim', true);
if (in_array('group:editors', $oidc_claims['roles'])) {
$user->set_role('editor');
} else {
$user->set_role('subscriber');
}
}
add_action('wp_login', 'logto_handler', 10, 2);
步骤 3:理解代码并自定义
-
logto_handler
函数:此函数接受两个参数:$user_login
(用户名)和$user
(用户对象)。它从 Logto 中检索存储在用户元数据中的角色 (Roles) 作为openid-connect-generic-last-user-claim
,将此角色 (Role) 映射到相应的 WordPress 角色 (Role),并将其分配给用户。 -
add_action
:此行将logto_handler
函数挂接到wp_login
动作上,该动作在用户登录后触发。10
是优先级(默认),2
表示函数接受的参数数量。
上面的示例将 'editor' 角色 (Role) 分配给通过 Logto 认证 (Authentication) 且角色 (Role) 名称为 group:editors
的用户。然而,在实际场景中,你可能需要实现更多种类的角色 (Roles) 映射。
你可以在 这里 找到 WordPress 角色 (Roles) 及其能力的列表。
步骤 4:测试你的设置
现在,让我们通过使用在 Logto 中具有 group:editors
角色 (Role) 的用户登录来测试角色 (Roles) 映射功能。登录后,检查用户在 WordPress 中的角色 (Role),以确保映射正常工作。