Web-APIs

● Examples● Consumer Technology● Cross-Domain communication● Provider Technology

Applications

● Blogs and feeds● OpenStreetMap● Amazon, Ebay, Oxygen, Magento● Flickr, YouTube● 3 more on next pages

http://en.wikipedia.org/wiki/Examples_of_Representational_State_Transfer

Facebook Open Graph

● Public● Users/Pages: http://graph.facebook.com/btaylor

● Profile pictures: http://graph.facebook.com/btaylor/picture

● Photos: https://graph.facebook.com/98423808305

● ...

● Private (requires access-Token)● Friends https://graph.facebook.com/btaylor/friends

● Likes https://graph.facebook.com/me/likes

● Music https://graph.facebook.com/me/music

● ...

Response Facebook API

{ "id": "220439", "name": "Bret Taylor", "first_name": "Bret", "last_name": "Taylor", "link": "http://www.facebook.com/btaylor", "username": "btaylor", "gender": "male", "locale": "en_US"}

● http://graph.facebook.com/btaylor

Twitter

● Public● User Info users/show...

– Location, Profile-Image, Description etc● TimeLine http://api.twitter.com/1/statuses/user_timeline.xml?

screen_name=elaspix

● Followers http://twitter.com/statuses/followers/elaspix.xml

● Private● Writing messages, delete Stuff● follow new users● Change background image & other

properties

Response Twitter API● http://api.twitter.com/1/statuses/user_timeline.xml?screen_name=elaspix

Google Search

● Most / all are Public● Searches

● Image Search– http://ajax.googleapis.com/ajax/services/search/images?

v=1.0&q=Elaspix

● Web search● Product search● News search● Blog search

Google API explorer● https://developers.google.com/apis-explorer

Example PageSpeed API

● Get speed improvement recommendations

Google Translation API

● Translations between languages

Response Goole Image Search API

● http://ajax.googleapis.com/ajax/services/search/images?v=1.0&q=Elaspix

