Internet Technologies#6 REST SOAP AJAX

Agenda

RESTSOAPAJAX

RESTAPPLICATION SERVERS TODAY

REST - what is it?

" REST " – was coined by Roy Fielding in his Ph.D. dissertation [1] to describe a design pattern for implementing networked systems.[1] http://www.ics.uci.edu/~fielding/pubs/dissertation/top.htm

How it works?

The Client references a Web resource using a URL.

A representation of the resource is returned (in this case as an HTML

document).The representation (e.g.,

Boeing747.html) places the client in a new state.

How it works

When the client selects a hyperlink in Boeing747.html, it accesses another resource.

The new representation places the client application into yet another state.

Thus, the client application transfers state with each resource representation.

REST - what is it?

"Representational State Transfer is intended to evoke an image of how a well-designed Web application behaves: a network of web pages (a virtual state-machine), where the user progresses through an application by selecting links (state transitions), resulting in the next page (representing the next state of the application) being transferred to the user and rendered for their use."

- Roy Fielding

REST - what is it?

Not a standard! Just a design pattern… that prescribes the use of standards:

HTTPURLXML/HTML/GIF/JPEG/etc.

(resource representations) text/xml, text/html, image/gif,

image/jpeg, etc. (MIME types)

REST - basics

Create a resource for every service. Identify each resource using a URL. The data that a Web service returns

should link to other data. Thus, design your data as a network of information.

Contrast with OO design, which says to encapsulate information - don’t do it!

REST - basics

All interactions between a client and a web service are done with simple operations. Most web interactions are done using HTTP and just four operations: retrieve information (HTTP GET)create information (HTTP PUT)update information (HTTP POST)delete information (HTTP DELETE)

Features

platform independent language independent standards-based no problems with firewalls etc.

No built in mechanisms for: Security Cryptography Session management Quality of Service …

Used by…

…many serious servicesTwitterAmazon services(S3

storage solution)FlickrAtom…

Resource representations

Often XML but not the only available option often:

CSV (for large amounts of data) JSON (JavaScript Object Notation)

Recommendations

Don’t use physical URLs, use logical ones http://www.acme.com/inventory/product003.xml vs http://www.acme.com/inventory/product/003

Requests should not return large amounts of data use paging

Don’t change resource formats lightly provide additional ones

Recommendations

Don’t make the client to construct new action URLs make them a part of the resource

GET requests should not change server state - this is what POST, DELETE, PATCH and so on are for…

Don’t rely on cookies and so on

SOAP web services

Web Services

A Web service is a method of communication between two electronic devices over a network. It is a software function provided at a network address over the Web with the service always on as in the concept of utility computing.

Web Services

encapsulated - implementation is not visible to the user

loosely coupled - modifications of implementation (not interface!) should not generate the change propagation problem

contracted - descriptions of functions and their interface specifications are publicly available

WS architecture

client,service providerservice broker (optional)

publishing of service descriptions

service lookup

WS architecture

WS architecture

use of specific, popular technologiesURL for addressingSOAP for transport (HTTP-

based)XML as message format

SOAP

stateless, one-way protocol based on HTTP may utilize other protocols (nobody does it

really) allows construction of more complex

communication models specifies structure for XML message

exchange mandatory and optional message elements encoding and transmission

does not determine application semantics, coding paradigm etc.

WSDL

W3C specification used to provide machine-readable WS description

Based on XML Defines service interface, not

service semanticsabstract interface - independent

from transport protocol or programming language

WSDL

definition contains the general part:

data types definitions message definitions port type definitions

and the specific part binding definitions service definitions

UDDI

Universal Description, Discovery and Integration

White Pages – address, contact, identifiers

Yellow Pages - categorization based on predefined taxonomies

Green Pages – technical informations

UDDI

Specification published in 2000 Vision of widely available services

commercialdynamically integrated with

applications Last public UDDI nodes

maintained by Microsoft, IBM and SAP closed in January 2006

Web Services in practice

Two service construction scenarios: Top-down:

design the servicecreate WSDgenerate stub and skeletonimplement

Bottom-up: take existing implementationgenerate WSDL based on it, create

stubs and skeletons from it

Web Services in practice

multiple additional specificationsWS-SecurityWS-SignatureWS-EncryptionWS-TrustWS-Notification…

AJaX

AJaX

Old ideas come back in new form Cycles in the approach to application

architecture: Terminals „thick” client applications web pages dynamic web pages

AJaX

Drawbacks of „thin” web page applications: user interface „feel” radically different in

comparison to desktop applications

What is AJaX

A name given to an existing approach to building dynamic web applications

Web pages use JavaScript to make asynchronous calls to web-based services that typically return XML

Uses a JavaScript class called XMLHttpRequest

