applications with oracle - doag deutsche … web applications with oracle apex 34 more about cloud,...

2012 © Trivadis

BASEL BERN LAUSANNE ZÜRICH DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. HAMBURG MÜNCHEN STUTTGART WIEN

REALTIME WEB

APPLICATIONS

WITH ORACLE

APEX

DOAG Conference 2012

Johannes Mangold

Senior Consultant,

Trivadis AG

21.11.2012

21.11.2012

REALTIME WEB APPLICATIONS WITH ORACLE APEX

1

2012 © Trivadis

Hamburg

Dusseldorf

Frankfurt

Stuttgart

Munich Freiburg

Vienna

Basel

Bern

Zurich

Lausanne ~380 employees

~200 employees

~30 employees

Trivadis makes IT easier.

2

11 Trivadis locations in CH, DE and AT with more than

600 employees

Financially independent and sustainably profitable

Revenue CHF 104 / EUR 84 Mio.

Services for more than 800 clients in over

1,900 projects

200 Service Level Agreements

More than 4,000 training participants

Research and development budget:

CHF 5.0 / EUR 4 Mio.

21.11.2012


2012 © Trivadis

Compliance

translated

optimized

wide-ranging

Toolbox

standardized

generated

automated

biGenius

fast

simple

wide-ranging

Infrastructure

Care

optimized

sustainable

modular

Comprehensive

Application

Development

independent

expert

streamlined

Application Care

plannable

efficient

sustainable

Application Development

Business Intelligence

Business Integration Services

Infrastructure Engineering

Managed Services

Training

2012 © Trivadis

Johannes Mangold

Dipl. Wirtschaftsinformatiker (BA)

Senior Consultant

Focus

Integration Solutions

Software Architecture

Web- and Mobile Solutions

21.11.2012


4

Daniel Maier

Dipl. Informatiker (FH)

Senior Consultant

Focus on

Software Architecture

Web- and Mobile Solutions

[email protected] [email protected]

2012 © Trivadis

Agenda

1. Modern Enterprise Web Applications with APEX

2. Next Generation Web Standards: HTML5

3. Realtime Web Applications with HTML5 WebSocket

4. HTML5 WebSocket and APEX

5. Showcase Demo

6. Conclusion

21.11.2012


5

2012 © Trivadis

Modern Enterprise Web Applications with APEX

21.11.2012


6

WEB

BROWSER WEB

LISTENER

ORACLE DATABASE WITH APEX

HTTP

HTML

2012 © Trivadis


21.11.2012


7

User expectations

Challenges with modern enterprise applications

2012 © Trivadis


21.11.2012


8

Unreliable connections


2012 © Trivadis


21.11.2012


9


Scalability

2012 © Trivadis


21.11.2012


10

WEB

BROWSER WEB

LISTENER


HTTP

HTML

2012 © Trivadis


21.11.2012


11

WEB

BROWSER WEB

LISTENER


HTTP

HTML

Web «1.0» Architecture Challenge

Built for document exchange not as dynamic

application platform

The Web is stateless and «half-duplex»

PROBLEMS & COMPLEXITY PLUGINS & WORKAROUNDS

2012 © Trivadis

Agenda





5. Showcase Demo

6. Conclusion

21.11.2012


12

2012 © Trivadis

Next Generation Web Standards: HTML5

21.11.2012


13

2012 © Trivadis


21.11.2012


14

2012 © Trivadis


21.11.2012


15

Cross Document Messaging

XMLHTTPRequest Level 2

Server-Sent Events

WebSocket

2012 © Trivadis


21.11.2012


16

Cross Document Messaging

XMLHTTPRequest Level 2

Server-Sent Events

WebSocket

Our focus today

To enable Web applications to maintain bidirectional

communications with server-side processes…

Source: WebSocket API Spec, w3.org

2012 © Trivadis

Agenda





5. Showcase Demo

6. Conclusion

21.11.2012


17

2012 © Trivadis

Realtime Web Applications with HTML5 WebSocket

W3C API and IETF Protocol

Full-Duplex, single socket

Leverages Cross-Origin Resource Sharing

Shares port with existing HTTP content

Two schemes

ws:// and wss://

21.11.2012


18

Bi-directional communication between a web page and remote host

