Creating a separate mobile website is a great idea until someone changes a data source on you. Your users don’t care if your LDAP is down or why they can’t pull up next the class schedule for next semester. In this session you will learn how to plan for the worst; network outages, slow response times and unorganized data. The mobile Web isn’t very useful without content and often that content is gathered from many sources that are out of the developers control. Gathering, protecting and organizing that data is the job of a smart developer and a successful mobile Web presence. This is accomplished by adding an API layer to everything you do. This session will walk you through the ins and outs of creating and maintaining a Web API that can extend far beyond your mobile presence.
2. Nick DeNardis
Associate Director of Web Communications
at Wayne State University
http://wayne.edu/
Host of EDU Checkup
http://educheckup.com/
Curator of EDU Snippits
http://edusnippits.com/
Writer for .eduGuru
http://doteduguru.com/
19. You can’t blame the network for everything
CSS
Images
Images
New Content
Javascript
Initial HTML
Cell Latency Cell Latency
Time Time
First Request Second Request
21. One size != fit all
https://api.twitter.com/1/
https://us2.api.mailchimp.com/1.3/
https://api.foursquare.com/v2/
https://api.instagram.com/v1/
https://www.salesforce.com/services/Soap/c/18.0
https://api.wayne.edu/v1/
Think versioning from the start
22. SOAP REST
The request: The request:
GET /StockPrice HTTP/1.1 GET /StockPrice/IBM HTTP/1.1
Host: example.org Host: example.org
Content-Type: application/soap+xml; charset=utf-8 Accept: text/xml
Content-Length: nnn Accept-Charset: utf-8
<?xml version="1.0"?> The response:
<env:Envelope xmlns:env="http://www.w3.org/
2003/05/soap-envelope" HTTP/1.1 200 OK
xmlns:s="http://www.example.org/stock-service"> Content-Type: text/xml; charset=utf-8
<env:Body> Content-Length: nnn
<s:GetStockQuote>
<s:TickerSymbol>IBM</s:TickerSymbol> <?xml version="1.0"?>
</s:GetStockQuote> <s:Quote xmlns:s="http://example.org/stock-
</env:Body> service">
</env:Envelope> <s:TickerSymbol>IBM</s:TickerSymbol>
<s:StockPrice>45.25</s:StockPrice>
The response: </s:Quote>
HTTP/1.1 200 OK
Content-Type: application/soap+xml; charset=utf-8
Content-Length: nnn
<?xml version="1.0"?>
<env:Envelope xmlns:env="http://www.w3.org/
2003/05/soap-envelope"
xmlns:s="http://www.example.org/stock-service">
<env:Body>
<s:GetStockQuoteResponse>
<s:StockPrice>45.25</s:StockPrice>
</s:GetStockQuoteResponse>
</env:Body>
</env:Envelope>
4 kb vs 2 kb
Round Trip
28. Your data is everywhere
Website
CMS
Gather &
Clean
Mobile
Website
Events
Shadow
storage
Mobile
App
LDAP
API
Webserver
Digital
Signage
Banner
Third
Party
29. API is the glue
Website
CMS
Gather &
Clean
Mobile
Website
Events
Shadow
storage
Mobile
App
LDAP
API
Webserver
Digital
Signage
Banner
Third
Party
31. Making the glue
Ingredients:
Server space you control
api.domain.edu or domain.edu/api
Ability:
• Database
• Cronjobs
• Server logs
• Analytics
• PHP accelerator
• Xdebug
55. HTML5
localStorage
if (typeof(localStorage) == 'undefined' ) {
alert('Your browser does not support HTML5 localStorage. Try upgrading.');
} else {
try {
localStorage.setItem("name", "Hello World!"); //saves to the database,
} catch (e) {
if (e == QUOTA_EXCEEDED_ERR) {
alert('Quota exceeded!'); //data wasn't successfully saved due to quota exceed
so throw an error
}
}
document.write(localStorage.getItem("name")); //Hello World!
localStorage.removeItem("name"); //deletes the matching item from the database
}
http://paperkilledrock.com/2010/05/html5-localstorage-part-one/
56. JSONP
function handle_data(data) {
// `data` is now the object representation of the JSON data
}
---
http://some.tld/web/service?callback=handle_data:
---
handle_data({"data_1": "hello world", "data_2":
["the","sun","is","shining"]});
57. Expires header
<?php
header('Expires: '.gmdate('D, d M Y H:i:s GMT', time() + 3600));
?>
1 Month 1 Week 1 Day
Semesters Courses Events
Subjects Media Experts News
Degrees
Map Categories No Cache
Map Locations
Course Availability
Parking Availability
58. Our Stats
Feb 2011 - In production
6.1 million requests
48% from mobile
21% iOS
23% Android
66% Web
95% GET’s
16 ms average response time