1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer...
-
Upload
eunice-horton -
Category
Documents
-
view
216 -
download
1
Transcript of 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer...
![Page 1: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/1.jpg)
1
Introduction to Web Applications & APIs
![Page 2: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/2.jpg)
2
Agenda
Architecture of Web Applications Three layer architecture
Web Server (Tomcat) Installation Data structure
Web Application
Database ODBC Libraries Demo
Xml Rules of XMLs XML APIs
APIs Amazon API Flicker API YouTube API
![Page 3: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/3.jpg)
3
Architecture of Web Applications
![Page 4: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/4.jpg)
4
Architecture of Web Applications Three layer architecture
Client Application Client application provides interfaces to interact with users. For web
applications, client applications are browsers.
The contents displayed on the client application are obtained from the application server.
After receiving inputs from users, the client application submits the user inputs to the application server.
Users
![Page 5: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/5.jpg)
5
Architecture of Web Applications Application Server
Application server is a container which allow server applications to run within it.
Application server handles the requests from the client application and pass them to the server application.
These requests are generally sent through HTTP (Hypertext Transfer Protocol), which specifies a set of methods and headers that allow clients and servers to interact and exchange information.
Server application then processes the requests and sends the responses back to the client application.
Server application can also accesses database via JDBC, if database manipulations are needed.
Database Many software can be used to store and manage data (e.g., MS SQL,
Oracle, and MySql)
![Page 6: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/6.jpg)
6
Web Server
![Page 7: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/7.jpg)
7
Web Server To build a web application, we need a server which is able to deal with
Http requests Server applications
Therefore, web server is chosen based on the programming languages by which the server application is coded.
Apache Tomcat Apache Tomcat is an open source software implementation of the Java
Servlet and JavaServer Pages (JSP) technologies.
http://tomcat.apache.org/download-60.cgi Windows Service Installer (6.0.20)
Prerequisite – JDK 1.6 JDK 6 Update 17 with Java EE (http://java.sun.com/javase/downloads/index.jsp)
IIS – for ASP .Net
![Page 8: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/8.jpg)
8
Apache Tomcat Installation
Setup the connection port, user name and password
Installation complete
![Page 9: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/9.jpg)
9
Apache Tomcat Test
http://127.0.0.1:8080
![Page 10: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/10.jpg)
10
Apache Tomcat File Structure
TomcatRoot C:\Program Files\Apache Software Foundation\Tomcat 6.0 (default)
TomcatRoot/bin Executable files
Tomcat6.exe – command line mode; Tomcat6w.exe – service mode
TomcatRoot/conf - Configuration files of Tomcat
TomcatRoot/lib Libraries/APIs required to run Tomcat
TomcatRoot/logs - Log files
TomcatRoot/webapps (http://localhost:8080/) Application root – Put your web applications under this folder
TomcatRoot/work Used to store compiled JSP files (cache).
![Page 11: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/11.jpg)
11
Web Application
Using eclipse as an example
![Page 12: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/12.jpg)
12
Create A Web Application Project Create A Web Application
Eclipse -> File -> New -> Dynamic Web Project
Put in the project name (ex. WebApp1) -> Next http://localhost:8080/
WebApp1/
![Page 13: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/13.jpg)
13
Create A Web Application Project src
The source code folder
build\classes The folder for compiled
class files
Click Next
![Page 14: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/14.jpg)
14
Create A Web Application Project
Click finish
![Page 15: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/15.jpg)
15
Web Application Project – File Structure Deployment Description
Summarizes current status and setting of the project
Java Resource: src The folder for java source codes (such as .java files)
JavaScript Resources Built-in JavaScript libraries
Build The fold of compiled class files (*.class) and imported APIs
WebContent (Root Folder of the application) http://localhost:8080/WebAppName/ All application contents should be put under this folder. WEB-INF (the system folder of a web application) contains
Configuration files (WEB-INF/web.xml) Complied java codes (WEB-INF/classes) Third-party libraries/APIs (WEB-INF/lib)
![Page 16: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/16.jpg)
16
Deploy A Web Application Project To deploy a web
application, we first package the web application into a WAR file.
Deploy
Right-click on the project -> Export
Choose “WAR file” -> click next
![Page 17: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/17.jpg)
17
Specify the output location and click finish.
Deploy Copy the “WAR file” to the AppRoot of the TomCat Server
C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps by default
Delete the existing project folder Restart Tomcat
Deploy A Web Application Project
![Page 18: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/18.jpg)
18
Database
![Page 19: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/19.jpg)
19
Database A database is an organized collection of
data.
There are many different strategies for organizing data to facilitate easy access and manipulation.
A database management system (DBMS) provides mechanisms for storing, organizing, retrieving and modifying data for many users.
![Page 20: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/20.jpg)
20
JDBC (Java Database Connectivity) Java programs communicate with databases and
manipulate their data using the JDBC API.
A JDBC driver enables Java applications to connect to a database in a particular DBMS and allows you to manipulate that database using the JDBC API.
Using the JDBC API enables developers to change the underlying DBMS without modifying the Java code that accesses the database.
Most popular database management systems now provide JDBC drivers. There are also many third-party JDBC drivers available.
![Page 21: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/21.jpg)
21
![Page 22: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/22.jpg)
22
JDBC API Java APIs
Java APIs are jar files which can be unzipped by compression software.
Java API jar files contain compiled java codes (.class) organized by following their packaged names.
Some Java APIs also contain source codes.
jTDS (http://jtds.sourceforge.net/) jTDS is an open source 100% pure Java (type 4) JDBC 3.0
driver for Microsoft SQL Server (6.5, 7, 2000, 2005 and 2008) and Sybase (10, 11, 12, 15).
http://sourceforge.net/projects/jtds/files/jtds/1.2.5/jtds-1.2.5-dist.zip/download
Connection String jdbc:jtds:<server_type>://<server>[:<port>][/
<database>][;<property>=<value>[;...]] jtds-1.2.2.jar
![Page 23: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/23.jpg)
23
Import APIs Into A Web Application To use third-party APIs, we have to import these APIs
into our project.
1. Put third-party APIs under the lib folder Copy your API (jar) files into the folder WEB-INF/lib If “Referenced Libraries” contains APIs just copied, we
are all set. Otherwise, go to step 2.
2. Import APIs into your project Right click on the project -> “properties” In the properties window, choose “Java Build Path” ->
“Libraries” tab Click “Add JARs” -> select the APIs you want to import
in the pop-up window -> Click “OK” Now, we can see the selected APIs displayed in the
properties window. Click “OK” on the properties window.
“Referenced Libraries” should contains APIs imported.
![Page 24: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/24.jpg)
24
Step 2: import APIs into project
![Page 25: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/25.jpg)
25
Step 3
![Page 26: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/26.jpg)
26
Data Scheme Used in The Demo
Authors
Name Data Type NULL
authorID int NOT NULL PRIMARY KEY
firstName
nvarchar(50) NULL
lastName nvarchar(50) NULL
AuthorISBN
Name Data Type NULL
authorID int NOT NULL
isbn nvarchar(20) NOT NULL
Titles
Name Data Type NULL
isbn nvarchar(20) NOT NULL PRIMARY KEY
title nvarchar(100) NULL
editionNumber
int NULL
copyright nvarchar(10) NULL
![Page 27: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/27.jpg)
27
Sample Code
Showing how to connect to a database, retrieve data based on a given SQL, and display the results on a JSP.
http://localhost:8080/MIS510Demo/
![Page 28: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/28.jpg)
28
Command Types boolean execute()
Executes the SQL statement in this PreparedStatement object, which may be any kind of SQL statement.
ResultSet executeQuery()Executes the SQL query in this PreparedStatement object and returns the ResultSet object generated by the query.
int executeUpdate()Executes the SQL statement in this PreparedStatement object, which must be an SQL INSERT, UPDATE or DELETE statement; or an SQL statement that returns nothing, such as a DDL statement.
![Page 29: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/29.jpg)
29
XMLs
XML (http://www.w3schools.com/XML/default.asp)
![Page 30: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/30.jpg)
30
Introduction What is XML
XML stands for EXtensible Markup Language XML is a markup language much like HTML XML was designed to carry data, not to display
data XML tags are not predefined. You must define
your own tags XML is designed to be self-descriptive XML is a W3C Recommendation
The World Wide Web Consortium (W3C) is the main international standards organization for the World Wide Web
![Page 31: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/31.jpg)
31
Introduction XML is Everywhere
RSS are XMLs
We have been participating in XML development since its creation. It has been amazing to see how quickly the XML standard has developed, and how quickly a large number of software vendors has adopted the standard.
XML is now as important for the Web as HTML was to the foundation of the Web.
XML is everywhere. It is the most common tool for data transmissions between all sorts of applications, and is becoming more and more popular in the area of storing and describing information.
![Page 32: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/32.jpg)
32
XML Tree<bookstore> <book category="COOKING"> <title lang="en">Everyday Italian</title> <author>Giada De Laurentiis</author> <year>2005</year> <price>30.00</price> </book> <book category="CHILDREN"> <title lang="en">Harry Potter</title> <author>J K. Rowling</author> <year>2005</year> <price>29.99</price> </book> <book category="WEB"> <title lang="en">Learning XML</title> <author>Erik T. Ray</author> <year>2003</year> <price>39.95</price> </book></bookstore>
![Page 33: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/33.jpg)
33
XML Rules XML documents must contain one and only one root
element. This element is "the parent" of all other elements.
All XML Elements Must Have a Closing Tag
XML Tags are Case Sensitive
XML Elements Must be Properly Nested
XML Attribute Values Must be Quoted
![Page 34: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/34.jpg)
34
XML Elements What is an XML Element?
An XML element is everything from (including) the element's start tag to (including) the element's end tag.
An element can contain other elements, simple text or a mixture of both. Elements can also have attributes.
In the example, <bookstore> and <book> have element contents, because they contain other elements. <author> has text content because it contains text.
“XPath” can be used to identify elements. From the “bookstore” element,
“book/title” can be used to identify “title” elements.
<bookstore> <book category="CHILDREN"> <title>Harry Potter</title> <author>J K. Rowling</author> <year>2005</year> <price>29.99</price> </book> <book category="WEB"> <title>Learning XML</title> <author>Erik T. Ray</author> <year>2003</year> <price>39.95</price> </book></bookstore>
![Page 35: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/35.jpg)
35
XML APIs
jdom: http://www.jdom.org/dist/binary/jdom-1.1.1.zip Unzip jdom-1.1.1.zip
“jdom.jar” under the “build” folder “jaxen.jar” and “Saxpath.jar” under the
“lib” folder
![Page 36: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/36.jpg)
36
APIs
FlickerYouTubeAmazon
![Page 37: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/37.jpg)
37
Flicker API General Info
Main page of flicker API http://www.flickr.com/services/api/
Description of the flicker search function http://www.flickr.com/services/api/flickr.photos.search.h
tml Flicker search API explorer
http://www.flickr.com/services/api/flickr.photos.search.html
Apply API key http://www.flickr.com/services/api/misc.api_keys.html
Query example http://api.flickr.com/services/rest/?
method=flickr.photos.search&api_key=2d752c2f6b090dbb52a3bed85e30bbd2&text=paris
![Page 38: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/38.jpg)
38
Flicker API
Steps to search Flicker Apply for a API key Send a search request to Flicker server Receive the query result (XML format) Parse the result and display photos on a
jsp
![Page 39: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/39.jpg)
39
YouTube API General Info
Main page of YouTube API http://code.google.com/intl/en/apis/youtube/2.0/
developers_guide_java.html
Apply API Key http://code.google.com/intl/en/apis/youtube/2.0/
developers_guide_java.html#Authentication
Description of the YouTube video search function http://code.google.com/intl/en/apis/youtube/2.0/
developers_guide_java.html#Searching_for_Videos
Query parameter definition http://code.google.com/intl/en/apis/youtube/2.0/
reference.html#Query_parameter_definitions
Query example http://gdata.youtube.com/feeds/api/videos?q=paris
![Page 40: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/40.jpg)
40
YouTube API
Steps to search YouTube Apply for a API key Send a search request to YouTube server Receive the query result (XML format) Parse the result and display videos on a
jsp Have to handle namespace issue
![Page 41: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/41.jpg)
41
Amazon API General Info
Main page of Amazon Product Advertising API https://affiliate-program.amazon.com/gp/advertising/
api/detail/main.html
Java Developer Center http://docs.amazonwebservices.com/
AWSECommerceService/2009-10-01/GSG/
API Key http://aws.amazon.com/
Commons Codec Download http://commons.apache.org/downloads/
download_codec.cgi
![Page 42: 1 Introduction to Web Applications & APIs. 2 Agenda Architecture of Web Applications Three layer architecture Web Server (Tomcat) Installation Data.](https://reader033.fdocuments.in/reader033/viewer/2022052702/56649f555503460f94c794fc/html5/thumbnails/42.jpg)
42
Amazon API Import commons-codec-1.4.jar Steps to search Amazon
Apply for a API key Generate search conditions Generate a parameter string Generate a string to sign Generate a signature Generate a query URL Send a search request to Amazon server Receive the query result (XML format) Parse the result and display products on a jsp
Have to handle namespace issue