e-commerce infrastructure.ppt
TRANSCRIPT
![Page 1: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/1.jpg)
E-Commerce Infrastructure
![Page 2: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/2.jpg)
Objectives• To describe the major architectural
components of the Internet that form the infrastructure for E-Commerce
• To discuss HTML – Hypertext Markup Language – the language of E-Commerce
![Page 3: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/3.jpg)
Outline
• Following the business evolution on the web• The major architectural components of the
Internet• Intro to HTML
![Page 4: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/4.jpg)
Business Evolution on the Web
Publishing
Time or Maturity
Functionality Interactivity
Transactions
Processes
Static web pages
Dynamic web pages
Web-enabled applicatons
![Page 5: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/5.jpg)
What is an internet?• Communication between two or more
potentially heterogeneous networks (LANs)
• The “Internet” is a set of standards for inter-network communications
![Page 6: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/6.jpg)
The Client-Server Model• Client – a machine that makes Internet requests
for resources (printing, data, processing) • Server – a machine that performs tasks for clients
on request and manages network resources• Communications protocol – a set of rules for two
or more entities to converse
Client ServerComm.Protocol
Comm.Protocol
![Page 7: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/7.jpg)
TCP/IP Protocol Architecture
Transmission Control Protocol
Internet Protocol
![Page 8: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/8.jpg)
TCP/IP Protocol Architecture
• Internet Protocol (IP) – like a postcard that contains:– Destination address (131.162.201.7)– Return address– Block of data (content)
• Transmission Control Protocol (TCP)– Ensures the post card gets through– Ensures the order of deliver– Handles errors and control flow
![Page 9: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/9.jpg)
Traditional Client-Server Applications that use the Internet
Physical
Network
TCP
IP
Physical
Network
TCP
IPInternetInternet
Telnet Window Telnet Server
FTP Client FTP Server
eMail Client eMail ServerSMTP/POP
FTP
Telnet Protocol
![Page 10: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/10.jpg)
Data Encapsulation under TCP/IP
![Page 11: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/11.jpg)
What is the Web?
• A class of applications that use the Internet plus a lot of new technologies and standards that facilitate access to resources managed by servers connected to the Internet:– Hardware: Servers– Software: Browsers, Servers– Protocols: HTTP, HTML, MIME
![Page 12: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/12.jpg)
Major Architectural Components of the Web
InternetInternet
Browser
DatabaseServer
Client 1
Server A
Server BServer C
URL
HTTPTCP/IP
Browser
Client 2 HTTPServer
App.Server
index.html
![Page 13: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/13.jpg)
Components of the Web• Website - a collection of files and associated
software on a server (may run on client or server)• Web Server – a software system that can field
requests for website files (HTTP server) and applications (Application Server)
• Web Browser – a GUI client application (Netscape Navigator, Internet Explorer) that facilitates access to Website files and software for display of data, video and audio
• Database Server – provides an interface to a structure database for web applications
![Page 14: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/14.jpg)
Components of the Web
• HTTP - HyperText Transfer Protocol• URL - Universal Resource Locator for a file on
the internet (www.acadiau.ca)• Webpage – a representation of information
understood by the browser• HTML - HyperText Markup Language
![Page 15: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/15.jpg)
HTTPHyperText Transfer Protocol
Physical
Network
TCP
IP
Physical
Network
TCP
IPInternetInternet
Web Browser HTTP ServerHTTP
The application protocol of the WebThe application protocol of the Web Like FTP it is layered on top of Like FTP it is layered on top of TCP/IPTCP/IP
![Page 16: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/16.jpg)
HTTPHyperText Transfer Protocol
There is a 3 step process per transaction:Browser accepts request from keyboard …1. (a) Client locates & sends an HTTP request for a webpage
(b) Client sends optional header info to server about client (browser configuration, acceptable files)(c) Client may send addition data (used by POST method)
2. (a) Server responds with a status line (eg. HTTP/1.1 200 OK) (b) Server sends header info to client about itself and requested file (server config., file format)(c) Server sends the requested data or optionally additional error information
3. If HTTP 1.0, by default server breaks the connectionIf HTTP 1.1, server can let client break connection
… Browser loads, interprets and displays page.
Client
Server
Internet
Internet
![Page 17: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/17.jpg)
How is the Webpage Located?
• URL – Universal Resource Locator• The address of an resource on the Internet
– http://www.acadiau.ca or http://eagle.acadiau.ca– ftp://a.cs.uiuc.edu/– file://C:/Work/Acadia/1503.w01/index.html
– <protocol>://<machine>:<port>/<file>• Default port = 80• Default file = index.html
– Machine = IP address.
![Page 18: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/18.jpg)
What does an HTTP Request/Response look like?
• HTTP request headers:• Request: GET, POST, PUT, DELETE, etc• Header - plain text
– Info about the object (MIME etc)– Methods that can be processed by client
• Example of a Request Header:GET /danstech/sample.html HTTP 1.0Accept: text/plainAccept: text/htmlUser-Agent: Mozilla/2.0<CR/LF>
![Page 19: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/19.jpg)
HTTP Request/Response Example you can try …
> telnet eagle.acadiau.ca 8080Trying 131.162.201.7...Connected to eagle.acadiau.ca.Escape character is '^]'.
GET /danstech/index.jsp HTTP/1.0HTTP/1.1 200 OKContent-Type: text/htmlConnection: closeDate: Thu, 19 Sep 2002 12:40:54 GMTServer: Apache Tomcat/4.0.4 (HTTP/1.1 Connector)Set-Cookie: JSESSIONID=ECECB564E60E795E0B2E86D330D76649;Path=/danstech<html><head><title>Danny's Car Shop</title> …</html>Connection closed by foreign host.
![Page 20: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/20.jpg)
MIME• HTTP uses a predefined set of document formats
borrowed from eMail (actually, HTTP was modeled after an eMail protocol)
• MIME - Multipurpose Internet Mail Extensions• Defines the content format• Content-type: <data type>/<subtype>
– text/html– text/plain– image/gif– video/mpeg– application/msword
![Page 21: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/21.jpg)
A Web session is Connectionless• TCP/IP is connection-oriented• But each HTTP request/response makes a
new connection• Potentially, each browser/server operation
is unaware of any related connections• Why do this? A sense of state is needed for
E-Commerce transaction processing• We’ll discuss this further next day!
![Page 22: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/22.jpg)
HTML: A Primer
![Page 23: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/23.jpg)
HTML
• HyperText Markup Language – language used to represent webpages
• Markers call “tags” are used to specify how elements of page should be displayed– <centre>Hello World!</centre>
• Fixed vocabulary of tags• Describes the structure of a document not its
specific layout (layout may change size of window and size of font)
![Page 24: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/24.jpg)
HTML
• HTML files end with either .html or .htm• Can be created by
– A text editor (Wordpad, Notepad, vi)– A Webpage editor (Netscape Composer)– A translation from another document format (MS
Word to HTML)
![Page 25: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/25.jpg)
A Basic HTML Document
<HTML>
<HEAD><TITLE>First Page</TITLE></HEAD>
<BODY BGCOLOR= '#0000ff'>
<!-- <BODY BGCOLOR= '#ff0000'> -->
<FONT FACE="Arial, Helvetica" COLOR='#FFFFFF'>
<CENTER>
I'm quite hyper - even the language I speak is Hyper-Text-Markup-Language <B> - Vivek</B>
</CENTER>
</FONT>
</BODY>
</HTML>
![Page 26: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/26.jpg)
Basic Syntax of HTML
• Comments• Background Color • Text Formatting • Lists• Images• Links to other documents• Tables• Frames
![Page 27: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/27.jpg)
HTML - Comments
General:<!-- comment -- >Examples:<!-- This is a comment -- ><!-- <title>My First Page</title> -- >
![Page 28: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/28.jpg)
HTML - ColoursBy Color Name• black, red, white, yellow, olive, tan, blue, navy, green,
magenta, brown, turquoise By Pigment Mix
<BODY BGCOLOR= '#0000ff'>
• #rrggbb • rr, is the amount of red in the colour (00
is none and FF is a lot) • gg is the amount of green • bb is the amount of blue • <BODY BGCOLOR= '#00ff00'> is very green • <BODY BGCOLOR= '#880088'> is purple
![Page 29: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/29.jpg)
HTML- Text Formatting• bold <b> bold </b> • italics <i> italics </i> • underlined <u> underlined </u> • typewriter <tt> typewriter </tt> .
• <font size=n> and </font>This is going to be <font size = +3>BIG</font>
• <font color=red size = -1>Combining color and size</font>
![Page 30: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/30.jpg)
HTML - Fonts TypesVerdana
<font size=+2 face="Verdana">Verdana</font>Arial
<font size=+2 face="Arial">Arial</font>Helvetica
<font size=+2 face="Helvetica">Helvetica</font>Impact
<font size=+2 face="Impact">Impact</font>Comic Sans MS
<font size=+2 face="Comic Sans MS">Comic Sans MS</font>
![Page 31: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/31.jpg)
HTML- Text Positioning• Paragraph: <p> and </p>
<p>This is a new paragraph.</p>• Line break: <br>
We would prefer the following: <br>• Centering: <center> and </center>
<center><b>I am boldly centered</b></center>• Verbatim: <pre> and </pre>
<pre> This will appear exactly as seen here without any …… ….. Changes </pre>
![Page 32: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/32.jpg)
HTML - Headings
<HTML><HEAD><TITLE>Size Tags</TITLE></HEAD><BODY> <FONT FACE="Arial, Helvetica"> <H1> This is size H1 </H1><BR> <H2> This is size H2 </H2><BR> <H3> This is size H3 </H3><BR> <H4> This is size H4 </H4><BR> </FONT></BODY></HTML>
![Page 33: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/33.jpg)
HTML – Lists
Ordered Lists: <OL>Unordered List: <UL>
Example:<HTML><HEAD></HEAD><BODY> Apples <UL>
<LI>Red<LI>Green
</UL> Mangoes <UL type=square>
<LI>Green<LI>Yellow
</UL></BODY></HTML>
![Page 34: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/34.jpg)
HTML - Images
• Various digital image formats can be embedded with in HTML: .gif, .jpg
<BODY><H1>My new baby girl.</H1><IMG SRC=“NicoleSilver.jpg”></BODY>
![Page 35: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/35.jpg)
HTML – LinksDisplay in current browser window:<HTML><HEAD></HEAD><BODY> <A HREF='First.html'>Link to First.html</A></BODY></HTML>
Display in a new browser window:<HTML><HEAD></HEAD><BODY> <A HREF=‘First.html’
target=‘anotherFrame’>Link to First.html</A></BODY></HTML>
![Page 36: E-Commerce Infrastructure.ppt](https://reader035.vdocument.in/reader035/viewer/2022062421/55cf92dc550346f57b9a1b9d/html5/thumbnails/36.jpg)
HTML- Tables<HTML><HEAD></HEAD><BODY> <TABLE BORDER='2'>
<TH>Column 1</TH><TH>Column 2</TH> <TR> <TD>Cell 1</TD><TD>Cell 2</TD> </TR> <TR> <TD>Cell 3</TD><TD>Cell 4</TD> </TR></TABLE>
</BODY></HTML>