What is AJaX

allows user to continue interacting with web page while waiting for data to be returned

page can be updated without refreshing browser

results in a better user experience there are AJaX libraries that reduce the amount

of JavaScript code that must be written

What is AJaX

A is for “asynchronous” requests can be made asynchronously or

synchronously both techniques allow web page to be updated

without refreshing it anything useful the user can do while

processing request? if yes then use asynchronous, otherwise use

synchronous

What is AJaX

Ja is for “JavaScript” typically JavaScript is used on the client-side (in

the browser) only programming language supported out-of-the-

box by most web browsers can use any language on server-side that can

accept HTTP requests and return HTTP responses Java servlets, Ruby servlets, CGI scripts, …

What is AJaX

X is for “XML” request and response messages can contain

XML can really contain any text (single text value,

delimited text, …)

What is AJaX

Traditional approach to building web applications: URL used to navigate between web pages, but

also as interaction tool AJaX approach:

communication with server without sending requests for another page

Components of AJaX

XMLHttpRequest object XML, XSLT – exchange and transformation of

data XHTML, CSS – standard presentation tools DOM – interaction with document, document

updates JavaScript – client-side scripts

How it works

XMLHttpRequest - a JavaScript class supported by most web browsers Allows HTTP requests to be sent from JavaScript

code to send multiple, concurrent requests, use a different XMLHttpRequest instance for each

HTTP responses are processed by “handler” functions – in client-side JavaScript

First issue

code to create an XMLHttpRequest object differs between browsers

can use a JavaScript library to hide the differences

XMLHttpRequest Properties

(partial list) readyState

0 = UNINITIALIZED; open not yet called 1 = LOADING; send for request not yet called 2 = LOADED; send called, headers and status are

available 3 = INTERACTIVE; downloading response, responseText only partially set 4 = COMPLETED; finished downloading response

XMLHttpRequest Properties

responseText response as text; null if error occurs or ready

state < 3 responseXML

response as DOM Document object; null if error occurs or ready state < 3

status – integer status code statusText – string status onreadystatechange – assign a function called on

each state change

XMLHttpRequest Properties

(partial list) Basic methods

open(method, url[, async]) – initializes a new HTTP request

method can be "GET", "POST", "PUT" or "DELETE" url must be an HTTP URL (start with "http://") async is a boolean indicating whether request

should be sent asynchronously defaults to true

XMLHttpRequest Properties

send(body) – sends HTTP request abort() – called after send() to cancel request void setRequestHeader(name, value) String getResponseHeader(name) String getAllResponseHeaders()

returns a string where „header: value” pairs are delimited by carriage returns

Sample call

function getResource(url) {

if (window.XMLHttpRequest) { // Mozilla etc.

xhr =new XMLHttpRequest();

xhr.onreadystatechange=handleChange; // callback

xhr.open("GET", url, true);

xhr.send(null);

}

else if (window.ActiveXObject) { // Internet Exporer

xhr=new ActiveXObject("Microsoft.XMLHTTP");

if (xhr) {

xhr.onreadystatechange=handleChange;

xhr.open("GET",url,true); xhr.send();

} } }

Sample response handler

function handleChange() {

if (xmlhttp.readyState==4) {

if (xmlhttp.status==200) {

// ...get data, update view...

}

} }

Using JSON

var my_JSON_object = {}; var http_request = new XMLHttpRequest(); http_request.open("GET", url, true); http_request.onreadystatechange = function () {

var done = 4, ok = 200; if (http_request.readyState == done

&& http_request.status == ok) { my_JSON_object = JSON.parse(http_request.responseText); }

}; http_request.send(null);

We’ve been here before…

The new part is the XMLHttpRequest object and asynchronous call (not really ;) ), the rest has been done before

Hidden Frames IE5+, Mozilla 1.0+, Safari 1.2+, and Opera 7.6+

Java Applets

Why is it popular?

Google helped popularize, and legitimize it in GMail

Increase Usability of Web Applications Rich Internet Applications without Flash Save Bandwidth Download only data you need Faster interfaces (sometimes)

Why is it bad?

Breaks back button support and bookmarking URL's don't change as state changes Cross Browser Issues can be a pain JavaScript may tax older machines CPU Can't access domains other than the calling domain May be disabled (for security reasons) or not

available on some browsers Debugging is difficult

Why is Microsoft so evil?

As usual the IE handles things differently to the other browsers

but… they did this first so it is rather hard to blame them IE7 includes support for both „IE-style” and

„rest of the world-style” HttpRequests… there are some issues, however

When NOT to use AJaX

Just because it is cool and shiny For navigation To display static content

When you should use AJaX

Real-time user-server interaction Validation of data based on server-side

resources Displaying content that should be hidden from

search engines

Questions?