The University of Nottingham

Transcription

1 The University of Nottingham SCHOOL OF COMPUTER SCIENCE A LEVEL 1 MODULE, SPRING SEMESTER Web Programming and Scripting Time allowed TWO Hours Solutions Turn over

2 2 1. Web enabling infrastructure (a) Describe two transmission media that are commonly used in computer networks. (4) For example: Coaxial cable: a single copper wire (used for data transmission) is surrounded by cylindrical metal shield. There is insulation between the wire and shield (to prevent them touching) and outer insulation. The shield provides a barrier to EM radiation in both directions and Fibre optic cable: a thin glass tube that reflects light internally is used. The transmitter uses LED or laser to transmit data as pulses of light and the receiver uses a light sensitive transistor to detect the transmitted signal. (b) Explain how computer access to the shared communication medium is coordinated in each of the three main Local Area Network (LAN) topologies star, ring and bus. (6) Star: central coordination through a dedicated central hub, which accepts data from transmitting computer and delivers to destination computer Ring: data flows around the closed loop, a token is passed from computer to computer to regulate whose turn it is to transmit, a computers can only transmit if it is currently in poison of the token Bus: coordination through the CSMA/CD protocol, which prevents computers from interrupting an ongoing transmission (computers have to check the status of the share medium before starting to send data) and specifies how computers can detect and recover from simultaneous transmissions which lead to collision. (c) Describe the purpose of the TCP protocol in the Internet protocol stack. (3) Provides illusion of a connection data may be sent in a continual stream between two hosts TCP is responsible for verifying the correct delivery of data packets between machines o detection of errors or lost data o management of retransmission until the data is correct and completely received o assembles packets of data into the correct order without duplication o handles multiplexing (d) Identify which of the following is not a valid URL format and explain why: (2) 1. mailto:boriana.koleva@nottingham.ac.uk 2. ftp://marian.cs.nott.ac.uk/ 3. marian.cs.nott.ac.uk (marian.cs.nott.ac.uk) is not a valid URL

3 3 G5XABC-E1 Because it does not include the first part of the URL, which identifies the protocol (e) Explain what virtual hosting is. (2) A server which supports more than one site on a computer (potentially reducing the cost of each site and making their maintenance more convenient) For example, a server could be receiving requests for two domains, and both of which resolve to the same IP address. For the server would send the HTML file from the directory /www/joeuser/site/, while requests for would make the server serve pages from /www/anthonyuser/site/ (f) Describe the client-server paradigm of communication and explain how it is implemented by the HTTP protocol. (5) In the client server paradigm o A server application provides a specific service and waits passively for contact from clients o A client application actively initiates contact with the server with typically many clients interacting with each server The web browser is the client and establishes a connection to the server, sending it a request HTTP message o This contains a request line (with the method to be applied to the data resource, the identifier of the resource and the protocol version in use) followed by header fields and an optional message body (which contains user supplied form data if the POST method was used) The Web server responds to the request by generating a response HTTP message o This contains a status line (with the protocol version, a status code, and a reason phrase ) followed by header fields and an optional response body (which contains the data, often an XHTML document) (g) Identify and describe the different component parts of the following HTTP Request line: (3) GET /coursework/test.html HTTP/1.1 GET the HTTP method to be applied to the data resource, GET returns the content of the specified document /coursework/test.html domain part of the URL (resource identifier) HTTP/1.1 the protocol version in use 2. Mark-up languages (XTHML and XML) (a) Explain what the difference is between HTML and XHTML. (4) G5XABC-E1 The HTML is a mark-up language defined using SGML HTML has lax syntax rules, leading to sloppy and sometime ambiguous documents XHTML is defined with the XML meta language (initially just HTML 4.01 but redefined with XML rather than SGML)

4 4 Consequently XHTML syntax is much more strict, leading to clean and clear documents in a standard form (the correctness of which can be validated) e.g. it is case sensitive, tags must always be closed, attribute values must be quoted (b) What XHTML tag and attribute are used to insert an image in a webpage? (2) The <img> tag with the src attribute (c) State if the following fragment of XHTML script is valid and explain why. (3) <table border = 4> <caption> Price of Fruit <tr> <th>fruit</th> <th>price</th> </tr> <tr> <td>apple</td> <td> 0.20</td> </tr> <tr> <td>orange</td> <td> 0.50</td> </TR> </table> No, it is not valid because: The value of the border attribute is not in quotes The caption tag is not closed The all XHTML tag names are lower case therefore the </TR> tag will not be recognised as valid (d) Describe (or draw) what a web browser will display after processing the following fragment of an XHTML document. (4) The <big> sleet <big> in <big> <i> Crete </i><br /> lies </big> completely </big> in </big> the street The sleet in Crete lies completely in the street (e) Write a fragment of XHTML code to create a definition list as shown below: (4) <dl> <dt> 152 </dt> <dd> Two-place trainer </dd> <dt> 172 </dt> <dd> Smaller four-place airplane </dd> </dl>

