Création d’une application UI5 avec service OData sur Web IDE

Maintenant nous allons voir comment consommer un service OData sur Web IDE à partir d’un exemple simple : récupérer une liste de données.

1 – Créer un nouveau projet à partir d’un template :
1

2 – Sélectionner le template « SAPUI5 Application Project » :
2.png

3 – Saisir le nom du projet :
3

4 – Saisir les détails de la vue initiale :
4

5 – La création du projet est confirmée :
5

6 – Le projet est créé :
6

7 – Ouvrir la vue avec le Layout Editor :
7

8 – La vue est affichée en mode WYSIWYG (What You See Is What You Get) :
8

9 – Ne pas hésiter à modifier les propriétés :
9

10 – Sélectionner la liste dans la bibliothèque d’objets et ajouter là dans la vue :
10

11 – La vue est chargée à l’écran :
11

12 – Il nous faut maintenant ajouter le service OData au projet. Pour ce faire, faire un clic droit sur le projet puis sélectionner « New » et enfin « OData Service » :
12

13 – Sélectionner votre service OData :
13

14 – Confirmer l’ajout du service OData :
14

15 – On remarque que le dossier « model » est automatiquement créé avec le fichier metadata correspondant au service :
15

16 – Revenir sur la View et rafraichir (F5) de façon à obtenir la popup ci-dessous et sélectionner le Data Set, puis valider :
16

17 – Le Data Set apparaît :
17

18 – Le chargement du modèle est  automatiquement implémenté :
18

19

19 – Il ne reste plus qu’à faire le mapping entre le modèle et la liste de la View :
20

20 –Test de l’application :
21

22

Création d’un Service OData

Objectif : Création d’un service Gateway sur le système SAP Gateway retournant la liste des utilisateurs du système backend basé sur la bapi BAPI_USER_GETLIST.

1 – Configuration du Gateway Hub, sur le système backend (lorsque les fonctionnalités serveurs de SAP Netweaver Gateway sont utilisées sur un serveur dédié) :

Aller en transaction SPRO :
1

Aller dans SAP Customizing Implementation Guide > SAP NetWeaver > Gateway Service Enablement > Backend OData Channel > Connection Settings to SAP NetWeaver Gateway > SAP NetWeaver Gateway Settings :
2

Ajouter le système Gateway avec sa destination RFC :
3

4

2 – Création du projet en transaction SEGW (SAP Gateway Service Builder) sur le système backend :
5

6

3 – Passer en mode édition, et créer une nouvelle Entity Type en important la structure DDIC BAPIUSNAME :
7

Il s’agit de la liste des utilisateurs retournée par le module fonction BAPI_USER_GETLIST :
8

4 – Choisir les champs à récupérer (ne prendre que ce dont vous avez réellement besoin) :
9

5 – Préciser le ou les champs clés :
10

6 – Générer les objets runtimes (on peut remarquer au passage que l’entity set associé a automatiquement été créé ainsi que le service implementation) :
11

7 – Laisser l’écran suivant renseigné avec les valeurs par défaut et valider :
12

8 – Les objets runtime sont générés :
13

9 – Nous allons maintenant implémenter la méthode GetEntitySet afin d’y appeler le module fonction BAPI_USER_GETLIST et y retourner la liste des utilisateurs. Pour cela, faire un clic droit sur « GetEntitySet » puis sélectionner « Go to ABAP Workbench » :
14

10 – Valider la popup :
15

11 – Choisir la méthode GET_ENTITYSET comme mentionné dans la popup précédente et choisir « Redefine » :
16

12 – Implémenter la méthode avec l’appel du module fonction BAPI_USER_GETLIST :
17

13 – Retourner dans la SEGW, sélectionner le système Gateway dans Service Maintenance et cliquer sur « Register » :
18.png

14 – Valider la popup :
19

15 – Choisir l’alias système de l’hub (Gateway) vers le backend (http://scn.sap.com/docs/DOC-62040) et valider :
20

16 – Laisser l’écran suivant renseigné avec les valeurs par défaut et valider :
21

17 – Une fois de retour sur l’écran suivant, vous devriez remarquer que le feu « Registration Status » devrait être vert. Nous allons maintenant tester le service en cliquant sur « Gateway Client » :
22

18 – Vous devriez arriver sur l’écran suivant (vous remarquerez au passage que vous avez été basculé sur le système Gateway) et cliquer sur « EntitySets » :
23

19 – Sélectionner votre entity set :
24

20 – La Request URI devrait être mise à jour avec l’entity set. Cliquer sur « Execute » :
25

21 – Si tout fonctionne correctement, vous devriez voir la réponse du service avec les données demandées :
26

Le service sera accessible dans n’importe quel navigateur web pour du format XML ou JSON :

http://…/sap/opu/odata/SAP/ZGW_USERS_LIST_02_SRV/BapiUsnameSet?$format=xml
27

http://…/sap/opu/odata/SAP/ZGW_USERS_LIST_02_SRV/BapiUsnameSet?$format=json
28

Il est également possible de récupérer les métadata du service avec le suffixe $metadata :
29

Celles-ci seront également accessibles par le navigateur web :
30