如果能够直接将生成的应用集成到用户工作时使用的工具中,通常最为实用。 借助 PowerApps,可以将应用嵌入 iframe,以便于将这些应用集成到网站和 Power BI 仪表板中。

本主题先会介绍如何设置应用嵌入参数;然后,我们将会把资产订购应用嵌入网站和仪表板。

嵌入了应用的 Power BI 仪表板

注意:只有同一租户中的 PowerApps 用户,才能访问嵌入应用。

还可以将 PowerApps 集成到 SharePoint Online 中(不使用 iframe)。 有关详细信息,请参阅使用 PowerApps 从 SharePoint 中生成应用

设置应用 URI 参数

若有要嵌入的应用,第一步是设置统一资源标识符 (URI) 参数,以便 iframe 知道在何处查找应用。 URI 的格式如下:

https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
source=iframe&appId=/providers/Microsoft.PowerApps/apps/[AppID]

注意:为了提升 URI 在页面上的显示效果,我们添加了换行符。

只需将 URI 中的 [AppID] 替换成应用 ID。 稍后,我们将介绍如何获取此值,而现在将先介绍 URI 中的所有参数:

  • appID - 格式为 /providers/Microsoft.PowerApps/apps/[AppID]。 用于提供要运行的应用的 ID。
  • hideNavBar - 用于控制是否对应用显示 Dynamics 365 标头的布尔值 (true/false)。 如果只要在网站中嵌入这一个应用,建议使用值 true
  • screenColor - 用于为用户提供更好的应用加载体验。 此参数的格式为 RGBA (red value, green value, blue value, alpha),用于控制应用加载时的屏幕颜色。 最好将此参数设置为与应用图标的颜色相同。
  • source - 虽然不影响应用,但建议添加描述性名称来指代嵌入来源。
  • 最后,可以使用 Param() 函数添加所需的任何自定义参数,并且这些值可供应用使用。 这些参数添加到 URI 的末尾,如 [AppID]&param1=value1。 在应用的启动阶段,这些参数为只读;如果需要更改它们,必须重启应用。

获取应用 ID

可以在 powerapps.com 上获取应用 ID。 对于要嵌入的应用,请执行以下操作:

  1. powerapps.com 中,依次单击或点击“应用”选项卡上的省略号(“...” )和“详细信息”。

    转到应用详细信息

  2. 复制“应用 ID”。

    从“详细信息”中复制应用 ID

  3. 替换 URI 中的 [AppID] 值。 对于资产订购应用,URI 如下所示:

    https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
    source=iframe&appId=/providers/Microsoft.PowerApps/apps/76897698-91a8-b2de-756e-fe2774f114f2
    

将应用嵌入网站

现在,嵌入应用与将 iframe 添加到网站的 HTML 代码中一样简单:

<iframe width="[W]" height="[H]" src="https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/[AppID]"/>

指定 iframe 宽度和高度值,然后将 [AppID] 替换成应用 ID。

下图展示了嵌入 Contoso 示例网站的资产订购应用。

嵌入了应用的 Contoso 网站

对应用用户进行身份验证时,请注意以下几点:

  • 如果网站使用 Azure Active Directory (AAD) 身份验证,用户无需额外登录。
  • 如果网站使用其他任何登录机制或网站未经身份验证,用户将会在 iframe 上看到登录提示。 登录后,用户便可以运行应用,但前提是应用的作者已与其共享应用。

将应用嵌入 Power BI 仪表板

根据我们提出的衡量、操作和自动化发展愿景,我们认为应用的最佳使用位置通常是用于衡量数据和监视报表的上下文。

在此示例中,我们已创建了 Power BI 仪表板来监视公司的产品销售额。 我们在此仪表板中关注计算机硬件销售趋势,并直接在此仪表板中嵌入的应用内订购新的硬件清单。 通过嵌入应用,我们的清单专员可以转到一个位置来执行其工作,并对能够继续留在已习惯使用的 Power BI 仪表板中感到满意。

下图展示了直接嵌入仪表板的资产订购应用,以及为硬件订购过程提供上下文的销售图表。

嵌入了应用的 Power BI 仪表板

若要将应用嵌入 Power BI 仪表板,请按照以下步骤操作:

  1. 按照上文所述方法创建 URI:

    https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
    source=powerbi&appId=/providers/Microsoft.PowerApps/apps/76897698-91a8-b2de-756e-fe2774f114f2
    
  2. 将 URI 添加到 iframe 中。 在此示例中,我们将架构宽度和高度设置为 98%,以免在磁贴上显示滚动条:

    <iframe width="98%" height="98%" src="https://web.powerapps.com/webplayer/iframeapp?hideNavBar=true&
    source=powerbi&appId=/providers/Microsoft.PowerApps/apps/76897698-91a8-b2de-756e-fe2774f114f2"/>
    
  3. 转到要在其中嵌入应用的 Power BI 仪表板。

  4. 在仪表板顶部菜单栏中,单击或点击“添加磁贴”。 可能只看到加号 (+),具体视空间限制而定。

    在 Power BI 仪表板中添加磁贴

  5. 依次单击或点击“Web 内容”和“下一步”。

    将 Web 内容添加到仪表板中

  6. 将 iframe 代码粘贴到“嵌入代码”字段中,然后单击或点击“应用”。

    Web 内容的嵌入代码

  7. 现在,磁贴应显示在仪表板上,可以根据需要将其移到目标位置,就像移动其他任何磁贴一样。 若要详细了解如何将磁贴添加到仪表板中,请参阅向仪表板添加图像、文本、视频等

如你所见,嵌入应用不仅操作简单,而且还能提供非常强大的功能。 通过嵌入应用,可以将应用直接集成到你和客户工作时使用的工具(网站和 Power BI 仪表板)中。