4 Entwicklungsumgebung einrichten

Transkript

1 Kapitel 4 In diesem Kapitel installieren Sie die SAPUI5-Bibliothek und richten die Entwicklungsumgebung ein. 4 Entwicklungsumgebung einrichten SAPUI5-Anwendungen können Sie entweder in einer Eclipse-basierten Umgebung oder in der neuen SAP Web IDE entwickeln. Zusätzlich müssen Sie die SAPUI5-Bibliothek auf dem Backend installieren. Wie Sie dabei vorgehen und wie Sie die Entwicklungsumgebungen auf dem Frontend einrichten, zeige ich Ihnen in diesem Kapitel. Checkliste Was Sie für dieses Kapitel brauchen: S-User für den SAP Service Marketplace Zugang zu einem SAP-ERP- und zu einem SAP-Solution-Manager- System Für die SAP Web IDE benötigen Sie einen installierten SAP HANA Cloud Connector und einen Zugang zur SAP Web IDE. Sollten Sie über kein SAP-Backend-System verfügen, können Sie Ihre Anwendungen auch auf einem lokalen Webserver, z. B. einen Apache-HTTPD-Server (als Download von der Homepage apache.org verfügbar), deployen. Sollten Sie keinen Zugang zum SAP Service Marketplace haben, können Sie die benötigten SAPUI5-Dateien unter herunterladen. Lokaler Webserver Für die ersten Gehversuche ist es auch ausreichend, wenn Sie lediglich Eclipse und die SAPUI5-Frontend-Tools installieren. In diesem Szenario können Sie die Vorschaufunktion in Eclipse nutzen und sich das Ergebnis dort anzeigen lassen. In diesem Fall können Sie Abschnitt 4.1,»SAPUI5-Bibliothek in der SAP Business Suite installieren«, überspringen und direkt mit Abschnitt 4.2.1,»Entwicklungsumgebung in Eclipse einrichten«, bzw. Abschnitt 4.2.2,»SAP Web 111

2 SAPUI5-Bibliothek in der SAP Business Suite installieren 4.1 IDE einrichten«, fortfahren je nachdem, welche der beiden Entwicklungsumgebungen Sie verwenden möchten. Es besteht ein hoher Wartungsaufwand. Der Benutzer muss zum Teil viele URLs zum Aufruf der Anwendungen kennen, da der zentrale Einstiegspunkt des Central Hubs fehlt. Systemarchitektur 4.1 SAPUI5-Bibliothek in der SAP Business Suite installieren Die Entwicklung von Anwendungen in SAPUI5 ist grundsätzlich mit zwei alternativen Systemarchitekturen möglich: Embedded Deployment Von Embedded Deployment spricht man, wenn die SAPUI5-Ressourcen auf jedem SAP-System Ihrer Landschaft installiert werden und auch direkt in diesen Systemen ausgeführt werden. Das heißt, Sie müssen die im Folgenden beschriebenen Schritte für jedes System, z. B. für SAP ERP HCM, SAP CRM, SAP ERP, durchführen. Central Hub Bei der Central-Hub-Architektur installieren Sie eine neue Systemlinie, auf der die Komponente SAP Gateway und alle SAPUI5-Ressourcen liegen. Jede SAPUI5-Anwendung wird auf diesem sogenannten Central Hub deployt und ausgeführt. Der Central Hub ist technisch nichts anderes als ein SAP NetWeaver AS ABAP. Die Datenübermittlung in das jeweilige Backendsystem (SAP ERP HCM, SAP CRM usw.) erfolgt über SAP Gateway über eine Trusted-/ Trusting-Beziehung via Remote Function Call (RFC). Abbildung 4.1 veranschaulicht diese Architektur. Reverse Proxy ABAP- Central-Hub (SAP Gateway + SAPUI5) Abbildung 4.1 Central-Hub-Systemarchitektur ABAP-Backend-Server (SAP Business Suite) SAP ERP SAP CRM SAP SRM SAP SCM SAP HANA XS Engine SAP HANA/ beliebige Datenbank Das Embedded-Deployment-Szenario hat drei gravierende Nachteile: Die Sicherheit zu gewährleisten ist aufwendig, vor allem beim mobilen Datenzugriff. Beim Central Hub müssen Sie lediglich einen Server überwachen, wenn Sie dagegen den mobilen Datenzugriff auf allen SAP-Systemlinien zulassen, müssen Sie den Netzwerkverkehr auf allen Servern verstärkt überwachen. Aus diesen Gründen hat sich die Central-Hub-Architektur bewährt und etabliert. Da Sie den Central Hub in aller Regel neu installieren, installieren Sie damit auch gleich das aktuelle Release des SAP Net- Weaver Application Servers ABAP (AS ABAP). Zum Zeitpunkt des Schreibens dieses Buches ist das Release Dieser ABAP-Stack beinhaltet bereits die SAPUI5- und SAP-Gateway-Komponenten, so dass Sie keine zusätzliche Softwarekomponente installieren müssen. Auf den Backend-Systemen der SAP Business Suite müssen Sie lediglich die Softwarekomponente für SAP Gateway, IW_BEP, installieren. In den neueren Enhancement Packages (EHPs) der SAP Business Suite ist jedoch auch diese Softwarekomponente integriert, nicht zuletzt, weil SAP Fiori auf dieser Architektur aufbaut. SAP Fiori SAP Fiori ist mehr als nur eine Sammlung von SAPUI5-basierten Apps. Es handelt sich um eine neue SAP-Philosophie, wie die User Experience (UX) über strikte Design Guidelines und eine rollen- und aufgabenbasierte Implementierung von Anwendungen verbessert werden kann. Technisch handelt es sich um SAPUI5-Anwendungen, die zentral auf dem Central Hub über das SAP Fiori Launchpad ausgeführt werden können. Auch wenn Sie sich als Nicht-SAP-Mitarbeiter nicht an die Design Guidelines für SAP Fiori halten müssen, empfehle ich Ihnen, sich mit diesen zu beschäftigen. Diese Richtlinien wurden von erfahrenen UX-Designern erstellt, und Sie können von diesem Wissen profitieren. Unter experience.sap.com können Sie sich über den Ansatz von SAP Fiori und die daraus resultierenden Design Guidelines informieren. Da so jede SAPUI5-Anwendung auf dem gleichen Server läuft, benötigt der Anwender in der Regel nur noch eine URL zum Zugriff auf die Anwendungen. Auch unter Sicherheitsaspekten ist die Central-Hub- Architektur von Vorteil. Es ist wesentlich einfacher, ein einzelnes System meistens mit einem vorgeschalteten Reverse Proxy netzwerk- Wahl des richtigen Szenarios

