Een mobiele applicatie in 10 stappen

8 November, 2012

Stefan van Liempt

Enjoy sharing knowledge

2

Consult Yourself Together

MichielWouter

AlbertStefan

Wyke

Ernst

3

Doel

Tijdens deze sessie een webservice configureren die elke willekeurige informatie voor ons ophaalt uit CS

Een simpele mobiele applicatie maken die gebruikt maakt van onze webservice

4

Informatie van student naar CS

Standaard webservices van Oracle

AAWS (aanmelden) EWS (Inschrijven op vakken)

Campus

Studenten

Informatie van CS naar student

Studenten hebben de volgendeinformatie nodig

Cijferinformatie Roosterinformatie Persoonlijke informatie Financiële informatie Zoeken in het vakkenaanbod Informatie rondom evenementen …

Campus

Studenten

6

QAS (Query Access Service)

Ook wel bekend als Reporting Webservices

Een verzameling webservices rondom de Query tool.

+ =Webservice Query Power

7

Onderwerpen

5 stappen om peoplesoft gereed te maken voor integratie

5 stappen om een mobiele applicatie te maken

Een voorbeeld applicatie Vragen

8

Mobile

Homegrown Internet

Query

Webservice

Third party applications

Security

SOAPUI

CS Database

XMLRequest

Campus

Campus Solutions

9

Mobile

Homegrown Internet

Query

Webservice Security

SOAPUI

CS Database

XMLRequest

Campus

User Profile

Met beveiliging

Third party applications Campus Solutions

10

Casus

Onze universiteit heeft enkele informatie nodig rondom de persoon.

EMPLIDNAMEBIRTHDATEEXTERNAL_SYSTEM_ID

Uiteindelijk willen wij deze informatie in onze mobiele applicatie tonen.

11

Stappenplan configuratie

1) Bouw de Query

2) Configureer QAS

4) Webservice publiceren

5) Testen webservice

Build

3) Toegangsrechten en Rollen

Test

Provide

P.L. & Roles

Config

12

1) Bouw de query Build

Query is de tool om informatie te verzamelen! Query onderhoud is makkelijk!

Reporting Tools> Query > Query Manager

13

Mobile

Homegrown Internet

Query

Webservice Security

SOAPUI

CS Database

XMLRequest

Campus

User Profile

1Query:

CY2_EMEA_HEUG

Third party applications Campus Solutions

14

2) Webservice configuratie Config

Zoek naar de QAS_EXECUTEQRYSYNC_OPER

zet de Operation op Active

Reporting webservices zijn read-only (uitgeleverd) Zie tips & Tricks om dit te omzeilen

Peopletools > Integration broker > Integration Setup > Service Operations

Vink aan User/Password Required!

Merk op: Required Verification (dwingt ons om HTTPS te praten tegen deze webservice)

15

Mobile

Homegrown Internet

Query

Webservice Security

SOAPUI

CS Database

XMLRequest

Campus

User Profile

1Query:

CY2_HEUG_EMEASet ActiveUsername /

Password Req.

2

Third party applications Campus Solutions

Req. Verification

2

16

3) toegangsrechten & Rollen

PTPT2200 geeft toegang tot 30service operations (onderdeel van Reporting webservices).

P.L. & Roles

Peopletools > Security > Permissions & Roles > Permission Lists

We hebben een gebruikersaccount nodig:1. Die toegang geeft tot de

webservice2. Genoeg rechten heeft voor

Query

17

3) Toegangsrecht & Rollen

Tip: Configureer de hoogst nodige toegang!

P.L. & Roles

Peopletools > Security > User Profiles > User Profiles

18

Mobile

Homegrown Internet

Query

Webservice Security

SOAPUI

CS Database

XMLRequest

Campus

User Profile

Query:CY2_HEUG_EMEA

1

Set ActiveUsername /

Password Req.

CY2_QAS_ADMIN

Role:QAS ADMIN

Role:CY2_QUERY

32

