L2L 登录插件 - 设置

Last updated: June 19, 2026

L2L 登录插件是 L2L 工作室项目的组件之一。该插件的主要用途是允许您将 L2L 用作 L2L 工作室应用的 SSO 提供商。这使您能够围绕数据维护高水平的安全性。

本指南将说明如何将 L2L 登录插件添加到任何 Bubble 应用中。

在现有项目上配置 L2L 登录插件

  1. 将L2L 登录插件添加到您的应用
  2. 在 Bubble 编辑器中启用 Workflow API。转到设置 → API，然后单击“启用 Workflow API 和后端工作流”旁边的复选框。记下 Workflow API 根 URL，稍后会用到。
  3. 向 User 数据类型添加一个额外参数。转到数据选项卡，然后单击“User”数据类型。添加具有以下指定类型的字段：
    1. LoginError → 文本
  4. 添加一个新的数据类型，用于保存登录配置所使用的变量。转到数据选项卡，并创建一个名为“LoginConfig”的新数据类型。在新的 LoginConfig 数据类型下，添加具有以下指定数据类型的新字段：
    1. AuthExpiresMinutes → 数字
    2. BubbleAppCertificate → 文本
    3. BubbleAppPrivateKey → 文本
    4. BubbleAppURL → 文本
    5. CallbackURL → 文本
    6. DispatchCertificate → 文本
    7. DispatchServer → 文本
  5. 添加一个新的数据类型，用于保存用户会话。转到数据选项卡，并创建一个名为 "UserSession" 的新数据类型。添加以下字段：
    1. AuthExpires → 日期
    2. NameId → 文本
    3. UserUniqueId → 文本
  6. 创建一个新页面，以处理登录错误。
    1. 将新页面命名为“login_error”
    2. 创建一个文本元素，并使用以下动态内容： 当前用户的 LoginError
  7. 创建一个新的 API 工作流，用于处理来自 L2L 调度服务器的身份验证回调。
    1. 在 Bubble 编辑器中转到页面选择器，然后选择“后端工作流”。
    2. 单击虚线框以创建新的后端工作流，选择“新建 API 工作流…”，并在对话框中输入以下内容：
      1. API 工作流名称：login_complete
      2. 公开为公共 API 工作流：已选中
      3. 此工作流可在未进行身份验证的情况下运行：已选中
      4. 运行工作流时忽略隐私规则：未选中
      5. 使用以下方式触发工作流：POST
      6. 参数定义：手动定义
      7. 添加新参数：
        1. 键：SAMLResponse
        2. 类型：文本
        3. 是列表/数组：未选中
        4. 可选：未选中
        5. 查询字符串：未选中
      8. 添加新参数：
        1. 键：sessionid
        2. 类型：文本
        3. 是列表/数组：未选中
        4. 可选：已选中
        5. 查询字符串：已选中
      9. 添加新参数：
        1. 键：user_unique_id
        2. 类型：文本
        3. 查询字符串：已选中
      10. 响应类型：页面重定向（302）
      11. 成功时重定向：index
      12. 出错时重定向：login_error
    3. 单击带有文本“单击此处添加操作…”的虚线框添加新操作，然后选择操作 → 插件 → validate_response。在对话框中输入以下内容：
      1. 响应：SAMLResponse
      2. 调度证书：搜索 LoginConfigs：第一项的 DispatchCertificate
      3. Bubble 应用 URL 搜索 LoginConfigs：第一项的 BubbleAppURL
      4. 服务器：搜索 LoginConfigs：第一项的 DispatchServer
    4. 添加另一个新操作，然后选择数据（事物）→ 创建新事物...
      1. 在对话框中，为类型选择 UserSession
      2. 为以下每一项单击“设置其他字段”：
        1. AuthExpires = 当前日期/时间 +(分钟)：搜索 LoginConfigs：第一项的 AuthExpiresMinutes
        2. NameId = 步骤 1（validate_response）的结果中的 Name ID
        3. UserUniqueId = user_unique_id
      3. 在“仅当”部分输入以下内容：步骤 1（validate_response）的结果中的 Is Authenticated 为“是”
    5. 再添加一个新操作，然后选择账户 → 修改当前用户。
      1. 在对话框中，单击“更改其他字段”，并输入以下内容：LoginError = 步骤 1（validate_response）的结果中的 Error
  8. 添加一个新的可复用工作流，用于强制用户登录。
    1. 在页面选择器中，单击“添加新的可复用元素…”，并将新的可复用元素命名为：L2L Login
    2. 单击工作流选项卡
    3. 单击名为“单击此处添加事件…”的虚线框添加新事件，然后单击自定义 → 创建自定义事件…
    4. 在对话框中输入以下内容：
      1. 事件名称：L2L Login
      2. 仅当：搜索 UserSessions
      3. 在“搜索 UserSessions”框中输入以下内容：
        1. 类型：UserSession
        2. 添加以下约束：
          1. UserUniqueId = 当前用户的唯一 ID
          2. AuthExpires > 当前日期/时间
      4. 更新 L2L Login 框中的“仅当”部分，使其显示为：搜索 UserSessions：数量为 0
      5. 单击名为“单击此处添加操作…”的虚线框添加新操作
      6. 选择插件 → get_l2l_login_url
      7. 在对话框中输入以下内容：
        1. 调度服务器：搜索 LoginConfigs：第一项的 DispatchServer
        2. Bubble 应用私钥：搜索 LoginConfigs：第一项的 BubbleAppPrivateKey
        3. Bubble 应用证书：搜索 LoginConfigs：第一项的 BubbleAppCertificate
        4. Bubble 应用 URL：搜索 LoginConfigs：第一项的 BubbleAppURL
        5. 回调 URL*：搜索 LoginConfigs：第一项的 CallbackURL  
          1. *对于 2.0.0 及之前的版本，请对回调 URL 使用以下表达式：搜索 LoginConfigs：第一项的 CallbackURL 任意文本 当前用户的唯一 ID，并在任意文本输入项中输入以下文本：?user_unique_id=
        6. 用户唯一 ID：当前用户的唯一 ID
    5. 单击“单击此处添加操作…”添加新操作
      1. 选择导航 → 打开外部网站
      2. 在对话框中输入以下内容：
        1. 目标：步骤 1（get_l2l_login_url）的结果中的 login_url
    6. 将可复用元素的高度设置为 0，以便将其添加到每个页面
      1. 转到设计选项卡
      2. 选择白色框
      3. 在对话框中选择外观选项卡
      4. 将高度设置为：0
  9. 将 L2L Login 工作流添加到所有需要身份验证的页面。本指南将说明如何将其添加到 index 页面。
    1. 在页面选择器中选择“index”，然后选择设计选项卡
    2. 将 L2L Login 从可复用元素部分拖到页面顶部。
    3. 单击工作流选项卡
    4. 单击“单击此处添加事件…”框创建新事件，然后选择常规 → 页面已加载
    5. 单击“单击此处添加操作…”框添加新操作
    6. 选择自定义事件 → 从可复用元素触发自定义事件
    7. 在对话框中输入以下内容：
      1. 可复用元素：L2L Login A（或您的新元素名称）
      2. 自定义事件：L2L Login

