1 / 38

Comp 2513 E-Commerce Infrastructure 1

Comp 2513 E-Commerce Infrastructure 1. Daniel L. Silver, Ph.D. 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

maggy-howe
Download Presentation

Comp 2513 E-Commerce Infrastructure 1

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Comp 2513E-Commerce Infrastructure 1 Daniel L. Silver, Ph.D.

  2. 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 • References: Chapters 1 and 2 of Sharma Daniel L. Silver

  3. Outline • Following the business evolution on the web • The major architectural components of the Internet • Intro to HTML Daniel L. Silver

  4. Business Evolution on the Web Processes Functionality Web-enabled applicatons Transactions Interactivity Dynamic web pages Publishing Static web pages Time or Maturity Daniel L. Silver

  5. What is an internet? • Communication between two or more potentially heterogeneous networks (LANs) • The “Internet” is a set of standards for inter-network communications Daniel L. Silver

  6. 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 Comm. Protocol Server Client Daniel L. Silver

  7. TCP/IP Protocol Architecture Transmission Control Protocol Internet Protocol Daniel L. Silver

  8. 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 Daniel L. Silver

  9. Traditional Client-Server Applications that use the Internet Telnet Protocol Telnet Window Telnet Server FTP FTP Server FTP Client SMTP/POP eMail Client eMail Server TCP TCP IP IP Internet Network Network Physical Physical Daniel L. Silver

  10. Data Encapsulation under TCP/IP Daniel L. Silver

  11. 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 Daniel L. Silver

  12. Major Architectural Components of the Web Client 1 Browser HTTP TCP/IP Server A HTTP Server App. Server Database Server Internet Client 2 Browser index.html URL Server B Server C Daniel L. Silver

  13. 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 Daniel L. Silver

  14. 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 WC3 definitions For a more user friendly resource: http://www.pierobon.org/iis/index.htm Daniel L. Silver

  15. HTTPHyperText Transfer Protocol • The application protocol of the Web • Like FTP it is layered on top of TCP/IP HTTP Web Browser HTTP Server TCP TCP IP IP Internet Network Network Physical Physical Daniel L. Silver

  16. HTTPHyperText Transfer Protocol Client There is a 3 step process per transaction: Browser accepts request from keyboard … • (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) • (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 • If HTTP 1.0, by default server breaks the connection If HTTP 1.1, server can let client break connection … Browser loads, interprets and displays page. For further info on HTTP see http://www.w3.org/Protocols/rfc2616/rfc2616.html Internet Server Daniel L. Silver

  17. 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. How does it get this? Daniel L. Silver

  18. 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.0 Accept: text/plain Accept: text/html User-Agent: Mozilla/2.0 <CR/LF> Daniel L. Silver

  19. HTTP Request/Response Example you can try … > telnet eagle.acadiau.ca 8080 Trying 131.162.201.7... Connected to eagle.acadiau.ca. Escape character is '^]'. GET /danstech/index.jsp HTTP/1.0 HTTP/1.1 200 OK Content-Type: text/html Connection: close Date: Thu, 19 Sep 2002 12:40:54 GMT Server: 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. Daniel L. Silver

  20. 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 Daniel L. Silver

  21. 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! Daniel L. Silver

  22. HTML: A Primer

  23. 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) Daniel L. Silver

  24. 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) Daniel L. Silver

  25. 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> Daniel L. Silver

  26. Basic Syntax of HTML • Comments • Background Color • Text Formatting • Lists • Images • Links to other documents • Tables • Frames Daniel L. Silver

  27. HTML - Comments General: <!-- comment -- > Examples: <!-- This is a comment -- > <!-- <title>My First Page</title> -- > Daniel L. Silver

  28. HTML - Colours By 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 Daniel L. Silver

  29. 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> Daniel L. Silver

  30. HTML - Fonts Types Verdana<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 SansMS</font> Daniel L. Silver

  31. 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> Daniel L. Silver

  32. 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> Daniel L. Silver

  33. HTML – Lists Example: <HTML><HEAD></HEAD> <BODY> Apples <UL> <LI>Red <LI>Green </UL> Mangoes <UL type=square> <LI>Green <LI>Yellow </UL> </BODY> </HTML> Ordered Lists: <OL> Unordered List: <UL> Daniel L. Silver

  34. HTML - Images • Various digital image formats can be embedded with in HTML: .gif, .jpg • Example • See www.bellsnwhistles.com as source of images and other objects. <BODY> <H1>My new baby girl.</H1> <IMG SRC=“NicoleSilver.jpg”> </BODY> Daniel L. Silver

  35. HTML – Links Display 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> Daniel L. Silver

  36. 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> Daniel L. Silver

  37. Resources • HTML Guides: www.cwru.edu/help/Help_www2.htmlhttp://www.cc.ukans.edu/~acs/docs/other/HTML_quick.shtml • A great interactive tutorial.http://www.davesite.com/webstation/html/ • Other how-to guideshttp://htmlgoodies.earthweb.com/http://look.html.tucows.com/ • PowerHTML is a freeware editor for HTML: http://library.thinkquest.org/16728/msie/powerhtml.html • Fun: Europe vs. Italy (Flash technology)http://www.infonegocio.com/xeron/bruno/italy.html Daniel L. Silver

  38. THE ENDdanny.silver@acadiau.ca

More Related