使用启动提高性能

powerbi.bootstrap 是客户端 SDK 版本 2.9.0 中引入的方法,可帮助开发人员更快地嵌入 Power BI 实体并提升性能。

使用 powerbi.embed 嵌入报表需要多个参数,例如 reportIdembedURLaccessToken。 这些参数并不总是立即可用。

powerbi.bootstrap 允许在提供所有必需参数之前开始嵌入。 启动 API 准备并初始化 iframe。

收到所需的参数后,应在同一 HTML 元素上调用 powerbi.embed(element, config)

Bootstrap API

powerbi.bootstrap(element, config) 方法接收元素和配置,与 powerbi.embed(...)相同。

/**
    * Given an HTML element and entityType, creates a new component instance, and bootstrap the iframe for embedding.
    *
    * @param {HTMLElement} an HTML Element where you need to embed. must be the same div element you will use in powerbi.embed.
    * @param {IBootstrapEmbedConfiguration} config: a bootstrap config.
    */
bootstrap(element: HTMLElement, config: IBootstrapEmbedConfiguration): embed.Embed;

启动嵌入配置

interface IBootstrapEmbedConfiguration {
  type: string;
  hostname?: string;
  embedUrl?: string;
  settings?: ISettings;
}

配置参数:

  • 类型(必需):要嵌入的实体类型,例如“report”、“dashboard”、“tile”、“qna”或“visual”。
  • 主机名:如果还没有 embedURL,可以提供主机名。 主机名是嵌入 URL 的域名。 例如,如果嵌入 URL 为“https://app.powerbi.com/reportEmbed”,则主机名为“https://app.powerbi.com/”。 如果未提供主机名或 embedUrl,则使用默认主机名 https://app.powerbi.com/
  • embedUrl:稍后将为 powerbi.embed 提供相同的嵌入 URL。 如果未提供主机名或 embedUrl,则使用默认主机名 https://app.powerbi.com/
  • 设置:若要在移动布局中嵌入报表或提供区域设置(语言),请在初始设置中包含这些参数。

Bootstrap 示例

以下示例在嵌入 Power BI 实体时提供引导方法的参考。

注意

请确保在收到嵌入参数后调用 powerbi.embed

若要启动用于嵌入报表,请执行以下操作:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
        }
    );

若要启动嵌入仪表板,请执行以下操作:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'dashboard',
            embedUrl: "https://app.powerbi.com/dashboardEmbed?dashboardId=06e3ba63-47ea-4579-b010-fdb5484b325a&config=eyJjbHVzdGVyVXJsIjoiaHR0cHM6mLndpbmRvd3MubmV0In0="
        }
    );

若要启动以仅主机名嵌入报表,请执行以下操作:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
            hostname: "https://app.powerbi.com"
        }
    );

若要启动以移动布局嵌入报表,请执行以下操作:

powerbi.bootstrap(
        reportContainerDivElement,
        {
            type: 'report',
            hostname: "https://app.powerbi.com",
            settings: {
	            layoutType: models.LayoutType.MobilePortrait
            }
        }
    );

注意事项和限制

  • 如果不调用 powerbi.reset(element),则无法更改以下启动实体。

    • 组件类型(报表,仪表板):例如,如果启动报表,则只能在同一 HTML 元素中嵌入报表。
    • 布局(桌面/移动版)
    • 区域设置(语言)
  • 嵌入分页报表时不支持 powerbi.bootstrap 方法。