WebSocket to be natively supported in Web browser

2012 © Trivadis


Upgrade from HTTP protocol to WebSocket protocol using the

same TCP Connection

Once upgraded, WebSocket data frames can be sent back and

forth between the client and the server in full-duplex mode

21.11.2012


19

How WebSockets work

TCP-Sockets for the Web

1

2

2012 © Trivadis


21.11.2012


20

WebSocket handshake: Upgrade from HTTP to WS protocol

HTTP(S) Browser

Server

GET /triWebTrain HTTP/1.1

Host: trivadis.com

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Key: 16-byte nonce,

base64 encoded

Sec-WebSocket-Version: 13

HTTP/1.1 101 Switching Protocols

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Accept: 20-byte MD5 hash in

base64

Client wants: ws://trivadis.com/triWebTrain Server accepts connection upgrade

1

2012 © Trivadis


21.11.2012


21

WebSocket connection established – full-duplex message exchange

WS(S) Browser

Server

op-

code length

extended

length mask data payload

2- 14 bytes overhead per websocket frame

2

2012 © Trivadis


21.11.2012


22

Real-time & full-duplex approaches: HTTP workarounds vs. WebSocket

Browser

Server

Browser

Server

Browser

Server

HTTP Polling

HTTP Long polling

WebSocket

t

t

t

2012 © Trivadis


21.11.2012


23

WebSocket API

//Create new WebSocket

var mySocket = new WebSocket("ws://www.trivadis.com");

// Associate listeners

mySocket.onopen = function(evt) { alert("Connection open…"); };

mySocket.onmessage = function(evt) { alert("Received message: " + evt.data); };

mySocket.onclose = function(evt) { alert("Connection closed…"); };

// Sending data

mySocket.send("WebSocket Rocks!");

// Close WebSocket

mySocket.close();

2012 © Trivadis


21.11.2012


24

WebSocket API

//Create new WebSocket

var mySocket = new WebSocket("ws://www.trivadis.com");

// Associate listeners

mySocket.onopen = function(evt) { alert("Connection open…"); };

mySocket.onmessage = function(evt) { alert("Received message: " + evt.data); };

mySocket.onclose = function(evt) { alert("Connection closed…"); };

// Sending data

mySocket.send("WebSocket Rocks!");

// Close WebSocket

mySocket.close();

Communicate directly via higher level protocols:

JMS / STOMP

XMPP

…

2012 © Trivadis


21.11.2012


25

Current WebSocket browser and server support

Desktop Browsers

Mobile Browsers phpwebsocket

…

2012 © Trivadis

HTML5 WebSocket and APEX

21.11.2012


27

WEB

WEBSOCKET

GATEWAY

BROWSER

ADVANCED

QUEUING

HTTP

LISTENER

ORACLE DATENBANK MIT APEX

HTTP

WS TCP

JMS

HTML

2012 © Trivadis

Showcase Architecture and Technology Stack

21.11.2012


30

JMS

WEBSOCKET

GATEWAY WS

TCP

JMS WEB AQ

HTTP HTML

JMS

APEX

HTTP

LISTENER

APEX

HTTP

2012 © Trivadis

Realtime HTML5 Enterprise Application Showcase

21.11.2012


33

Conclusion

WebSocket brings duplex and realtime capability to Web

Applications, based on new standards

Not a replacement for existing protocols and APIs - it’s the addon of

choice when duplex and realtime is needed in a Web Application

Easy to integrate into APEX Web Applications

Standards based end-to-end transactions over the web

Concepts for concurrent and realtime updates in UI needed

Technology is in a early stage

2012 © Trivadis

BASEL BERN LAUSANNE ZÜRICH DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. HAMBURG MÜNCHEN STUTTGART WIEN

Trivadis AG

Johannes Mangold

Elisabethenanlage 9

CH-4051 Basel

Tel. +41-61-279 97 55

Fax +41-61-279 97 56

[email protected]

www.trivadis.com

21.11.2012


34

More about Cloud,

Next Generation Data

Warehouse and

Tools for efficient and safe

operation of Oracle?

FLOOR 3,

STAND NO. 304

applications with oracle - doag deutsche … web applications with oracle apex 34 more about cloud,...

Documents