当前位置 > 支持 > 帮助中心 > Tableau 帮助手册 > Tableau Desktop 与 Web 制作 > 帮助 > 在 Web 上使用 Tableau

将指标嵌入网页

版本：2022.1 及更高版本

适用于： Tableau Online, Tableau Server

您可以嵌入指标以在与您的查看者最相关的上下文中将它们与其他 Web 内容一起显示。当您加载嵌入的指标时，您将获得最新的可用数据，因为您直接连接到 Tableau Server 或 Tableau Online 上的数据。

若要将指标嵌入网页，请复制 Tableau Server 或 Tableau Online 上提供的 HTML 嵌入代码或使用下面显示的 JavaScript 示例。您可以在单个页面上嵌入多个指标，只要这些指标来自同一个 Tableau 站点。

嵌入式指标与 Tableau Online 和 Tableau Server 支持的相同 Web 浏览器一起使用。有关受支持浏览器的列表，请参见技术规范。尽管 Safari 支持嵌入，但查看者必须关闭“防止跨站点跟踪”才能看到嵌入的内容。

请注意，嵌入式指标的嵌入代码和参数与用于嵌入式视图的代码和参数不同。有关嵌入式视图的信息，请参见将视图嵌入网页。

复制嵌入代码

嵌入指标的最快方法是复制 Tableau 提供的嵌入代码。

在 Tableau Online 或 Tableau Server 上，导航到要嵌入的指标的详细信息页面。
单击“共享指标”按钮。
单击“复制嵌入代码”。
将嵌入代码粘贴到要嵌入指标的网页中。

编写自己的嵌入代码

当您从 Tableau Server 或 Tableau Online 复制嵌入代码时，您复制的是 HTML 嵌入代码（不含任何可选参数）。如果您想更好地控制嵌入的指标，您可以自定义 HTML 或使用 JavaScript 示例编写您自己的脚本。

HTML 示例

tableau-metric
	src='https://mycompany/#/metrics/1'
	linkTarget='https://example.com'>tableau-metric>script type='module' src='https://mycompany/javascripts/api/tableau.metric.1.latest.min.js'>script>

JavaScript 示例

'metricDiv'/>script type='module'>
	import { TableauMetric } from 'https://mycompany/javascripts/api/tableau.metric.1.latest.min.js';				
	let metric = new TableauMetric();

	metric.src = 'https://mycompany/#/metrics/1';
	metric.linkTarget = 'https://example.com';document.getElementById('metricDiv').appendChild(metric);script>

嵌入代码的参数

嵌入代码的参数可用于自定义 HTML 和 JavaScript 嵌入选项。

参数	值	说明	示例
来源（必需）	字符串	Tableau Server 或 Tableau Online 上指标的 URL。	`https://mycompany/#/metrics/1`
linkTarget （可选）	字符串	查看者单击该指标时将被定向到的 URL。如果未指定目标，则嵌入的指标将链接到源 URL。	`http://example.com`

嵌入式指标的身份验证

嵌入式指标遵守 Tableau Server 和 Tableau Online 上使用的相同许可和权限限制。若要查看嵌入式指标，查看者必须登录嵌入该指标的 Tableau 站点上的帐户。与嵌入式视图不同，嵌入式指标不允许使用来宾帐户向未登录的查看者显示指标。

未在另一个选项卡中登录 Tableau Server 或 Tableau Online 的查看者将被提示从嵌入式指标本身登录。若要从嵌入式指标成功登录，必须将查看者的浏览器配置为允许第三方 Cookie。

嵌入式指标支持 Tableau Server 和 Tableau Online 的所有身份验证方法，受信任的身份验证除外。对于从 Tableau Server 嵌入的指标，服务器必须使用 HTTPS 来保护通信。

若要为嵌入式指标启用单点登录体验，您的 Tableau 管理员必须在 Tableau Server 与外部授权服务器（仅限 Tableau Server）或与 Tableau 已连接应用和网页之间配置信任关系。有关详细信息，请参见 Tableau Server 帮助中的注册 EAS 以启用嵌入内容的 SSO(链接在新窗口中打开)或 Tableau Online 帮助中的配置 Tableau 已连接应用以启用嵌入内容的 SSO(链接在新窗口中打开)。

如何构建指标 URL

若要嵌入指标，请指定指标 URL 和用于呈现指标的 JavaScript 的 URL。指标 URL 在 Tableau Online、具有单个站点的 Tableau Server 环境和多站点 Tableau Server 环境中遵循略有不同的模式。如果您不确定如何设置 URL 格式，请复制嵌入代码，因为它同时包含指标 URL 和 JavaScript URL。

指标必须托管在 Tableau Server 或 Tableau Online 上。您不能通过本地文件嵌入指标。

指标 URL 结构

Tableau Online 站点：https://
Tableau Server 单个站点（或默认站点）：https://
Tableau Server 多站点：https://

JavaScript URL 结构

指标 URL 会因您嵌入的站点而异，但呈现指标的 JavaScript 的 URL 不会更改，因为它不包含该站点。

Tableau Online 站点：https://
Tableau Server：https://