配置应用

  1. 在 L2L 调度中添加指向工作室应用的链接
    1. 我们建议在沙盒站点中添加指向开发版本的链接，并在生产站点中添加指向 Live Bubble 应用的链接。对于开发版本，请确保在 Bubble URL 末尾添加 /version-test/。对于 Live 版本，请确保不添加该内容。
  2. 创建一个新的自签名证书和密钥，用于通过 L2L 调度服务器验证 Bubble 应用。这些内容将在第 3 步中使用。
  3. 下载 L2L 证书。
  4. 在 Bubble 中输入新的应用数据。构建应用时，请务必选择开发数据库。部署到 Live 时，请务必选择 Live 数据库。
    1. 转到 Data → App data 选项卡，选择“All LoginConfigs”，然后点击“New entry”按钮。
    2. 在新表单中输入以下内容：
      1. AuthExpiresMinutes → 720
        1. 720 分钟就是 12 小时。您可以根据应用的实际需求自定义此字段。
      2. BubbleAppCertificate → 复制/粘贴第 2 步中生成的 certificate.pem 文件的全部内容。
      3. BubbleAppPrivateKey → 复制/粘贴第 2 步中生成的 key.pem 文件的全部内容。
      4. BubbleAppURL → 这是 Bubble 应用的 URL。如果您拥有自定义域名，可以在 Bubble 编辑器的 Settings → Domain / email 下找到它。如果您没有自定义域名，可以在 Bubble 应用列表屏幕上点击“run”按钮找到它。删除除完整域名之外的所有内容。它看起来像这样：acme-app.bubbleapps.io
        1. 在您的开发和 Live Bubble 数据库中，它将保持不变。不要添加 /version-test。
      5. CallbackURL → 身份验证完成后，L2L 将把浏览器返回到此 URL。您需要构建此 URL。首先复制 Settings → API 屏幕中名为“Workflow API root URL”的 URL。然后在末尾添加“/login_complete”。它应该看起来像这样：https://acme-app.bubbleapps.io/version-test/api/1.1/wf/login_complete
      6. DispatchCertificate → 这是 L2L 调度服务器的证书。该证书已在第 3 步中下载。
      7. DispatchServer → 这是客户的 L2L 调度服务器。请务必包含“https://”。它应该看起来像这样：https://acme.leading2lean.com

发布应用

现在 L2L 插件已添加、数据和工作流已定义且应用已配置完成，您可以发布应用了。部分 Bubble 功能在发布前处于禁用状态，因此必须添加订阅，才能完整测试 L2L 登录插件。

应用测试完成后，您需要为 Live 站点配置应用。只需按照“配置应用”部分中的步骤为您的 Live 数据库进行操作。

故障排除

如果 Bubble 应用或 L2L 服务器出现错误，请检查以下内容：

  • 检查每个登录配置，确保其中没有多余的空格或换行。
  • 确保登录配置中的 Bubble 应用 URL 与 L2L 工作室应用配置的 URL 相匹配。

相关文章