5 5 G5XABC-E1 (f) Define what an XML namespace is and specify the format of a namespace declaration instruction. (3) An XML namespace is a collection of element names used in XML documents A namespace declaration has the form: <element_name xmlns[:prefix] = URI> The prefix is a short name for the namespace, which is attached to names from the namespace in the XML document (E.g. <gmcars xmlns:gm = " In the document, you can use <gm:pontiac>) (g) Explain the difference between the DOM and SAX XML processing approaches and outline their comparative advantages and disadvantages. (5) The SAX approach is based on the concept of event processing every time a syntactic structure (e.g., a tag, an attribute, etc.) is recognized, the processor raises an event. The application defines event handlers to respond to the syntactic structures. With the DOM approach the processor builds a DOM tree structure of the document (similar to the processing by a browser of an XHTML document). When the tree is complete, it can be traversed and processed. Advantages of the DOM approach: 1. Good if any part of the document must be accessed more than once 2. If any rearrangement of the document must be done, it is facilitated by having a representation of the whole document in memory 3. Random access to any part of the document is possible 4. Because the whole document is parsed before any processing takes place, processing of an invalid document is avoided Disadvantages of the DOM approach: 1. Large documents require a large memory 2. The DOM approach is slower 3. Web document presentation (CSS and web design guidelines) (a) Explain what the benefits are of using Cascading Style Sheets (CSS) to specify the presentation of web documents versus using XHTML tags only. (3) XHTML necessarily mixes style and content, but stylesheets help the separation CSS allows you to impose a standard style on a whole document, or even a whole collection of documents -> making web development and maintenance easier Many XHTML style tags and attributes are now depreciated (b) What are external style sheets? What is their content and how are they linked to a XHTML document? (3) G5XABC-E1

6 6 stored as separate files potentially on any server on the Internet, can be applied to any number of documents their content is a list of style rules in the form selector {property_1:value_1; property_2:value_2; ;} a <link> tag is used to specify that the browser is to fetch and use an external style sheet file <link rel = "stylesheet" type = "text/css" href = "URL"></link> (c) What will be the effect of the following three CSS style rules? (6) h1 {text-align:center} level one headings will appear centred on the page body p b {color: orange} bold elements in specified position in body of document, i.e. that are part of paragraph elements will appear in orange colour h2.address {text-align:right; font-family: 'Times New Roman';} only heading level 2 elements whose class has been set to address (<h2 class = address >) will have the specified presentation, i.e. appear aligned to the right and in Times New Roman font (d) What CSS selector allows a CSS style rule to be applied to just one specific instance of an element in a XHTML document? Write an example of such a CSS rule that specifies that a particular paragraph element should be indented by 20 pixels and show an example of its use in a XHTML document. (4) The id selector allows the application of a style to one specific element Specification: #indentedpara {text-indent: 20px} In XHTML document: <p id = indentedpara > (e) Give three examples of assistive technologies that might be used by Web users with disabilities. (3) E.g.: Screen reader software used by blind and vision impaired users and can be helpful for users with reading or learning difficulties Refreshable Braille displays renders text as Braille characters, used by blind and vision impaired users Braille keyboard used by blind and vision impaired users for input, each key is labelled with Braille symbol (f) Discuss how navigation through a website can be made easer for users, describing three examples of techniques that can be employed. (6) Maps o give an overview of the structure

7 o Show current location you are here! Recommended routes o Guided tour or bus tour metaphor o Linear path through non-linear structure Levels of access o Summary then progressive depth 7 G5XABC-E1 4. Client side scripting (a) Briefly describe two major uses of JavaScript on the client side. (2) validate user input supplied through XHTML form elements dynamically manipulate the attributes (such as style and content) of XHTML elements, thus creating Dynamic XHTML (b) JavaScript is a loosely typed scripting language. Define what that means. (2) Variables in a JavaScript script can be used to store anything their type is not defined by the programmer in advance. The type of a particular appearance of a variable in the script is determined by the interpreter. (c) Given the following JavaScript function definition: function num_order (a, b) { } State what the values of the formal function parameters will be after the following function calls with the specified actual parameters. Explain what happens to excess actual parameters. (4) num_order(1); a will be set to 1 and b will be undefined num_order(2, 5); a will be set to 2 and b will be set to 5 num_order(10, 3, 7); a will be set to 10 and b will be set to 3 - the excess actual parameter (value of 7) is not accessible via a formal parameter but is available through a property array named arguments (element with index 2) (d) Describe the three approaches to accessing XHTML elements through JavaScript and write the corresponding JavaScript to access the Cancel button element defined through the XHTML script shown below. (6) G5XABC-E1

8 8 <body> <form name = buttonform action = > <input type button name = OK id = OKid /> <input type button name = Cancel id = CancelId/> </form> </body> 1. Using the DOM address (using the document, forms and elements objects) document.forms[0].elements[1] 2. Using element name attributes document.buttonform.cancel 3. Using getelementbyid method document.getelementbyid("cancelid") (e) What is the purpose of and parameter(s) used with the alert method of the JavaScript Window object? (2) Opens a dialog box which displays a string provided as a parameter to the method and an OK button Takes a single string parameter (f) Explain what the main difference is between Java applets and Java servlets. (2) Applets class file is sent to the browser and it is executed by a virtual machine contained in the web browser Servlets class resides on server and is executed by a virtual machine contained in the web server, only the output (in the form of HTML) is sent to the browser (g) Give three examples of security restrictions for Java applets loaded over the network. (3) Cannot read or write files on the client Cannot read some system properties Cannot start other programs (h) How can parameters be passed to a Java applet from the XHTML document in which it is embedded? Write the XHTML script to pass a variable with name size and value 24. How will this variable be accessed from the Java applet? (4) Applets can be sent parameters from XHTML, using the <param> tag and its two attributes, name and value (parameter values are strings) <param name = "size" value = "24"> The applet gets the parameter values with the getparameter method, which takes a string (the name of the parameter) E.g. getparameter("size")

9 9 G5XABC-E1 5. Server side scripting (a) Define what SSI (Server Side Includes) is. (2) SSI instructions to the server embedded in XHTML, which are then processed by the web server when the page is requested. The most common usage of SSI is the inclusion of common menus, headers and footer elements for a page or adding other small pieces of dynamic information to a webpage (e.g. date) (b) Define what PHP is. (2) PHP is a server-side scripting language whose scripts are embedded in XHTML documents (similar to JavaScript, but on the server side). Allows web developers to create dynamic content through form handling and database access. (c) Explain how PHP code can be embedded in an XHTML document. (2) PHP code can be specified in an XHTML document internally or externally: Internally: <?php...?> Externally: include ("myscript.inc") (the file can have both PHP and XHTML) (d) What are the two modes of the PHP processor? (2) PHP processor has two modes: copy (XHTML) when the processor finds XHTML code in the input file (which may include embedded client side script), it simply copies it to the output file interpret (PHP) when it encounters PHP script in the input file, it interprets it and sends any output of the script to the output file (e) What are the differences between single and double quoted literal strings in PHP? (2) Single-quoted string literals - embedded variables are NOT interpolated and embedded escape sequences are NOT recognized Double-quoted string literals - embedded variables ARE interpolated and embedded escape sequences ARE recognized (f) Given the following text box element that is part of a XHTML form, write the PHP script to access its value when the POST method is used to transmit the form data (when the submit button is pressed)? (2) <input type = "text" name = "street" size = "30" /> $_POST[ street ] gives access to the value of this text box element G5XABC-E1

10 10 (g) Explain why it is useful for the server to be able to relate a HTTP request to a session and describe how PHP implements session tracking. (5) It is useful for the server to be able to connect a HTTP request made during a session to other requests made by the same client during that session, as it enables the implementation of important website functionality: o Shopping carts for many different simultaneous customers o Customer profiling for advertising o Customized interfaces for specific clients For session tracking, PHP creates and maintains a session tracking id, which is created with a call to session_start with no parameters Subsequent calls to session_start retrieve any session variables that were previously registered in the session (in $_SESSION array) Session variable are created or changed by assignments to the $_SESSION array (h) What is a cookie, how can it be created in a PHP script and how can the script determine if a particular cookie exists? (6) Cookies provide a general approach to storing information about sessions on the client machine A cookie is a small object of information consisting of a name and a textual value. It is created by some software system on the server (such as a CGI program or PHP script) A cookie is set in PHP with the setcookie function, which takes one or more parameters the first parameter is the cookie s name (a string), the second is the new value for the cookie (a string) and the third is the expiration time in seconds (an integer) Cookies are obtained in a script the same way form values are, using the $_COOKIES array (cookie names as keys) the IsSet method is used to check if a particular cookie came with the request (i) What is the purpose of the PHP mysql_connect function and what parameters does it take? (2) mysql_connect is used to connect to a database from a PHP script the method can have three parameters: o Host (default is localhost) o Username (default is the username of the PHP script) o Password (default is blank, which works if the database does not require a password)