Teilen über


Hinzufügen eines iFrames zu einer Toolerweiterung

In diesem Artikel fügen wir einer neuen, leeren Toolerweiterung einen iFrame hinzu, den wir mit der Windows Admin Center CLI erstellt haben.

Vorbereiten der Umgebung

Wenn Sie dies noch nicht getan haben, folgen Sie den Anweisungen unter Entwickeln einer Toolerweiterung, um Ihre Umgebung vorzubereiten und eine neue, leere Toolerweiterung zu erstellen.

Hinzufügen eines Moduls zu Ihrem Projekt

Fügen Sie Ihrem Projekt ein neues leeres Modul hinzu, dem im nächsten Schritt ein iFrame hinzugefügt wird.

Hinzufügen eines iFrames zu Ihrem Modul

Nun fügen wir dem neuen, leeren Modul, das wir gerade erstellt haben, einen iFrame hinzu.

Navigieren Sie in „\src\app“ zu Ihrem Modulordner, und öffnen Sie dann die Datei {!module-name}.component.html, die der folgenden Namenskonvention entspricht:

Wert Erklärung Beispieldateiname
{!module-name} Der Modulname (in Kleinbuchstaben, Leerzeichen durch Bindestriche ersetzt) manage-foo-works-portal.component.html

Fügen Sie der HTML-Datei folgenden Inhalt hinzu:

<div>
  <iframe  style="height: 850px;" src="https://www.bing.com"></iframe>
</div>

Das war‘s, Sie haben Ihrer Erweiterung einen iFrame hinzugefügt. Als Nächstes können Sie Ihre Erweiterung in Windows Admin Center erstellen und quer laden, um die Ergebnisse anzuzeigen.

Hinweis

Einstellungen der Richtlinie für Inhaltssicherheit (Content Security Policy, CSP) könnten verhindern, dass manche Websites in einem iFrame innerhalb von Windows Admin Center gerendert werden. Weitere Informationen dazu finden Sie hier.