Dieses Beispiel zeigt, wie Sie Daten aus einem On-Premises SAP-System in SharePoint Online (Office 365) mit Hilfe von ECS Core integrieren. Folgende Tools werden außerdem verwendet: Napa Office 365 Development Tools und das Azure Portal.
ECS Core ermöglicht eine Integration mit SAP, sowohl lesend als auch schreibend. Dieses Beispiel zeigt, wie man SAP-Daten nach SharePoint Online transferiert.
Bevor Sie starten
Dieses Beispiel benötigt die folgenden Voraussetzungen:
- Eine Office 365 Developer Site in einer Office 365 Domäne und die Rechte, eine Napa-App zu entwickeln.
- Eine Service Bus Instanz im Azure Management Portal.
- Eine ECS Core Installation und Konfiguration, insbesondere:
- Eine SAP-Verbindung anlegen, siehe Services.
- Einen API Key generieren, siehe API Keys.
- Einen Azure Relay registrieren, siehe Azure Relay.
Bemerkung: Andere Middleware Tools, insbesondere SAP Gateway oder SAP Gateway for Microsoft werden für dieses Szenario nicht benötigt.
Schritt 1: Eine NAPA App anlegen
Mit Napa können Sie ein SharePoint Add-in innerhalb des Browsers anstelle von Visual Studio entwickeln. Jederzeit können Sie das Projekt herunterladen und mit Visual Studio weiterarbeiten für fortgeschrittene Szenarien.
Sie benötigen eine SharePoint Online Subscription, mit der Sie eine Napa-Anwendung entwickeln können. Wenn dies nicht der Fall ist, können Sie eine Developer Site in der Administration UI Ihrer Subscription anlegen und dann Napa installieren.
Um Napa zu installieren, öffnen Sie Ihre Developer Site und wählen Sie Site Contents > add an add-in > SharePoint Store. Suchen Sie im Store nach Napa und installieren Sie es. (Falls Sie eine Office 365 Developer Site haben, könnte Napa bereits installiert sein. Das würden Sie unter Site Contents finden.)
Ein SharePoint Add-in-Projekt anlegen
Öffnen Sie das Napa Add-in auf Ihrer Office 365 bzw. SharePoint Online-Seite.
Wählen Sie Add New Project und dann Add-in for SharePoint.
Geben Sie einen Namen ein, z.B. SAPMaterials, und klicken Sie auf Create. Der Code Editor öffnet sich und zeigt die default Webpage mit einem Beispielcode.
Schritt 2: Die Home Page (Default.aspx) editieren
Auf der linken Seite unter dem Ordner Pages wählen Sie die Seite Default.aspx.
Im Abschnitt PlaceHolderAdditionalPageHead fügen Sie die folgende Zeile als Referenz zur Theobald JavaScript library (tEcs):
Im Beispiel nutzen wir die Version 4.10.2.
Wichtig: Bitte nutzen Sie immer die aktuelle Version von tEcs, welche die neuesten Änderungen und Verbesserungen enthält. Siehe: https://cdn-files.theobald-software.com/static/theobald.ecs.micro/5.7.0/index.html
In den Abschnitt PlaceHolderMain fügen Sie den unteren HTML-Code ein.
Der HTML-Code definiert folgende Controls:
- Ein Eingabe-Feld (z.B. SAP Materialnummer) in der Webseite des SharePoint Add-ins.
- Einen Button, um den Leseprozess der SAP-Daten auszulösen.
- Ein div-Control für das Ergebnis.
Schritt 3: Javascript-Code für den Aufruf der SAP-Tabelle einfügen
Nun benötigen wir JavaScript-Code, um die SAP-Verbindung herzustellen und SAP-Materialbeschreibungen aus der SAP-Tabelle MAKT ins SharePoint Add-in zu holen.
Wählen Sie den Ordner Scripts und anschließend App.js.
Die JavaScript-Datei App.js enthält den Code für Ihr SharePoint Add-in. Sie können eine neue JavaScript-Datei einfügen oder wie in unserem Fall die bestehende Datei nutzen.
Im ersten Schritt definieren wir unter der Funktion $(document).ready(), dass beim Klick auf den Button die folgende Funktion aufgerufen werden soll GetSAPData(): liest SAP-Daten aus der Tabelle MAKT.
Bemerkung: Rote, wellenförmige Unterstreichungen können als Hinweis auf Fehler auftreten, werden aber später verschwinden.
Fügen Sie nun den Code für die Funktion GetSAPData() nach der Funktion $(document).ready() ein.
Schauen wir uns nun den Code näher an, mit dem wir auf das On-Premises SAP-System über Azure Relay und ECS Core zugreifen:
- connection.ecs.coreApiKey ist der API Key aus Ihrer ECS Core Installation.
- instance: ist der Name der gepflegten SAP-Verbindung in ECS Core.
- connection.ecs.url ist der Azure Relay Name für ECS Core Das ‘data’-Feld beinhaltet den SAP-Ausdruck (in XtractQL), um die deutsche und englische Materialbeschreibung aus der SAP-Tabelle MAKT zu lesen.
Das Ergebnis wird mit Hilfe einer Tabelle dargestellt.
Für weitere Informationen über den Code siehe unsere Online Help und unsere JavaScript Bibliothek tEcs. In diesem Beispiel haben wir Daten aus einer SAP-Tabelle gelesen. Im nächsten Beispiel zeigen wir, wie Sie einen SAP-Funktionsbaustein aufrufen.
Schritt 4: Ausführen
Auf der linken Seite klicken Sie auf den Button run. Das Projekt wird nun auf Ihrer Office 365 Developer Site installiert.
Nach der Installation startet das SharePoint Add-In. Falls das Add-In nicht automatisch startet, weil z.B. ein Popup-Blocker aktiviert ist, klicken Sie auf den Add-In-Link, um das Add-In zu starten.
Nun geben Sie eine Materialnummer ein und klicken Sie auf den Button.
Das Ergebnis wird aus SAP geholt und angezeigt.