3 SAPUI5-Bibliothek in der SAP Business Suite installieren 4.1 Installation mit AS ABAP 7.31 technisch abzusichern und zu überwachen, als mehrere Systeme. Der einzige Nachteil der Central-Hub-Architektur ist der Betrieb der zusätzlichen Systemlinie mit den damit verbundenen Kosten. Viele SAP-Kunden entscheiden sich in der Pilotphase dazu, mit dem Embedded Deployment zu starten. Damit können Sie in einem Proof of Concept zunächst einmal die neue Technologie evaluieren und im Anschluss die neue Central-Hub-Systemlinie aufbauen. Aus diesem Grund beschreibe ich an dieser Stelle zunächst die Installation auf einem existierenden ABAP-Stack Möchten Sie direkt die Central-Hub-Architektur umsetzen, können Sie diesen Schritt überspringen und einen Central Hub auf der Basis von SAP NetWeaver 7.40 installieren. Hier ist, wie bereist erwähnt, die SAPUI5-Komponente bereits enthalten. 2. Laden Sie die berechneten Support Packages und das Stack-XML herunter. Entpacken Sie anschließend die Support Packages in das EPS-Verzeichnis, und installieren Sie die Pakete mit dem SAP Add- On Installation Tool (Transaktion SAINT), bzw. führen Sie ein Update (Transaktion SPAM) durch. Eine ausführliche Installationsanleitung finden Sie im SAP-Hinweis Ob die Installation erfolgreich war, können Sie durch den Aufruf der URL überprüfen, wobei Sie <HOSTNAME> und <SERVICE> durch die Werte Ihres SAP-Systems ersetzen. Ihnen sollte als Ergebnis das SAP UI development toolkit for HTML 5 angezeigt werden (siehe Abbildung 4.3). SAP UI Development Toolkit for HTML5 SAPUI5 ist als Add-on in die SAP Business Suite integriert. Die Installationspakete finden Sie im SAP Software Download Center ( service.sap.com/swdc) unter Installations and Upgrades A-Z-Index N UI Add-On for NetWeaver <Entsprechendes EHP-/ERP- Release> Installation. Die dazugehörigen Support Packages finden Sie unter Support Packages and Patches A-Z-Index N UI Add-On for NetWeaver <Entsprechendes EHP-/ERP-Release>. 1. Starten Sie im SAP Solution Manager den Maintenance Optimizer, und wählen Sie UI ADD-ON 1.0 FOR NW 7.03 als Produktversion (siehe Abbildung 4.2). Abbildung 4.3 SAP UI Development Toolkit for HTML 5 Sollten Sie ein anderes Ergebnis erhalten, prüfen Sie, ob der entsprechende Service aktiv ist. Gehen Sie dazu in die Transaktion SICF, und aktivieren Sie gegebenenfalls den ICF-Service (Internet Communication Framework) default_host/sap/public/bc/ui5_ui5/ (siehe Abbildung 4.4). ICF-Service aktivieren Abbildung 4.2 Maintenance Optimizer im SAP Solution Manager