{"responseData": {"results":[{"GsearchResultClass":"GimageSearch","width":"160","height":"120","imageId":"ANd9GcS_UgmJADJiJfJzTyqwwRv2Rtzc8gjBAxi4P1jYol8MeQcEuDNmWxDvhg","tbWidth":"98","tbHeight":"74","unescapedUrl":"http://multiply.com/mu/surotz/image/3/photos/9/1200x120/1/ela-pix-005.JPG?et\u003dGjxFoMbLQNlt2LWoUBHGCQ\u0026nmid\u003d217746729","url":"http://multiply.com/mu/surotz/image/3/photos/9/1200x120/1/ela-pix-005.JPG%3Fet%3DGjxFoMbLQNlt2LWoUBHGCQ%26nmid%3D217746729","visibleUrl":"surotz.multiply.com","title":"darwin\u0026#39;s Site - darwin\u0026#39;s Photos","titleNoFormatting":"darwin\u0026#39;s Site - darwin\u0026#39;s Photos","originalContextUrl":"http://surotz.multiply.com/photos","content":"somepics 5 Photos, 2 comments","contentNoFormatting":"somepics 5 Photos, 2 comments","tbUrl":"http://images.google.com/images?q\u003dtbn:ANd9GcS_UgmJADJiJfJzTyqwwRv2Rtzc8gjBAxi4P1jYol8MeQcEuDNmWxDvhg:multiply.com/mu/surotz/image/3/photos/9/1200x120/1/ela-pix-005.JPG%3Fet%3DGjxFoMbLQNlt2LWoUBHGCQ%26nmid%3D217746729"},{"GsearchResultClass":"GimageSearch","width":"800","height":"600","imageId":"ANd9GcS3QZ8knIjvIQI9O3xgC3k0NpMMcFN7bS5E48lOd06l_NzEaK94AP71Sg","tbWidth":"143","tbHeight":"107","unescapedUrl":"https://www.vdivde-it.de/gw/infoservice/fotoarchiv/preisverleihung-2-2008/elaspix.JPG","url":"https://www.vdivde-it.de/gw/infoservice/fotoarchiv/preisverleihung-2-2008/elaspix.JPG","visibleUrl":"www.vdivde-it.de","title":"Fotos von der Preisverleihung 2/2008 — Gründerwettbewerb - Mit \u003cb\u003e...\u003c/b\u003e","titleNoFormatting":"Fotos von der Preisverleihung 2/2008 — Gründerwettbewerb - Mit ...","originalContextUrl":"https://www.vdivde

Mash-ups

● Are web-services that combine several web-apis to provide useful services to the user● http://www.programmableweb.com/

Zeit API

● Access articles & authoris via API● http://developer.zeit.de/

ifttt – “if this, then that”

● Combines dozens of webservices

● Uses triggers and actions that are connected with rules

● Create rules that react on user input (Likes, photo uploads, the actual temperature)

ifttt – “if this, then that”

● Integrated development environment not required to program complex tasks

Web-API Document formats

● XML● JSON

XML

● Extensible Markup language● Many / most services respond in XML format● Human readable● Machine understandable due to semantic hierarchy

JSON

● Has a similar role as XML● Responses are 30% shorter in characters

● Compared to XML● Less human readable● makes also use of hierachical semantics

● Further concept● Array is a collections of subtrees with identical

structure

Provider-Technology

● REST● SOAP● Java Server Pages

Restful Services

● Is an web-service architecture● Rest = “Representational State Transfer”

– REST is an architectural style for distributed hypermedia systems, describing the software engineering principles guiding REST and the interaction constraints (Fielding, R. T.)

● “to rest” – A client is either computing something or is waiting for user input (in rest mode)– During rest mode the client does not produce net-load

● The state of a client changes if it calls a function from the server

Restful Services● Constraints of the Rest-Architecture

● Client versus Server– separate entities on their own

● Stateless– no client stuff is stored on the server, everything is

passed in the header of the message → scalability, isolation from internal server changes

● Cachable– cache response for further use

● Layered – dont know how many hops in between mediate the

request (e.g. tunnels, firewalls, proxies etc.)● Uniform interface

URIs● An uri should read like a self documenting

interface● And consits of (Roccia, Y., 2014)

● Each entitiy / ressource is addressed by a unique ID

RESTful web services● Supported methods provided by htt-protocol

● GET– Clients sends only URL and header to server and retrieve

something from the server (should not change anything on the server, is therefore called “safe”)

● POST– Clients use an additional body to submit data (file, form)

to the server, Change the state of the server (that processes the data)

● [PUT] very rare

– Replaces the state of /update a ressource on the server● [DELETE] very rare

– Removes a ressource on the server

Rest Header

● Using a Get/Post Header, the quality of services are managed● Navigation purpose (the network of ressources is

called hypermedia)● Caching purpose● Grants for cross domain access● Media type of the response● Requested representation of the resource

(document format)

Short summary on REST

● Key concepts● Give every “thing” an ID● Link things together● Use standard methods● Resources with multiple representations● Communicate statelessly

● To make your apps part of the web, design it RESTfully

● REST is an architecture, not an implementationhttp://www.infoq.com/articles/rest-introduction

SOAP

● Simple object access protocoll● Used for remote procedure calls

● Used mostly for intra-enterprise applications● (Offers more security)● Supports type safety● Offers specification on interfaces

SOAP compartments

● xml as message format● Http as transimission protocoll (to pass

firewalls)● WSDL (web services description language) to

describe what the service requires and offers● RPC (Remote Procedure Call) access to

methods on remote objects

Task setup SOAP-Server

● extract the soapSamples.zip● Interface● Service● Starter ( Server)

● Inspect web service description language– http://localhost:4434/miniwebservice?wsdl

● Inspect xml-schema– http://localhost:4434/miniwebservice?xsd=1

● Client

Examples by http://www.torsten-horn.de/techdocs/jee-jax-ws.htm

SOAP versus HTTP RESTful● SOAP

● More difficult to start● Rigid type checking

– exactly defined interfaces● Methods exposed simply

with Java annotations● Most often stateful● XML wrapper makes

messages lengthy● Always body requ.● Supports binary params

● HTTP RESTful● Lightweight, loose

coupling,● Interoperability through

web-standards● Directly human

readable● Callable by either

client supporting html● Easy to build● Short XML messages

www.taranfx.com/rest-vs-soap-using-http-choosing-the-right-webservice-protocol

Architecture of Web Applications

● Model-View-Controller● Controller

– Receives user interactions to updates the model

● View– Shows a data representation to the user

● Model– Is the business logic in combination with persistent data

bases

http://www.mobilefish.com/tutorials/mvc/mvc.html

Java-Server Pages

● SUN's answer to PHP, CGI and ASP (Microsoft)● Serve dynamic content to the user's browser

● Make a Java Class respond to HTML request● Statefulness through

● URL-rewriting (Serve pages with individual URLs)● HTTP-Cookies

Java Servlet Webcontainer

● Servlet receives a request and generates response● Can be combined with html

● Manages lifecycle of the service ● Mapping URL to a servlet● Access right management

Apache Tomcat

● Open Source Servlet Container● Not to be confused with apache web server

● Directory structure below webapps● WEB-INF

– classes● Packages and compiled class files (usually from Eclipse's bin

directory)

– lib (all required libs as JAR's)– Web.xml (configuration, mapping)

Tomcat's web xml

● Maps URLs to Java-Klasses● Maps from http://localhost:8080/myDirectory/anyurl

to MyServlet.class