Third party applications Campus Solutions

Req. Verification

2

19

4) Publiceer de Webservice Provide

Vink de QAS_EXECUTEQRYSYNC_OPER

Peopletools > Integration Broker > Webservices > Provide Web Service

20

4) Publiceer de webservice Provide

Copy ‘n Paste dezeWSDL. We hebben dit in deVolgende stap nodig

Peopletools > Integration Broker > Webservices > Provide Web Service

21

Mobile

Homegrown Internet

Query

Webservice Security

SOAPUI

CS Database

XMLRequest

Campus

User Profile

Query:CY2_HEUG_EMEA

1

Set ActiveUsername /

Password Req.

CY2_QAS_ADMIN

Role:QAS ADMIN

Role:CY2_QUERY

32

WSDL generated

4

Third party applications Campus Solutions

Req. Verification

2

Laten we de resultaten testen!

23

Request XML Response XML

Download SoapUI van http://www.soapui.org

Status bar

Control buttons

5) Test de webservice

Project view

Test

24

5) Test de webservice

Project view

Test

Je ziet onze gepubliceerde webservice in de project view van SOAPUI

Maak een nieuw project en plak de WSDL van de vorige stap hierin

25

Maak een XML request

Hier gaan de prompt waarden

Request XML paneRequest XML

Test

Opmerking: Bovenstaande XML is de juiste XML om een query op afstand uit te voeren.

26

A Klik Aut in de statusbar

Vul Gebruikersnaamen wachtwoord inB

Rechtermuisknop ergens in het “request” gedeelte

C

Klik vervolgens “Add WSS Username Token”

Request XML pane

Status bar

We zien dat er een Security header toegevoegd is aan onze XML.

E

Test

DKlik OK

27

Control buttons

Druk op play

Request XML

Stuurt deze XML (Query aanvraag) naar de webservice

Test

28

Query Resultaten

Response XML

Test

If it works in SoapUI it should work anywhere!

29

5 Stappen om Peoplesoft gereed te maken voor integratie

Bouw de query Configureer reporting webservice Toegangsrechten & Rollen Publiceer de webservice Test de webservice

en verder.. 5 stappen om een mobiele applicatie te maken Vragen.

30

Bouwen van een app

Native app download je naar je telefoon

Native app kun je ook telefoonfuncties gebruiken (zoals camera)

Web app is platform onafhankelijk (Apple, Android, Windows)

Web app draait op een webserver (zoals een normale website)

31

5 Stappen voor een mobiele applicatie

1) Download een webserver (Xampp)

2) Kies een webtaal (jQuery Mobile)

4) Roep de interface aan

5) Test je applicatie!

Installeer

3) Genereer een interface met Peoplesoft (PhP)

Test

Voeruit

Genereer

Config

32

Een extra integratiepunt waar de smartphones naar verbinden

Op deze webserver wordt de website geplaatst

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

Infrastructuur web app.

33

1) Download webserver (XAMPP) Download (windows of Linux of OsX) Voer setup uit Klaar!

http://www.apachefriends.org

34

Zorg ervoor dat je de webserver installeert op een machine die ook bij de peoplesoft omgeving kan.

Het zou jouw laptop of vaste PC op het werk kunnen zijn. (Enkel voor te testen natuurlijk)

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

1

Uitstraling applicatie Interactie met de

gebruiker

Wat gebeurt er al ikop deze knop klik

Kleur en vormgeving knoppen

2) Kies een webtaal (jQuery Mobile)

Alles en meer op:http://www.jquerymobile.com

App.html

36

Style &Scripts

ZoekboxStudentnr

Zoekknop

Resultaat

Ruimte voor ons eigen script

37

Roept Onzeinterface aan

Prompt waardenmeegeven

Resultaat vullen met Naam v/d student

38

Tot nu toe…

39

Maak je eigen (simpele) mobiele website design

Bewaar het bestandje op de webserver Je bent klaar met het webapp gedeelte

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

1

App.html