4 Die in diesem Buch gezeigten Beispiele basieren auf der zum Zeitpunkt des Schreibens dieses Buches aktuellen Version SAP_UI 740 SP Prüfen Sie daher mithilfe der Product Availability Matrix (PAM), die Sie unter aufrufen können, welches die aktuell unterstützte Version ist, und installieren Sie diese. Bei Eclipse handelt es sich um ein Open-Source-Projekt. Eclipse wird als Integrated Development Environment (integrierte Entwicklungsumgebung, kurz IDE) für verschiedenste Programmiersprachen genutzt. SAP hat auf Basis von Eclipse Plug-ins entwickelt, die es ermöglichen, SAPUI5-Entwicklungen in Eclipse zu programmieren. Die SAP Web IDE wird in der Cloud zur Verfügung gestellt und als Nachfolger der Eclipse-Entwicklungsumgebung betrachtet. In den folgenden Abschnitten zeige ich Ihnen die Einrichtung dieser beiden Umgebungen. Wir beginnen mit der Eclipse-Umgebung Entwicklungsumgebung in Eclipse einrichten Die UI-Entwicklungstools sind Teil der SAPUI5-Bibliothek. Es handelt sich dabei um eine Reihe von Eclipse-basierten Tools und Editoren, die Sie bei der Entwicklung von SAPUI5-Anwendungen unterstützen. Der SAPUI5 ABAP Repository Team Provider unterstützt Sie beim Einchecken der in Eclipse entwickelten Anwendungen in ein ABAP-Backend-System. Die Entwicklerwerkzeuge für SAPUI5 müssen separat als Eclipse- Plug-ins installiert werden. Prüfen Sie vor der Eclipse-Installation, ob die installierte Laufzeitumgebung Java Runtime Environment (JRE) mindestens in der Version 1.6 vorliegt, und aktualisieren Sie die JRE gegebenenfalls vor der Installation des Plug-ins. Öffnen Sie das Java Control Panel über Start Systemsteuerung Programme Java. Über den Button Info wird Ihnen Ihre JRE-Version angezeigt. Eclipse-Tools Installationsvoraussetzungen Eclipse oder SAP Web IDE Abbildung 4.4 UI5-Service aktivieren 4.2 Frontend-Tools einrichten Nach der erfolgreichen Installation der Backend-Komponente müssen Sie nun noch die SAPUI5-Frontend-Tools installieren. Hier stehen Ihnen zwei Möglichkeiten zur Verfügung: Eclipse-Umgebung installieren Welche Eclipse-Version von SAPUI5 aktuell unterstützt wird, erfahren Sie unter Im Abschnitt SAPUI5 Procedure erfahren Sie, für welche Eclipse-Versionen eine Update- Site für die SAPUI5-Entwicklungswerkzeuge angeboten wird. Von dieser Update-Site können Sie die SAPUI5-Entwicklertools installieren (siehe auch Abbildung 4.12). Zum Zeitpunkt des Schreibens dieses Buches wurden die Eclipse-Versionen Luna und Mars unterstützt, die neueste Version Neon noch nicht. Eclipse-Plug-ins für SAPUI5 die SAP Web IDE, eine cloudbasierte Entwicklungsumgebung für SAPUI5 Haben Sie noch keine Eclipse-Umgebung auf Ihrem Rechner installiert, laden Sie als Erstes die Eclipse IDE for Java EE Developers unter herunter. Hat Ihr SAP-Backend-System Eclipse IDE for Java EE Developers

