Widget "Einbetten"

Mit dem Widget "Einbetten" können Sie Inhalt über eine URL oder mittels Code in Websites einbetten, sodass zusätzliche benutzerdefinierte Funktionen zur Verfügung stehen.

Beispiele

Verwenden Sie dieses Widget, um zum Beispiel die folgenden Anforderungen an das App-Design zu unterstützen:

• Es besteht die Anforderung, zusätzliche Informationen aus einer Website basierend auf der Auswahl von Features bereitzustellen. Der Feature-Layer enthält ein Feld mit URLs zu Websites, die Sie einbetten möchten, wenn ein Benutzer ein Feature auf der Karte auswählt oder auf eine Schaltfläche klickt, um weitere Informationen für dieses Feature anzuzeigen.
• Sie möchten ein Dashboard in Ihre App einbetten und Benutzern das Anhängen eines URL-Parameters an das Ende der Web-Experience-URL ermöglichen, um die aktuelle Ansicht des Dashboards zu ändern (z. B. zum Anzeigen von Daten für eine bestimmte Region).
• Sie möchten mit HTML-Code Inhalt einbetten (zum Beispiel eine Website) oder den Code aus einem Beispiel kopieren (zum Beispiel Punkt-Cluster-Bildung).

Verwendungshinweise

Das folgende Beispiel veranschaulicht, wie benutzerdefinierter Code zum Einbetten eines IFrame verwendet wird:

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

Hinweis:

Wenn Sie festlegen, dass eine PDF-Datei direkt im Widget "Einbetten" angezeigt wird, ist in bestimmten Browsern die Anzeige aus Sicherheitsgründen nicht möglich.

Zum Erstellen einer dynamischen URL mithilfe von URL-Parametern speichern Sie die App mit dem zu verwendenden URL-Parameter, und laden Sie sie neu, damit Sie im Fenster URL-Informationen einen entsprechenden Schlüssel auswählen können. Zur Laufzeit findet das Widget "Einbetten" den Namen der angegebenen URL-Informationen, gleicht ihn mit den URL-Parametern ab, die der URL der Host-App hinzugefügt wurden, und löst die URL mit dem entsprechenden Wert auf, um die eingebettete App anzuzeigen.

Einstellungen

Das Widget "Einbetten" verfügt über folgende Einstellungen:

• Einbetten mit: Legen Sie fest, ob der Inhalt per URL oder Code eingebettet wird.
  • URL: Betten Sie eine Website mit einer statischen URL ein, oder verwenden Sie die folgenden Optionen, um eine dynamische URL zu bilden:

    Hinweis:

    Es werden nur HTTPS-URLs unterstützt. Aus Sicherheitsgründen wird die eingebettete App durch die Same-Origin-Policy eingeschränkt. Für Domänen außer *.arcgis.com und *.esri.com wird das sandbox-Attribut automatisch hinzugefügt.

    • Mit Daten verbinden: Wählen Sie einen (aus Webkarten, Webszenen, direkten Layern oder über eine URL hinzugefügten) Layer als Datenquelle aus, und klicken Sie auf die Schaltfläche Daten, um ein Attribut auszuwählen, das URLs enthält, oder eine vorhandene URL als Parameter hinzuzufügen. Verwenden Sie das Feld Beschriftung zum Anzeigen einer Beschreibung im Widget, wenn das Feld nicht mit dem Inhalt einer URL in den Daten gefüllt ist.
    • URL-Informationen: Rufen Sie URL-Parameter ab, die Sie im Builder als Suffix zu Ihrer App-URL hinzufügen. Konfigurieren Sie eine dynamische URL, um URL-Parameter aus dem Widget "Einbetten" der eingebetteten App zu übergeben, damit Benutzer zur Laufzeit URL-Parameter zur Web-Experience-URL hinzufügen können, um zu steuern, was in der eingebetteten App angezeigt wird.

      Hinweis:

      Weitere Informationen zu von der eingebetteten App unterstützten URL-Parametern finden Sie in der jeweiligen Dokumentation, beispielsweise für ArcGIS Dashboards und ArcGIS Web AppBuilder.

  • Code: Fügen Sie eigenen benutzerdefinierten Code zum Einbetten von Drittanbieterelementen in Ihrer Experience ein. Unterstützt werden HTML-Code, CSS-Code in <style>-Tags und JavaScript-Code in <script>-Tags.

    Tipp:

    Wenn Sie eine komplexe HTML-Seite mit einer Größe von mehr als dem aus Performance-Gründen festgelegten Limit von 8 KB einbetten möchten, stellen Sie die Seite stattdessen auf Ihrem eigenen Server bereit, und betten Sie sie mithilfe einer URL ein.

    Hinweis:

    Beim Einbetten mithilfe von Code wird das sandbox-Attribut automatisch ohne allow-same-origin-Anweisung hinzugefügt. Damit kann der eingebettete Inhalt JavaScript ausführen und sein eigenes Cookie oder Informationen zum lokalen Speicher lesen. Er kann jedoch nicht auf das DOM, das Cookie, den lokalen Speicher usw. der Experience Builder-App zugreifen.

• Automatisch aktualisieren: Legen Sie ein benutzerdefiniertes Zeitintervall in Minuten fest, in dem der eingebettete Inhalt im Widget "Einbetten" automatisch aktualisiert wird. Der Minimalwert beträgt 0,2 Minuten (12 Sekunden).

Konfigurieren einer dynamischen URL

Gehen Sie wie folgt vor, um aus Ihrer Web Experience URL-Parameter abzurufen, die Sie einer eingebetteten App übergeben können:

1. Fügen Sie ein Einbetten-Widget hinzu, und speichern Sie.
2. Fügen Sie in der Adressleiste des Browser-Fensters den URL-Parameter Ihrer Web-Experience-URL hinzu, und drücken Sie die EINGABETASTE, um die Seite neu zu laden.

   Tipp:

   Da der Builder bereits den App-ID-Parameter enthält, fügen Sie den URL-Parameter mit einem kaufmännischen Und-Zeichen (&state=) anstatt mit einem Fragezeichen hinzu.

   Wenn der Builder mit dem URL-Parameter neu geladen wird, kann mit der Schaltfläche URL-Informationen der zugehörige Schlüssel zum Erstellen einer dynamischen URL angezeigt werden.

3. Fügen Sie im URL-Eingabefeld Einbetten mit die URL für die einzubettende App ein.
4. Geben Sie am Ende der URL für die Einbettung den URL-Parameter ein (beispielsweise ?state=).
5. Klicken Sie auf die Schaltfläche URL-Informationen, und wählen Sie den entsprechenden Schlüssel aus, um die dynamische URL zu vervollständigen.

   Das folgende Beispiel zeigt eine dynamische URL für ein eingebettetes Dashboard:

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