开始使用私密嵌入

知识测验：本页假定您了解内嵌框架 <iframe> HTML 元素、统一资源定位符（网址）和第三方 Cookie 的基础知识。查看关于 iframe 的 MDN 网络文档，熟悉一下其中的基本知识。

本页面将向您介绍如何设置专用嵌入。专用嵌入选项要求您直接管理 <iframe> HTML 元素才能嵌入 Looker 内容，并且用户需要独立于托管应用登录 Looker。

我们将演示此私有嵌入代码示例：

<iframe
    src="https://instance.looker.com/embed/dashboards/4?Timeframe=14+day"
    width="600"
    height="300"
    frameborder="0">
</iframe>

注意 ：以下说明适用于所有嵌入式 Looker 内容：信息中心、LookML 信息中心、探索、Look、查询可视化和扩展程序。

1. 构建嵌入内容网址

我们来看一个位于网址 https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day 的 Looker 内容示例。在此 Looker 内容网址中，我们将构建嵌入内容网址，并为其设置 iframe 的 src 属性。在执行这些步骤时，您可以使用自己的 Looker 内容网址。

上述代码示例中的嵌入内容网址如下：

https://instance.looker.com/embed/dashboards/4?theme=red&Timeframe=14+day

嵌入内容的网址由以下三部分组成：

• 主机名：您的 Looker 实例的主机名
• 路径：以 /embed 为前缀的 Looker 内容网址路径（包含查询可视化图表的额外步骤）
• 参数：用于指定过滤条件和主题的网址参数

协议必须始终为 https://。我们来详细了解一下每个部分。

注意 ：您可将嵌入内容网址视为一个完整的 Looker 内容网址，其路径前缀为 embed/（除非您要嵌入下文所述的查询可视化图表）。

第 1 部分：主机名

1. 转到您的 Looker 内容。Looker 内容网址示例之后：https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day。
2. 您的嵌入内容主机名是 instance.looker.com。

注意 ：主机名包含端口号（如果存在），例如instance.looker.com:9999。

第 2 部分：路径

您的嵌入内容网址路径取决于您嵌入的 Looker 内容。

嵌入所有 Looker 内容（查询可视化除外）

1. 转到您的 Looker 内容。以 Looker 内容网址为例：https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day
2. 确定您的 Looker 内容网址的路径：/dashboards/4。
3. 为您的 Looker 内容网址的路径添加 /embed 前缀。您的嵌入内容网址的路径为 /embed/dashboards/4。

嵌入查询可视化图表

1. 前往查询可视化图表。示例网址：instance.looker.com/explore/my_model/my_explore?qid=1234567890abcdefghij12
2. 确定您的查询的客户端 ID。qid 参数：1234567890abcdefghij12 是查询的客户端 ID，代表查询和可视化设置。
3. 嵌入内容的网址的路径附加了查询客户端 ID /embed/query-visualization/。嵌入内容的网址示例为 /embed/query-visualization/1234567890abcdefghij12

注意：您还可以将 Looker API 的 Get Query 方法作为 Query 对象的 client_id 字段来查找查询的客户端 ID。

第 3 部分：参数

嵌入内容网址参数可控制嵌入式内容的过滤条件和主题。

过滤器

1. 转到您的 Looker 内容网址。
2. 根据需要手动调整内容的过滤条件。在此示例中，生成的 Looker 内容网址为：https://instance.looker.com/dashboards/4?Timeframe=14+day
3. 您的嵌入内容网址参数是 Looker 内容网址参数，例如 Timeframe=14+day

在此示例中，参数 Timeframe=14+day 用于设置信息中心的 Timeframe 过滤条件的值。

注意 ：过滤器参数不会创建过滤器，必须事先存在于信息中心内。

主题

请参阅主题指南，了解如何控制嵌入内容的外观。

2. 测试您的嵌入内容网址

在浏览器中打开嵌入内容网址，即可预览嵌入内容的行为和外观。

3. 创建 iframe

1. 在宿主应用中创建 iframe 元素。
2. 将 src 属性设置为您的嵌入内容网址。
3. 定义 width、height 以及其他属性，以便充分显示您嵌入的 Looker 内容。

4.考虑用户访问问题

用户必须登录 Looker 才能查看嵌入的内容。如果用户未登录，iframe 会显示 401 错误页面。

用户登录选项

您的用户可通过以下两种方式之一登录 Looker：

1. 提前登录 Looker

用户必须在同一浏览器中登录 Looker，才能查看嵌入的内容。

2. 启用可选的嵌入式 Looker 登录屏幕

将 allow_login_screen=true 添加到您的嵌入内容网址参数，即可在用户未登录的情况下，在 iframe 中显示 Looker 登录屏幕。我们的嵌入内容网址示例将变为：https://instance_name.looker.com/embed/dashboards/4?Timeframe=14+day&allow_login_screen=true。

请注意两点：

• 您必须停用“针对 Looker 登录页面的同源保护”设置，才能在 iframe 嵌入中启用 Looker 登录屏幕。
• 如果您的 Looker 实例通过身份提供方的单点登录 (SSO) 对用户进行身份验证，则您的身份提供方可能会在您的 iframe 内屏蔽登录屏幕。如果出现这种情况，您需要使用方案 1。

用户浏览器 Cookie 政策

Looker 使用 Cookie 进行用户身份验证和会话存储。如果用户访问 Looker 实例的嵌入内容网址的主机名与托管应用位于不同的网域，则用户的浏览器必须启用第三方 Cookie。

某些浏览器（如 Firefox 和 Safari）默认采用会屏蔽第三方 Cookie 的 Cookie 政策。如果用户的浏览器不支持第三方 Cookie，您可以向 Looker 实例添加自定义网域，使托管应用和嵌入内容网址的 hostnameLooker 实例位于同一网域下。

5. 与 iframe 互动

开始使用 Looker 嵌入 iframe 帖子消息。

后续步骤

开始使用我们的 Embed SDK 实现单点登录嵌入，并查看 Looker 嵌入功能的例子。