5 Eclipse starten den Stand SAP NetWeaver 7.40 Service Pack 7 oder kleiner, müssen Sie die 32-Bit-Version von Eclipse herunterladen, da der SAPUI5 ABAP Repository Team Provider nur mit der 32-Bit-Version funktioniert. Ab Service Pack 8 wird auch die 64-Bit-Version unterstützt. Nach dem Entpacken der heruntergeladenen ZIP-Datei können Sie Eclipse direkt mit einem Doppelklick auf eclipse.exe starten. Eclipse läuft im Arbeitsspeicher und muss daher nicht installiert werden. Beim ersten Start von Eclipse werden Sie nach einem Verzeichnis für den Workspace gefragt (siehe Abbildung 4.5). Bei der Entwicklung in Eclipse arbeiten Sie in Projekten, und der Workspace ist der Verzeichnisort auf Ihrer Festplatte, an dem die Dateien Ihrer Projekte abgelegt werden. sprechende Version vom SAP Service Marketplace herunterladen. Aus diesem Grund beschreibe ich an dieser Stelle beide Vorgehensweisen. Für die Entwicklung benötigen Sie die folgenden drei Kernkomponenten, die Sie in der folgenden Reihenfolge installieren: Kernkomponenten der SAPUI5-Tools ABAP IN ECLIPSE SAPUI5 TOOLS IDE PLUGIN SAPUI5 TEAM PROV IDE Installation vom SAP Service Marketplace Welche SAPUI5-Version auf Ihrem ABAP-System installiert ist, finden Sie am einfachsten heraus, indem Sie das Development Toolkit aus Ihrem System heraus aufrufen, wie in Abschnitt 4.1,»SAPUI5- Bibliothek in der SAP Business Suite installieren«, beschrieben (siehe Abbildung 4.3). Laden Sie dann vom SAP Service Marketplace zunächst die beiden benötigten SAPUI5-Komponenten SAPUI5 TOOLS IDE PLUGIN und SAPUI5 TEAM PROV IDE herunter. Sie finden die Dateien im SAP Service Marketplace unter Support Packages and Patches A-Z-Index N UI Add-On for NetWeaver <Entsprechendes EHP-/ERP-Release>. Komponenten herunterladen Fügen Sie die jeweils aktuelle Version der beiden Komponenten über den Button Zum Download Basket hinzufügen zu Ihrem Download-Basket hinzu. Für den SAPUI5 ABAP Repository Team Provider benötigen Sie zusätzlich noch das Plug-in für ABAP in Eclipse. Dieses finden Sie am einfachsten, indem Sie im SAP Software Download Center nach»abap in Eclipse«suchen. Fügen Sie auch diese Datei Ihrem Download-Basket hinzu. Laden Sie im Anschluss die drei ZIP- Dateien mithilfe des SAP Download Managers herunter. Abbildung 4.5 Verzeichnis für den Eclipse-Workspace angeben Sie können auch mit mehreren Workspaces arbeiten und den Workspace im Menü über File Switch Workspace jederzeit wechseln. Die SAPUI5-Plug-ins können Sie auf zwei Wegen installieren: über die Update-Site über den SAP Service Marketplace Auf der Update-Site können Sie immer nur die jeweils aktuelle Version installieren. Sollte sich Ihr ABAP-System auf einem älteren SAPUI5-Releasestand befinden und möchten Sie in Eclipse die gleiche Version wie auf Ihrem Backend installieren, müssen Sie die ent- Je nachdem, welche Version Sie installieren möchten, benötigen Sie noch weitere Standard-Plug-ins. So setzt die zum Zeitpunkt des Schreibens dieses Buches aktuelle Version von ABAP in Eclipse z. B. das Eclipse-Grafik-Plug-in Graphiti und einige EMF-Komponenten (Eclipse Modeling Framework) voraus. Ich zeige Ihnen an dieser Stelle einen Weg zur Installation der Komponenten, der für mich am besten funktioniert hat. Weitere Informationen zur Installation finden Sie in der Installationsdokumentation. Standard-Plug-ins

6 SAPUI5-Plug-ins installieren Nachdem Sie die Dateien aus dem SAP Service Marketplace heruntergeladen haben, können Sie diese in Eclipse installieren: 1. In der Eclipse-Oberfläche starten Sie dazu im Menü über den Pfad Help Install New Software den Installationsassistenten (siehe Abbildung 4.6). Abbildung 4.8 Archivdatei einbinden 4. Wählen Sie nun über den Installationsassistenten das gewünschte Plug-in aus, und bestäigen Sie Ihre Auswahl mit Next (siehe Abbildung 4.9). Abbildung 4.6 Plug-in-Komponenten installieren 2. Da die SAPUI5-Tools lokal auf Ihrer Festplatte gespeichert wurden, müssen Sie diese manuell in den Installationsassistenten einbinden. Beginnen Sie bei der Installation mit dem Plug-in ABAP in Eclipse. Klicken Sie hierzu neben dem Eingabefenster Work with auf den Button Add, und wählen Sie im folgenden Pop-up-Fenster, das in Abbildung 4.7 zu sehen ist, per Doppelklick die entsprechende ZIP-Datei aus. Abbildung 4.9 Komponenten zur Installation auswählen Abbildung 4.7 SAPUI5-Tools auswählen 3. Bestätigen Sie Ihre Auswahl mit OK (siehe Abbildung 4.8). 5. Eclipse prüft nun die Installationsvoraussetzungen für das Plug-in. In unserem Beispiel fehlt als Voraussetzung für die Installation des Plug-ins das Eclipse-Plug-in Graphiti (siehe Abbildung 4.10)

