本页面将向您逐步介绍如何设置私密嵌入。私密嵌入选项要求您直接管理 <iframe> HTML 元素以嵌入您的 Looker 内容,并要求用户从托管应用单独登录 Looker。
我们将详细介绍以下私密嵌入代码示例:
<iframe
src="https://instance.looker.com/embed/dashboards/4?Timeframe=14+day"
width="600"
height="300"
frameborder="0">
</iframe>
1. 构建嵌入内容网址
我们以网址 https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day
处的 Looker 内容为例。我们将根据此 Looker 内容网址构建嵌入内容网址,并将 iframe 的 src
属性设为该网址。在完成这些步骤时,您可以随意使用自己的 Looker 内容网址。
上述代码示例中的嵌入内容网址如下所示:
嵌入内容网址由三部分组成:
- 主机名:您的 Looker 实例的主机名
- 路径:以
/embed
为前缀的 Looker 内容网址路径(包含用于查询可视化图表的额外步骤) - 参数:用于指定过滤条件和主题的网址参数
协议必须始终为 https://
。我们来详细构建各个部分。
第 1 部分:主机名
- 前往您的 Looker 内容。以下是 Looker 内容网址示例:
https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day
。 - 您的嵌入内容网址主机名为
instance.looker.com
。
第 2 部分:路径
嵌入内容网址路径取决于您嵌入的 Looker 内容。
嵌入除查询可视化图表之外的所有 Looker 内容
- 前往您的 Looker 内容。以下是 Looker 内容网址示例:
https://instance.looker.com/dashboards/4?theme=red&Timeframe=14+day
- 确定 Looker 内容网址的路径:
/dashboards/4
。 - 在您的 Looker 内容网址的路径上添加
/embed
前缀。您的嵌入内容网址的路径是/embed/dashboards/4
。
嵌入查询可视化图表
- 转到查询可视化图表。示例网址:
instance.looker.com/explore/my_model/my_explore?qid=1234567890abcdefghij12
- 确定您的查询客户端 ID。
qid
参数:1234567890abcdefghij12
是查询的客户端 ID,代表查询和可视化图表设置。 - 您的嵌入内容网址路径为附加了查询客户端 ID 的
/embed/query-visualization/
。示例嵌入内容网址的路径为/embed/query-visualization/1234567890abcdefghij12
第 3 部分:参数
嵌入内容网址参数用于控制嵌入内容的过滤器和主题。
过滤条件
- 前往您的 Looker 内容网址。
- 根据需要手动调整内容的滤镜。在此示例中,生成的 Looker 内容网址为:
https://instance.looker.com/dashboards/4?Timeframe=14+day
- 您的嵌入内容网址参数是 Looker 内容网址参数,例如
Timeframe=14+day
在此示例中,参数 Timeframe=14+day
会设置信息中心的 Timeframe
过滤条件的值。
主题
请查看主题指南,了解如何控制嵌入内容的外观。
2. 测试嵌入内容网址
在浏览器中打开嵌入内容网址,预览嵌入内容的行为和外观。
3. 创建 iframe
- 在托管应用中创建 iframe 元素。
- 将
src
属性设置为您的嵌入内容网址。 - 根据您的需要定义
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 实例添加自定义网域,以便托管应用和嵌入内容网址的主机名 Looker 实例位于同一网域下。
5. 与 iframe 交互
开始使用 Looker 嵌入 iframe 帖子。
后续步骤
开始使用我们的 Embed SDK 实现签名嵌入,并查看相关示例了解 Looker 嵌入的用途。