So passen Sie das Azure API Management-Entwicklerportal mithilfe von Vorlagen an
Es gibt drei grundlegende Möglichkeiten, das Entwicklerportal in Azure API Management anzupassen:
- Bearbeiten des Inhalts von statischen Seiten und Seitenlayoutelementen
- Aktualisieren der Stile, die für Seitenelemente im gesamten Entwicklerportal verwendet werden
- Ändern der Vorlagen, die für durch das Portal generierte Seiten verwendet werden (in diesem Leitfaden erläutert)
Vorlagen dienen zum Anpassen des Inhalts von systemgenerierten Entwicklerportalseiten (z.B. API-Dokumentation, Produkte, Benutzerauthentifizierung usw.). Sie können die Seiteninhalte mithilfe von DotLiquid-Syntax und verschiedenen lokalisierten Zeichenfolgenressourcen, Symbolen und Seitensteuerelementen flexibel an Ihre Bedürfnisse anpassen.
Hinweis
Der folgende Dokumentationsinhalt bezieht sich auf das veraltete Entwicklerportal. Sie können das Portal bis zu seiner Einstellung im Oktober 2023 wie gewohnt weiter nutzen. In dem Monat wird es dann aus allen API Management-Diensten entfernt. Für das veraltete Portal werden nur kritische Sicherheitsupdates bereitgestellt. Weitere Informationen finden Sie in den folgenden Artikeln:
Verfügbarkeit
Wichtig
Diese Funktion ist auf den Ebenen Premium, Standard, Basic und Entwickler von API Management verfügbar.
Informationen zur Featureverfügbarkeit in den v2-Tarifen (Vorschau) finden Sie in der Übersicht über v2-Tarife.
Übersicht über die Vorlagen im Entwicklerportal
Die Bearbeitung von Vorlagen erfolgt über das Entwicklerportal, während Sie als Administrator angemeldet sind. Öffnen Sie hierzu zuerst das Azure-Portal, und klicken Sie in der Dienstsymbolleiste Ihrer API Management-Instanz auf Entwicklerportal.
Um auf die Vorlagen im Entwicklerportal zuzugreifen, klicken Sie auf der linken Seite auf das Anpassungssymbol, um das Anpassungsmenü zu öffnen, und wählen Sie Vorlagen.
In der Vorlagenliste werden verschiedene Vorlagenkategorien für die unterschiedlichen Seiten im Entwicklerportal angezeigt. Wenngleich sich die Vorlagen unterscheiden, sind die Schritte zum Bearbeiten und Veröffentlichen der Änderungen identisch. Zum Bearbeiten einer Vorlage klicken Sie auf ihren Namen.
Wenn Sie auf eine Vorlage klicken, wird die Seite im Entwicklerportal geöffnet, die über diese Vorlage angepasst werden kann. In diesem Beispiel wird die Vorlage Produktliste angezeigt. Über die Vorlage Produktliste werden die Inhalte des Bereichs festgelegt, der auf der Abbildung in einem roten Rechteck dargestellt ist.
Mit einigen Vorlagen, z.B. mit den Benutzerprofil-Vorlagen, werden unterschiedliche Abschnitte derselben Seite angepasst.
Der Editor der einzelnen Vorlagen im Entwicklerportal verfügt über zwei Abschnitte, die im unteren Bildschirmbereich angezeigt werden. Auf der linken Seite befindet sich der Bearbeitungsbereich für die Vorlage, auf der rechten Seite das Datenmodell für die Vorlage.
Der Bearbeitungsbereich der Vorlage umfasst das Markup, um das Aussehen und Verhalten der jeweiligen Seite im Entwicklerportal festzulegen. Für das Markup der Vorlage wird die DotLiquid-Syntax verwendet. Ein beliebter Editor für DotLiquid ist DotLiquid for Designers. Änderungen, die während der Bearbeitung an der Vorlage vorgenommen werden, werden in Echtzeit im Browser angezeigt. Für Ihre Kunden sind diese Änderungen jedoch erst sichtbar, wenn Sie die Vorlage speichern und veröffentlichen.
Im Bereich Vorlagendaten finden Sie Hinweise zum Datenmodell für die Entitäten, die in einer bestimmten Vorlage verwendet werden können. Zu diesem Zweck werden die Livedaten angezeigt, die aktuell im Entwicklerportal sichtbar sind. Um die Vorlagenbereiche zu erweitern, klicken Sie auf das Rechteck oben rechts im Bereich Vorlagendaten .
Im vorstehenden Beispiel werden zwei Produkte im Entwicklerportal angezeigt, die aus den Daten abgerufen wurden, die im Bereich Vorlagendaten angezeigt werden, wie im nachfolgenden Beispiel gezeigt:
{
"Paging": {
"Page": 1,
"PageSize": 10,
"TotalItemCount": 2,
"ShowAll": false,
"PageCount": 1
},
"Filtering": {
"Pattern": null,
"Placeholder": "Search products"
},
"Products": [
{
"Id": "56ec64c380ed850042060001",
"Title": "Starter",
"Description": "Subscribers will be able to run 5 calls/minute up to a maximum of 100 calls/week.",
"Terms": "",
"ProductState": 1,
"AllowMultipleSubscriptions": false,
"MultipleSubscriptionsCount": 1
},
{
"Id": "56ec64c380ed850042060002",
"Title": "Unlimited",
"Description": "Subscribers have completely unlimited access to the API. Administrator approval is required.",
"Terms": null,
"ProductState": 1,
"AllowMultipleSubscriptions": false,
"MultipleSubscriptionsCount": 1
}
]
}
Das Markup der Vorlage Produktliste verarbeitet die Daten, um die gewünschte Ausgabe bereitzustellen. Dazu wird die Sammlung von Produkten durchlaufen, um Informationen und einen Link zu den einzelnen Produkten anzuzeigen. Beachten Sie die Elemente <search-control> und <page-control> im Markup. Diese steuern die Anzeige der Steuerelemente für das Durchsuchen und das Paging auf der Seite.
ProductsStrings|PageTitleProducts ist ein lokalisierter Zeichenfolgenverweis, der den h2-Kopfzeilentext für die Seite enthält. Eine Liste der Zeichenfolgenressourcen, Seitensteuerelemente und Symbole, die in Vorlagen des Entwicklerportals verwendet werden können, finden Sie hier: API Management developer portal templates reference (Referenz zu Vorlagen im API Management-Entwicklerportal)
<search-control></search-control>
<div class="row">
<div class="col-md-9">
<h2>{% localized "ProductsStrings|PageTitleProducts" %}</h2>
</div>
</div>
<div class="row">
<div class="col-md-12">
{% if products.size > 0 %}
<ul class="list-unstyled">
{% for product in products %}
<li>
<h3><a href="/products/{{product.id}}">{{product.title}}</a></h3>
{{product.description}}
</li>
{% endfor %}
</ul>
<paging-control></paging-control>
{% else %}
{% localized "CommonResources|NoItemsToDisplay" %}
{% endif %}
</div>
</div>
So speichern Sie eine Vorlage
Zum Speichern einer Vorlage klicken Sie im Vorlagen-Editor auf „Speichern“.
Gespeicherte Änderungen sind im Entwicklerportal erst nach der Veröffentlichung sichtbar.
So veröffentlichen Sie eine Vorlage
Gespeicherte Vorlagen können einzeln oder gemeinsam veröffentlicht werden. Zum Veröffentlichen einer einzelnen Vorlage klicken Sie im Vorlagen-Editor auf „Veröffentlichen“.
Klicken Sie auf Ja , um den Vorgang zu bestätigen und die Vorlagendaten im Entwicklerportal zu übernehmen.
Zum Veröffentlichen aller aktuell nicht veröffentlichten Vorlagenversionen klicken Sie in der Vorlagenliste auf Veröffentlichen . Nicht veröffentlichte Vorlagen sind mit einem Sternchen gekennzeichnet, der an den Vorlagennamen angefügt ist. In diesem Beispiel werden die Vorlagen Produktliste und Produkt veröffentlicht.
Klicken Sie auf Anpassungen veröffentlichen , um den Vorgang zu bestätigen.
Neu veröffentlichte Vorlagen werden umgehend im Entwicklerportal übernommen.
So stellen Sie die vorherige Version einer Vorlage wieder her
Zum Wiederherstellen der zuvor veröffentlichten Version einer Vorlage klicken Sie im Vorlagen-Editor auf „Wiederherstellen“.
Klicken Sie zum Bestätigen auf Ja.
Die zuvor veröffentlichte Version einer Vorlage wird im Entwicklerportal übernommen, sobald der Wiederherstellungsvorgang abgeschlossen wurde.
So stellen Sie die Standardversion einer Vorlage wieder her
Der Vorgang zum Wiederherstellen der Standardversion einer Vorlage umfasst zwei Schritte. Zunächst müssen die Vorlagen wiederhergestellt werden, anschließend müssen die wiederhergestellten Versionen veröffentlicht werden.
Zum Wiederherstellen der Standardversion einer einzelnen Vorlage klicken Sie im Vorlagen-Editor auf „Wiederherstellen“.
Klicken Sie zum Bestätigen auf Ja.
Um die Standardversion aller Vorlagen wiederherzustellen, klicken Sie in der Vorlagenliste auf Standardvorlagen wiederherstellen .
Die wiederhergestellten Vorlagen müssen dann einzeln oder gemeinsam veröffentlicht werden. Führen Sie dazu die unter So veröffentlichen Sie eine Vorlage beschriebenen Schritte aus.
Nächste Schritte
Eine Referenz zu Vorlagen im Entwicklerportal, Zeichenfolgenressourcen, Symbolen und Seitensteuerelementen finden Sie unter API Management developer portal templates reference (Referenz zu Vorlagen im API Management-Entwicklerportal).