7 7. Wählen Sie das Plug-in aus, und bestätigen Sie Ihre Auswahl mit Next. 8. Akzeptieren Sie im Folgebild die Lizenzvereinbarungen, und starten Sie über den Button Finish die Installation. Bei manchen Komponenten erscheint ein Warnhinweis, dass Sie unsignierte Komponenten installieren. Bestätigen Sie dieses Pop-up-Fenster mit OK. Nach der erfolgreichen Installation müssen Sie Eclipse neu starten. 9. Versuchen Sie im Anschluss, das Plug-in für ABAP in Eclipse erneut zu installieren. Sollten Sie eine weitere Fehlermeldung erhalten, wiederholen Sie das beschriebene Verfahren so lange, bis Sie alle erforderlichen Plug-ins installiert haben. Abbildung 4.10 Hinweis auf fehlendes Plug-in 6. Gehen Sie daher über Back einen Schritt zurück, tragen Sie unter Work with die Update-Site der verwendeten Eclipse-Version ein, und suchen Sie dann nach dem erforderlichen Plug-in, wie in Abbildung 4.11 dargestellt. Alle vorausgesetzten Plug-ins installieren Der beschriebene Weg ist zwar sehr mühsam, ist aber die einzige Möglichkeit, eine Version passgenau zu installieren. Für die von mir verwendete Version musste ich diese Schritte für die folgenden Plug-ins wiederholen: EMF Query EMF Validation EMF Model Transaction Workbench Integration Nach der erfolgreichen Installation des Plug-ins für ABAP in Eclipse wiederholen Sie den Vorgang für die beiden Plug-ins für die SAPUI5- Tools-IDE und den SAPUI5 ABAP Repository Team Provider. Damit ist die Installation der Eclipse-Entwicklungsumgebung für SAPUI5 abgeschlossen. SAP-Hinweise Die zum Zeitpunkt des Schreibens dieses Buches aktuelle Version SAPUI SP13 setzt z. B. ABAP in Eclipse in der Version 2.44 voraus. Welche Versionen Sie jeweils installieren müssen, können Sie den SAP-Hinweisen und entnehmen. Abbildung 4.11 Installation des fehlenden Plug-ins Installation von der Update-Site Wenn sich Ihr ABAP-Backend annähernd auf dem aktuellen Stand befindet, können Sie die SAPUI5-Update-Site für die Installation nutzen. Diese Vorgehensweise hat zwar den Nachteil, dass Sie nur die gerade aktuellste Version installieren können, bringt aber den großen Vorteil mit sich, dass die vorausgesetzten Plug-ins automatisch Aktuelle Version installieren

8 mit installiert werden. Dadurch vereinfacht sich der Installationsprozess erheblich. 1. Auf der Internetseite finden Sie unter SAPUI5 Procedure den Link zu der entsprechenden Update-Site: also z. B. für die Eclipse- Version Mars. 2. Starten Sie über den Menüpfad Help Install New Software den Installationsassistenten, und tragen Sie unter Work with die passende Update-Site ein. 3. Wählen Sie die gewünschten Komponenten aus, wie in Abbildung 4.12 zu sehen, und starten Sie die Installation über Next. Eclipse-Komponenten aktualisieren Es wird empfohlen, die Eclipse-Komponente Eclipse IDE for Java EE Developer regelmäßig zu aktualisieren. Diese Komponente beinhaltet die Codevervollständigung, die in niedrigeren Versionen zu Abstürzen der Anwendung führen kann. Um eine Komponente zu aktualisieren, rufen Sie über den Menüpfad Help About Eclipse die Übersicht der installierten Komponenten auf (siehe Abbildung 4.13). Über den Button Installation Details können Sie sich die Versionen der installierten Komponenten anzeigen lassen. Übersicht der installierten Komponenten Abbildung 4.13 Information zu den installierten Eclipse-Komponenten Um ein Update durchzuführen, markieren Sie die entsprechende Komponente und klicken auf den Button Update (siehe Abbildung 4.14). Update der installierten Komponenten Abbildung 4.12 Installation über die Update-Site Abbildung 4.14 Installierte Komponenten aktualisieren

