嵌入微件

“嵌入”微件用于通过 URL 或代码嵌入网站内容,以实现额外的自定义功能。

示例

使用此微件可支持以下应用程序设计要求:

  • 您需要根据要素选择从网站提供其他信息。 要素图层上存在一个字段,其中包含用户在地图上选择某个要素或单击按钮以查看该要素的详细信息后您想要嵌入的网站 URL。
  • 您想要在应用程序中嵌入仪表盘,并允许最终用户向 Web 体验 URL 末尾添加 URL 参数,以更改仪表盘的当前视图(从而显示特定区域数据)。
  • 您想要使用 HTML 代码(例如网站)嵌入内容,或复制示例中的代码(例如点聚类)。

用法说明

下面是如何使用自定义代码嵌入 iframe 的示例:

<iframe width="100%" height="600px" frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="https://developers.arcgis.com/"></iframe></div>
注:

如果您选择直接在“嵌入”微件中显示 PDF,出于安全原因,某些用户可能无法在某些浏览器中查看它。

要使用 URL 参数创建动态 URL,使用要使用的 URL 参数保存并重新加载应用程序,以在 URL 信息窗口中选择相应的键。 在运行时,“嵌入”微件会使用添加到主机应用程序 URL 的 URL 参数查找指定 URL 的名称并与之匹配,然后使用相应的值解析 URL 以显示嵌入的应用程序。

设置

“嵌入”微件包含以下设置:

  • 嵌入方式 - 选择是通过 URL 还是代码进行嵌入。
    • URL - 使用静态 URL 嵌入网站或使用以下选项形成动态 URL。
      注:

      仅支持 HTTPS URL。 出于安全考虑,会通过同源策略对嵌入的应用程序进行约束。 对于 *.arcgis.com*.esri.com 之外的域,系统会自动添加 sandbox 属性

      • 连接到数据 - 选择图层作为数据源(从 web 地图、web 场景、直接地图或通过 URL 进行添加)。然后单击数据按钮以选择包含 URL 或要添加到现有 URL 作为参数的属性。
      • URL 信息 - 获取在构建器中要作为后缀添加到应用程序 URL 的 URL 参数。 将动态 URL 配置为将 URL 参数从“嵌入”微件传递到嵌入应用程序,以便最终用户可以在运行时将 URL 参数添加到 web 体验 URL,来控制嵌入应用程序的显示内容。
        注:

        有关嵌入应用程序支持的 URL 参数的信息,请参考 ArcGIS DashboardsArcGIS Web AppBuilder 等对应的文档。

    • 代码 - 添加自定义代码,以将第三方元素嵌入到体验中。 它支持 HTML、位于 <style> 标签中的 CSS 和位于 <script> 标签中的 JavaScript
      注:

      通过代码嵌入时,系统会自动添加 sandbox 属性,无需使用 allow-same-origin 指令。 这允许嵌入内容运行 JavaScript 并读取其自己的 cookie 或本地存储信息,但是无法访问 Experience Builder 应用程序 DOM、cookie 本地存储等。

  • 自动刷新 - 设置自定义时间间隔(以分钟为单位),以自动刷新“嵌入”微件中的嵌入内容。 您可设置的最小值为 0.2 分钟(12 秒)。

配置动态 URL

按照以下步骤从 Web 体验中获取可传递到嵌入应用程序的 URL 参数。

  1. 添加“嵌入”微件并进行保存。
  2. 在浏览器窗口的地址栏中,将 URL 参数添加到 Web 体验 URL,然后按 Enter 键以重新加载页面。
    提示:

    由于构建器已包含应用程序 ID 参数,使用与号(例如 &state=)添加 URL 参数,而不是问号。

    使用 URL 参数重新加载构建器后,URL 信息按钮将显示用于构建动态 URL 的键。

  3. 嵌入方式 URL 输入框中,粘贴要嵌入的应用程序的 URL。
  4. 在嵌入 URL 末尾,输入 URL 参数(例如 ?state=)。
  5. 单击 URL 信息按钮,然后选择对应的键以完成动态 URL。

    下面是嵌入仪表盘的示例动态 URL:

    https://<your portal url>/apps/opsdashboard/index.html#/<id>?state={appURL.search.state}