2

2

40

PhP acteert als integratielaag Data afhandeling / Beveiliging Interface voor versimpeling van aanroepen

3) Genereer een interface met Peoplesoft

A Ga naar phpClasses.org

BDownload daar SoapProxy (soap-proxy-2011-09-27.zip)

C Unzip het bestand op dewebserver

QAS.gen.phpSrc_confi.php

Soap.class.php

SoapProxyGenerator.php

.Zip bestandphpClasses

Maak een nieuw bestand op deWebserver (bv QAS.gen.php)D

Webserver

41

De aanroep genereert een nieuw bestand: QAS_QRY_SERVICE.class.php

3) Genereer een inteface met Peoplesoft

QAS_EXEQRY_SYNC_REQ

Prompt

Prompt

Prompts

Classes

Campus

QAS_QRY_SERVICE.class.php Ons gegenereerd bestand!

QAS.gen.php

Src_config.phpQAS.gen.php

Src_config.php

Soap.class.php

SoapProxyGenerator.php

.Zip bestandphpClasses

42

Zet QAS_QRY_SERVICE.class.php op de webserver Zet Soap.class.php op de webserver

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

1

App.html

2

2QAS_QRY_SERVICE.class.php

Soap.class.php

Src_config.php

3

43

4) Roep de interface aan

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

1

App.html

2

2QAS_QRY_SERVICE.class.php

Soap.class.php

Src_config.php

3

getQuery.php

include

Resultaat

getQuery.phpQuery/Prompt

44

4) Roep de interface aanSOAPUIgetQuery.php

Parameters

Prompts

Onze WSDL

Onze gegenereerde class

45

Mobile

Third party applications

SOAPUI

Internet

XMLReques

t

Campus

Webserver

Campus SolutionsIntegratielaag

1

App.html

2

2QAS_QRY_SERVICE.class.php

Soap.class.php

Src_config.php

3

getQuery.php

4

BezoekWebsite

AJAXReq.

Overzicht Flow

46

5) Test je applicatie

47

5 stappen voor een mobiele applicatie

Download een webserver (Xampp) Kies een webtaal (jQuery Mobiel) Genereer een interface met PeopleSoft (PhP) Roep de interface aan Test je applicatie

48

Voorbeeld Webapp met QAS

49

Login via AAWS webservices

50

Student persoonlijke en financiele info

Vakresultaten

51

Zoeken naar vakken.

Details vakken. En vanuit hier verder op het EWS framework.

52

Bottom Line:

Behalve de Login pagina, is de rest via QAS gedaan!

53

Tips & tricks Usage

Oracle documentatie PeopleBook: (pt850trws‐b0909)

Lees het! Veel nuttige info over de 29 andere service operations, onderdeel van QAS.

54

Tips & Tricks Performance

55

Tips & Tricks Security

Configureer de proxy gebruiker met minimale, maar toch net voldoende rechten

Autentication webservice (SCC_USERREG_AUTHENTICATE), kun je gebruiken om de login af te vangen

Verwijder de read-only restrictie door: Peopletools -> Integration Broker -> Configuration > Service Configuration (tab retricted services)

Questions

?

57

Geadvanceerde onderwerpen

• Toevoegen Authenticatie header• Strippen van CDATA in XML

58Aanpassingen: Soap.class

Header informatie genereren

59

Aanpassingen: QAS_QRY_SERVICE.class.php

Strippen van CDATA tags

Stefan van Liempt Mobile: +31641009099 E-mail: stefan@cy2.nl Skype: stefan.v.liempt LinkedIn: http://www.linkedin.com/in/stefanvanliempt

Wouter de Bruin Mobile: +31611417177 E-mail: wouter@cy2.nl Skype: cy2_wouter LinkedIn: http://nl.linkedin.com/in/cy2wouter

This presentation and all HEUG EMEA 2012

presentations are available for download from the

Conference site atwww. heug.org

www.CY2.nl ‘Enjoy sharing knowledge’