9 Es erscheint nun ein Pop-up-Fenster mit den verfügbaren Updates. Bestätigen Sie die Installation mit Next, akzeptieren Sie die Lizenzvereinbarungen, und starten Sie die Installation mit Install. Als Alternative zu Eclipse stelle ich Ihnen nun die SAP Web IDE vor SAP Web IDE einrichten Die SAP Web IDE ist eine browserbasierte Entwicklungsumgebung, die auf der SAP HANA Cloud Platform (HCP) läuft. Sie wurde speziell für die Entwicklung von SAPUI5- und SAP-Fiori-Anwendungen konzipiert und soll langfristig alle bisherigen Tools und Add-ons für Eclipse ersetzen. Die SAP Web IDE stellt u. a. einen WYSIWYG-Editor (»What you see is what you get«) zur Verfügung, wie er ähnlich in Eclipse über das AppBuilder-Plug-in realisiert ist. Außerdem finden Sie hier einen OData Modeler, der den Funktionen des Ogee-Plugins in Eclipse entspricht. Verfügen Sie über die erforderliche Entwicklerlizenz, können Sie sich über die URL am HCP Cockpit anmelden. Starten Sie die SAP Web IDE dann wie folgt: 1. Unter Subscriptions finden Sie im Abschnitt Subscribed HTML5 Applications den Eintrag zur SAP Web IDE (siehe Abbildung 4.15). An HCP anmelden Einsatzvarianten Grundsätzlich haben Sie drei Möglichkeiten, die SAP Web IDE zu nutzen, wobei nicht jede Variante für die produktive Nutzung freigegeben ist: SAP Web IDE auf der HCP Diese Möglichkeit ist für den produktiven Einsatz freigegeben. Testzugang zur SAP Web IDE Es gibt einen kostenlosen Testzugang, der nicht für die produktive Nutzung freigegeben ist. Abbildung 4.15 SAP HANA Cloud Platform Cockpit 2. Klicken Sie in der Spalte Application auf webide, wird Ihnen die URL zur SAP Web IDE angezeigt (siehe Abbildung 4.16). Lokale Version der SAP Web IDE Auch die Verwendung dieser Variante ist nur zu Testzwecken erlaubt. In den folgenden Abschnitten erkläre Ihnen die Einrichtung dieser drei Varianten der SAP Web IDE. Entwicklerlizenzen SAP Web IDE auf der SAP HANA Cloud Platform Im Gegensatz zu den Eclipse-Plug-ins ist die SAP Web IDE kostenplichtig. Entsprechende Lizenzen können Sie über den SAP Store beziehen ( Abbildung 4.16 Link zur SAP Web IDE 3. Über diesen Link erreichen Sie die SAP Web IDE. Beim ersten Öffnen sehen Sie den Willkommensbildschirm aus Abbildung 4.17 und können sofort mit der Entwicklung starten

10 Funktionen der SAP Web IDE In Kapitel 10,»Beispielentwicklung einer SAP-Fiori-App«, werden wir ein Anwendungsbeispiel mithilfe der SAP Web IDE implementieren, und Sie werden die wichtigsten Funktionen dieser Entwicklungsumgebung kennenlernen. SAP HANA Cloud Connector installieren und konfigurieren Unabhängig davon, ob Sie sich für den kostenlosen Testzugang oder eine produktive SAP Web IDE entscheiden damit diese cloudbasierte Webanwendung mit Ihren ABAP-Backendsystemen kommunizieren kann, müssen Sie den sogenannten SAP HANA Cloud Connector installieren und konfigurieren. Der Cloud Connector stellt eine sichere Verbindung zwischen der SAP Web IDE in der Cloud und Ihren On-Premise-Systemen her. Wie in Abbildung 4.18 veranschaulicht, installieren Sie den SAP HANA Cloud Connector auf einem separaten Server und verbinden Ihre On-Premise-Systeme über einen sicheren SSL-Tunnel (Secure Sockets Layer) mit der Cloud-Instanz. Abbildung 4.17 Startbildschirm der SAP Web IDE Testzugang zur SAP Web IDE Der Testzugang zur SAP Web IDE wird ebenfalls über die HCP bereitgestellt, und der Zugriff erfolgt fast genau so wie beim produktiven HCP-Account, lediglich die URL zum HCP Cockpit lautet anders: Hier können Sie sich für einen nicht produktiv nutzbaren Testzugang registieren. Nach Erhalt der Bestätigungs- können Sie sich genau wie beim produktiven Zugang am HCP Cockpit anmelden und finden die URL zur SAP Web IDE dort ebenfalls unter Subscriptions. Lokale Installation der SAP Web IDE Im SAP Community Network (SCN) können Sie den Quellcoude und eine Anleitung zur Installation einer lokalen SAP Web IDE unter der URL herunterladen. Auch diese Version ist nicht für den produktiven Einsatz freigegeben. SAP Web IDE (SAP HANA Cloud Platform) SAP HANA Cloud Connector Abbildung 4.18 Rolle des SAP HANA Cloud Connectors On-Premise-Landschaft Den SAP HANA Cloud Connector können Sie unter der URL tools.hana.ondemand.com herunterladen. Wählen Sie hier die für Ihr Betriebssystem passende Version aus (siehe Abbildung 4.19), und installieren Sie diese, wie in der Dokumentation beschrieben. Installation

11 3. Melden Sie sich nun als Administrator am SAP HANA Cloud Connector an. Sollten Sie nicht über Administratorrechte verfügen, wenden Sie sich für die nachfolgenden Schritte an den verantwortlichen Administrator. 4. Legen Sie eine neue Verbindung an, indem Sie im Bereich Account Dashboard auf Add klicken (siehe Abbildung 4.21). Abbildung 4.19 Download des SAP HANA Cloud Connectors Verbindung einrichten Nachdem Sie den SAP HANA Cloud Connector installiert haben, können Sie die Verbindung zur SAP Web IDE über die Administrationsoberfläche herstellen: 1. Rufen Sie dazu das Cockpit Ihres HCP-Accounts unter der URL (für produktive Instanzen) bzw. (beim kostenlosen Testzugang) auf. 2. Dort finden Sie unter Account Account Details Account Name den Namen Ihres HCP-Accounts (siehe Abbildung 4.20). Diese Account-ID benötigen Sie für die Konfiguration des SAP HANA Cloud Connectors. Abbildung 4.21 Neue Verbindung anlegen 5. Tragen Sie nun die Verbindungsdaten, wie in Abbildung 4.22 zu sehen, ein. Wählen Sie als Landscape Host»hana.ondemand.com«für den produktiven Zugang bzw.»hanatrial.ondemand.com«bei Verwendung des Testzugangs. Als Account Name geben Sie die Account-ID ein, die Sie zuvor nachgesehen haben. In den Feldern Account User und Password geben Sie Ihren Benutzernamen und Ihr Passwort ein. Abbildung 4.20 Name des HCP-Accounts abfragen Abbildung 4.22 SAP HANA Cloud Connector konfigurieren

12 Virtueller Host 6. Nachdem Sie Ihre Eingaben mit OK bestätigt haben, stellt der SAP HANA Cloud Connector eine Verbindung zur HCP her. Wenn Sie alle Daten richtig eingegeben haben, erscheint ein neuer Eintrag im Account Dashboard (siehe Abbildung 4.23). Eine aktive Verbindung wird mit einem grünen Symbol angezeigt. Abbildung 4.23 Neuer Account im SAP HANA Cloud Connector Als nächsten Schritt verbinden Sie Ihr ABAP-Backend-System mit dem Cloud Connector. Dies geschieht durch einen sogenannten virtuellen Host. 1. Wechseln Sie dazu in den Bereich Access Control, und klicken Sie auf Add 2. Im folgenden Pop-up-Fenster geben Sie einen virtuellen Host und einen virtuellen Port an (siehe Abbildung 4.24). Sie können hier Ihrer Kreativität freien Lauf lassen, Sie müssen sich die Angaben nur merken, da Sie diese im Folgeschritt wieder benötigen. 3. Als Internal Host und Internal Port tragen Sie die Daten Ihres Central Hubs bzw. die Daten des Systems, auf dem SAP Gateway läuft, ein. 4. Sichern Sie Ihre Eingaben. Als nächsten Schritt tragen Sie die erreichbaren Ressourcen auf dem ABAP-Backend-System ein. Letztlich geben Sie an dieser Stelle ICF- Pfade bekannt (siehe auch Abschnitt 4.1,»SAPUI5-Bibliothek in der SAP Business Suite installieren«), die über den SAP HANA Cloud Connector erreichbar sein sollen. Markieren Sie dazu im oberen Bereich Mapping Virtual To Internal System den Eintrag mit Ihrem virtuellen Host. Im unteren Bereich erscheint nun eine neue Tabelle, in der Sie über Add die Ressourcen hinzufügen können, wie in Abbildung 4.25 gezeigt. Ressourcen hinzufügen Abbildung 4.25 Ressourcen hinzufügen Abbildung 4.24 System-Mapping im SAP HANA Cloud Connector Wiederholen Sie diesen Schritt für die folgenden ICF-Knoten: /sap/bc/ui5_ui5 Path and all sub-paths /sap/opu/odata Path and all sub-paths /sap/bc/bsp Path and all sub-paths /sap/bc/adt Path and all sub-paths

13 Als Ergebnis sollten Sie nun vier Einträge in der Ressourcen-Tabelle mit dem Status resource is enabled sehen, der durch ein grünes Symbol erkennbar ist (siehe Abbildung 4.26). 2. Neben der URL müssen Sie noch drei zusätzliche Attribute pflegen. Klicken Sie dazu auf New Property, und geben Sie die folgenden Eigenschaften und Werte ein:»webideenabled«:»truewebidesystem«:»<system-id Ihres Central Hubs>WebIDEUsage«:»odata_abap.ui5_execute_abap«Nach dem Sichern Ihrer Einstellungen können Sie diese nun in der SAP Web IDE testen: Verbindung testen SAP Web IDE anbinden Abbildung 4.26 Anzeige der verfügbaren Ressourcen Damit ist der SAP HANA Cloud Connector konfiguriert und mit dem SAP-Gateway-System verbunden. Als nächsten Schritt verbinden Sie die SAP Web IDE mit dem SAP HANA Cloud Connector: 1. Wechseln Sie dazu wieder in das HCP Cockpit. Legen Sie im Bereich Destination eine neue Verbindung an. An dieser Stelle kommt der virtuelle Host ins Spiel. Wie Sie Abbildung 4.24 entnehmen können, habe ich als virtuellen Host sapui5.buch und als virtuellen Port 6666 gewählt. Daraus ergibt sich die URL sapui5.buch:6666, wie in Abbildung 4.27 zu erkennen. 1. Starten Sie die SAP Web IDE wie im Abschnitt»SAP Web IDE auf der SAP HANA Cloud Platform«beschrieben. 2. Legen Sie über den Menüpfad File New Project from Template ein neues Projekt an. Ein Wizard zum Anlegen eines neuen Projekts startet. 3. Wählen Sie im ersten Schritt zur Demonstration einmal das Template SAP Fiori Full Screen Application aus (siehe Abbildung 4.28), und klicken Sie auf Next. Abbildung 4.28 Template für eine SAP-Fiori-Anwendung in der SAP Web IDE auswählen Abbildung 4.27 SAP Web IDE an den SAP HANA Cloud Connector anbinden 4. Geben Sie im Folgebild einen Projektnamen ein, z. B.»sapui5- Buch«, und klicken Sie auf Next (siehe Abbildung 4.29)

14 Abbildung 4.29 Projektnamen für die Entwicklung eingeben 5. Jetzt kommt der eigentlich spannende Teil: Im Folgebild können Sie die Datenverbindung auswählen. Wenn Sie alles richtig konfiguriert haben, können Sie wie in Abbildung 4.27 unter Service Catalog den Eintrag zu Ihrem Central Hub sehen. Die SAP Web IDE liest nun alle OData-Services von diesem System ein und zeigt diese im unteren Teil des Bildes an (siehe Abbildung 4.30). Geschafft! Können Sie die Services hier sehen, funktioniert die Verbindung zwischen der SAP Web IDE und dem SAP HANA Cloud Connector sowie zwischen dem SAP HANA Cloud Connector und dem SAP-Backend-System. Auch wenn ich mir sehr gut vorstellen kann, dass es Sie jetzt in den Fingern juckt und Sie dieses Beispiel gerne zu Ende bringen möchten, muss ich Sie leider an dieser Stelle noch ein paar Seiten lang vertrösten. Sie können den Wizard an dieser Stelle abbrechen, ich kann Ihnen jedoch versprechen, dass wir in Kapitel 10,»Beispielentwicklung einer SAP-Fiori-App«, wieder an diese Stelle zurückkehren werden und dieses Beispiel zu Ende bringen. Dafür benötigen Sie zunächst noch ein besseres Verständnis von OData, SAP Gateway und natürlich auch SAPUI5. Bevor Sie die erste SAPUI5-Seite anlegen, erläutere ich Ihnen daher im folgenden Kapitel die möglichen Entwicklungsszenarien und die Kommunikation zwischen dem Browser und dem SAP-Backend näher. Im Anschluss daran lernen Sie das Architekturmuster Model View Controller (MVC) kennen und sind damit bestens gerüstet, um mit der Entwicklung von Anwendungen in SAPUI5 zu starten. Ecplise und SAP Web IDE in diesem Buch Für mich als Autor war es eine schwierige Entscheidung, ob ich Ihnen die Beispiele in diesem Buch in Eclipse oder der SAP Web IDE zeige. Die SAP Web IDE ist eine zukunftsträchtige IDE, zum Zeitpunkt des Schreibens dieses Buches ist Eclipse jedoch nach wie vor sehr stark verbreitet. Bei einigen Aufgaben, z. B. beim Anlegen eines Projekts, wie in diesem Abschnitt gezeigt, ist der Unterschied zwischen der SAP Web IDE und Eclipse gering. Auch bei der eigentlichen Entwicklung unterscheidet sich die Arbeit in der SAP Web IDE nur geringfügig von der Arbeit in Eclipse. In der SAP Web IDE ist u. a. die Codevervollständigung derzeit etwas besser. Die Stärken der SAP Web IDE liegen in den zur Verfügung gestellten Templates und Plug-ins, die es sehr einfach machen, auch komplexere Anwendungen geführt durch einen Assistenten zu erstellen. Daher habe ich mich dazu entschlossen, die Beispiele in diesem Buch zunächst in Eclipse zu zeigen. In Kapitel 10,»Beispielentwicklung einer SAP-Fiori-App«, werdern Sie dann eine Genehmigungs-App in der SAP Web IDE entwickeln. In diesem Kapitel werden Sie die Stärken der SAP Web IDE kennenlernen. Selbstverständlich können Sie auch alle Beispiele in der SAP Web IDE oder alle Beispiele in Eclipse entwickeln. Abbildung 4.30 Servicekatalog aus dem Central Hub