Download to read offline
![First Program
public class HelloWorld {
public static void main(String args[])
{
System.out.println("Hello World");
}
}
U-
5
HTML
DOM
-
Prof.
D.
P.
Mishra](https://image.slidesharecdn.com/unit-5htmldom-230723133816-93cc4755/75/HTML_DOM-40-2048.jpg)
![Java Program Structure
public class MyProgram
{
}
// comments about the class
public static void main (String[] args)
{
}
// comments about the method
method header
method body
U-
5
HTML
DOM
-
Prof.
D.
P.
Mishra](https://image.slidesharecdn.com/unit-5htmldom-230723133816-93cc4755/75/HTML_DOM-46-2048.jpg)
![Getting parameters through POST
#include <stdio.h>
#include <string.h>
main() {
char line[255], *userline, *passline,
*s;
char user[20], pass[20];
printf("Content-Type:
text/htmlnn");
printf("<html><head></head>");
printf("<body>");
fgets(line, 255, stdin);
printf("Parameters are: <br />");
userline = strtok(line, "&");
passline = strtok(0, "&");
user[0] = 0;
if (userline) {
s = strtok(userline, "=");
s = strtok(0, "=");
if (s) strcpy(user, s);
}
pass[0] = 0;
if (passline) {
s = strtok(passline, "=");
s = strtok(0, "=");
if (s) strcpy(pass, s);
}
printf("%s, %s", user, pass);
printf("</body>");
printf("</html>");
}
U-
5
HTML
DOM
-
Prof.
D.
P.
Mishra](https://image.slidesharecdn.com/unit-5htmldom-230723133816-93cc4755/75/HTML_DOM-92-2048.jpg)
![Possible Problem
char buff[100];
char *clen = getenv(“CONTENT_LENGTH”);
if (clen==NULL)
/* handle error */
int len = atoi(clen);
if (read(0,buff,len)<0)
… /* handle error */
pray_for(!hacker);
U-
5
HTML
DOM
-
Prof.
D.
P.
Mishra](https://image.slidesharecdn.com/unit-5htmldom-230723133816-93cc4755/75/HTML_DOM-99-2048.jpg)
Uploaded byBIT DURG
HTML_DOM
The document discusses the Document Object Model (DOM) which defines a standard way to access and manipulate HTML, XML, and HTML documents. It defines everything in an HTML document as nodes - the document itself is a document node, elements are element nodes, attributes are attribute nodes, and text is text nodes. The DOM allows programs and scripts to dynamically access and update the content, structure, and style of documents.
More Related Content
![Internet and Web Technology (CLASS-5) [HTML DOM]](https://cdn.slidesharecdn.com/ss_thumbnails/iwtclass-5-200714183135-thumbnail.jpg?width=640&height=640&fit=bounds)
HTML_DOM
- 1.
- 2. What is DOM •The W3C Document Object Model (DOM) is a platform and language-neutral interface • It allows program and scripts to dynamically access and update the content, structure, and style of a document. • The DOM is a W3C (World Wide Web Consortium) standard • The HTML DOM defines a standard way for accessing and manipulating HTML and XML documents. U- 5 HTML DOM - Prof. D. P. Mishra
- 3. What is DOM.. • In the HTML DOM (Document Object Model), everything is a node: The document itself is a document node All HTML elements are element nodes All HTML attributes are attribute nodes Text inside HTML elements are text nodes Comments are comment nodes U- 5 HTML DOM - Prof. D. P. Mishra
- 4. DOM DOM = DocumentObject Model • Defines a hierarchical model of the document structure through which all document elements may be accessed Nodes The W3C DOM defines element of a document is a node of a particular type Node Types Common types are: document node, element node, text node, attribute node, comment node, document-type node U- 5 HTML DOM - Prof. D. P. Mishra
- 5. W3C DOM issplitted 3-different parts • Core DOM - standard model for any structured document • XML DOM - standard model for XML documents XML DOM defines the objects and properties of all XML elements, and the methods to access them • HTML DOM - standard model for HTML documents The HTML DOM defines the objects and properties of all HTML elements, and the methods to access them. U- 5 HTML DOM - Prof. D. P. Mishra
- 6. HTML DOM • Inthe HTML DOM, everything is a node. • The DOM is HTML viewed as a node tree U- 5 HTML DOM - Prof. D. P. Mishra
- 7. Node, Parents, Children& siblings • In a node tree, the top node is called the root • Every node has exactly one parent, except the root (which has no parent) • A node can have any number of children • Siblings are nodes with the same parent U- 5 HTML DOM - Prof. D. P. Mishra
- 8. Programming Interface • TheHTML DOM can be accessed with JavaScript (and other programming languages). • All HTML elements are defined as objects, and the programming interface is the object methods and object properties . • A method is an action you can do (like add or modify an element). • A property is a value that you can get or set (like the name or content of a node). U- 5 HTML DOM - Prof. D. P. Mishra
- 9. Commonly used Methods/Properties • Somecommonly used HTML DOM methods: getElementById(id) - get the node (element) with a specified id appendChild(node) - insert a new child node (element) removeChild(node) - remove a child node (element) • Some commonly used HTML DOM properties: innerHTML - the text value of a node (element) parentNode - the parent node of a node (element) childNodes - the child nodes of a node (element) attributes - the attributes nodes of a node (element) U- 5 HTML DOM - Prof. D. P. Mishra
- 10.
- 11. DOM Example element node <HEAD> documentnode Document_type node <!DOCTYPE> element node <HTML> element node <TITLE> text node "Sample" element node <BODY> element node <P> text node "This is a..." U- 5 HTML DOM - Prof. D. P. Mishra
- 12. Netscape DOM • DOM"begins" at the window object; • Other objects are below the window object in the hierarchy • Exception is the navigator object, (whose properties provide information about the browser version,) which is a peer object of window rather than a child U- 5 HTML DOM - Prof. D. P. Mishra
- 13.
- 14. Microsoft DOM • Microsoftindexes an additional topic called as collections. A "collection," is an array-based object • The observable difference between the two is the syntax. Netscape supports a treelike hierarchical syntax • On the other hand, Internet Explorer exposes all HTML objects as a flat collection and lets you modify the style object U- 5 HTML DOM - Prof. D. P. Mishra
- 15.
- 16. Conclusion - Overview •DHTML – HTML, CSS, Scripting and DOM • DOM - details the characteristic properties of each element of a Web page • DHTML can make your browser dynamic and interactive • Content and design can be separated using Style sheets & uniformity of the site can be maintained using them • Validation of input’s given by the user can be done at the client side, without connection to the server • Drop down menus can be used to put a lot of information on the site U- 5 HTML DOM - Prof. D. P. Mishra
- 17.
- 18. What is DHTML? DHTML is the combination of several built-in browser features in fourth generation browsers that enable a web page to be more dynamic. DHTML is NOT a scripting language (like JavaScript or VBscript), but a browser feature- or enhancement- that makes the browser dynamic It uses a host of different technologies - JavaScript, VBScript, the Document Object Model (DOM), layers, cascading stylesheets - to create HTML that can change even after a page has been loaded into a browser U- 5 HTML DOM - Prof. D. P. Mishra
- 19. DHTML ? • Itis considered to be made up of HTML Cascading Style Sheets (CSS) Scripting language • All three of these components are linked via Document Object Model (DOM) • DOM is the interface that allows scripting languages to access the content, style, and structure of the web documents and change them dynamically U- 5 HTML DOM - Prof. D. P. Mishra
- 20. Tools for DHTML •HTML and XML Partitions and Organizes the content • CSS Defines the Presentation of the content • Scripting - JavaScript, JScript, VBScript Adds interactivity to the page • DOM- Document Object Model Defines what and how elements are exposed for script access U- 5 HTML DOM - Prof. D. P. Mishra
- 21. Components of DHTML •DHTML requires four independent components to work: • HTML, • Cascading Style Sheets, • Scripting and • the Document Object Model. U- 5 HTML DOM - Prof. D. P. Mishra
- 22. HTML: HTML defines thestructure of a Web page, using such basic elements as headings, forms, tables, paragraphs and links. On December 18, 1997, HTML 4.0 attained "recommended" status at the W3C. Changes and enhancements introduced in HTML 4.0 made DHTML possible. Cascading Style Sheets (CSS): Similar to a template in a word-processing document, a style sheet controls the formatting of HTML elements. Like in traditional desktop publishing, one can use style sheet to specify page margins, point sizes and leading. Cascading Style Sheets is a method to determine precedence and to resolve conflicts when multiple styles are used. U- 5 HTML DOM - Prof. D. P. Mishra
- 23. Scripting: • Scripting providesthe mechanisms to interpret user actions and produce client-side changes to a page. • For example, scripts can interpret mouse actions (such as the mouse passing over a specified area of a page through the event model) and respond to the action by using a set of predefined instructions (such as highlighting the text activated by the mouse action). • Although DHTML can communicate with several scripting languages, JavaScript is the de facto standard for creating cross-browser DHTML pages. Document Object Model (DOM): • The DOM outlines Web page content in a way that makes it possible for HTML elements, style sheets and scripting languages to interact with each other. • The W3C defines the DOM as "a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure, and style of documents. U- 5 HTML DOM - Prof. D. P. Mishra
- 24.
- 25. XML DOM • Aprogramming interface for HTML and XML documents. • It defines the way a document can be accessed and manipulated. • Using a DOM, a programmer can create a document, navigate its structure, and add, modify, or delete its elements. • The W3C DOM has been designed to be used with any programming language. • It provides a standard programming interface that can be used in a wide variety of environments and applications. U- 5 HTML DOM - Prof. D. P. Mishra
- 26. Node Interface • XMLparser can be used to load an XML document into the memory of your compute • Information can be retrieved and manipulated by accessing the Document Object Model (DOM). • The DOM represents a tree view of the XML document • The documentElement is the top-level of the tree • This element has one or many childNodes that represent the branches of the tree U- 5 HTML DOM - Prof. D. P. Mishra
- 27. Node Interface.. • ANode Interface is used to read and write (or access if you like) the individual elements in the XML node tree • The childNodes property of the document Element can be accesses with a for/each construct to enumerate each individual node U- 5 HTML DOM - Prof. D. P. Mishra
- 28. XML DOM Parser: •language-neutral programming model • Supports JavaScript, VBScript, Perl, VB, Java, C++ and more • Supports W3C XML 1.0 and XML DOM • Supports DTD and validation U- 5 HTML DOM - Prof. D. P. Mishra
- 29. JavaScript in IE5.0 var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") VBScript set xmlDoc = CreateObject("Microsoft.XMLDOM") ASP set xmlDoc = Server.CreateObject("Microsoft.XMLDOM") U- 5 HTML DOM - Prof. D. P. Mishra
- 30. Loading an XMLfile into the parser <script language="JavaScript"> var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("note.xml") // ....... processing the document goes here </script> U- 5 HTML DOM - Prof. D. P. Mishra
- 31. Loading pure XMLtext into the parser <script language="JavaScript"> var text="<note>“ text=text+"<to>Tove</to><from>Jani</from>“ text=text+"<heading>Reminder</heading>“ text=text+"<body>Don't forget me this weekend!</body>" text=text+"</note>" var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.loadXML(text) // ....... processing the document goes here </script> U- 5 HTML DOM - Prof. D. P. Mishra
- 32. Traversing the nodetree set xmlDoc=CreateObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("note.xml") for each x in xmlDoc.documentElement.childNodes document.write(x.nodename) document.write(": ") document.write(x.text) next U- 5 HTML DOM - Prof. D. P. Mishra
- 33. Providing HTML contentfrom XML files • XML can separate HTML documents from their data var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("note.xml") nodes = xmlDoc.documentElement.childNodes to.innerText = nodes.item(0).text from.innerText = nodes.item(1).text header.innerText = nodes.item(2).text body.innerText = nodes.item(3).text U- 5 HTML DOM - Prof. D. P. Mishra
- 34. Accessing XML elementsby name var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false“ xmlDoc.load("note.xml") document.write(xmlDoc.getElementsByTagName("from").item(0).text) U- 5 HTML DOM - Prof. D. P. Mishra
- 35.
- 36. What is Java??? • A programming language. Java is developed by James Gosling at Sun Microsystems Inc. in 1991 Java is platform independent language Java programming is a/an object-oriented programming • A platform A virtual machine (JVM) definition. Runtime environments in diverse hardware. • A class library Standard APIs for GUI, data storage, processing, I/O, and networking. U- 5 HTML DOM - Prof. D. P. Mishra James Gosling
- 37. Why Java ??.. • Simple • Portable • Secure • Free • Slow U- 5 HTML DOM - Prof. D. P. Mishra
- 38. Similarity with C/C++ •Syntax is similar (control structures are very similar). • Primitive data types similar bool is not an int. • To print to stdout: System.out.println(); U- 5 HTML DOM - Prof. D. P. Mishra
- 39.
- 40. First Program public classHelloWorld { public static void main(String args[]) { System.out.println("Hello World"); } } U- 5 HTML DOM - Prof. D. P. Mishra
- 41. Compiling and Running HelloWorld.java javacHelloWorld.java java HelloWorld HelloWorld.class compile run bytecode source code U- 5 HTML DOM - Prof. D. P. Mishra
- 42.
- 43.
- 44.
- 45. Java Program Structure publicclass MyProgram { } // comments about the class class header class body Comments can be placed almost anywhere U- 5 HTML DOM - Prof. D. P. Mishra
- 46. Java Program Structure publicclass MyProgram { } // comments about the class public static void main (String[] args) { } // comments about the method method header method body U- 5 HTML DOM - Prof. D. P. Mishra
- 47. Comments • Comments ina program are called inline documentation • They should be included to explain the purpose of the program and describe processing steps • They do not affect how a program works • Java comments can take three forms: // this comment runs to the end of the line /* this comment runs to the terminating symbol, even across line breaks */ /** this is a javadoc comment */ U- 5 HTML DOM - Prof. D. P. Mishra
- 48. Java bytecode andinterpreter • Bytecode is an intermediate representation of the program (class). • The Java interpreter starts up a new “Virtual Machine”. • The VM starts executing the users class by running it’s main() method. U- 5 HTML DOM - Prof. D. P. Mishra
- 49. PATH and CLASSPATH •The java_home/bin directory is in your $PATH • If you are using any classes outside the java or javax package, their locations are included in your $CLASSPATH U- 5 HTML DOM - Prof. D. P. Mishra
- 50.
- 51. What is anApplet ? U- 5 HTML DOM - Prof. D. P. Mishra
- 52.
- 53. What is anApplet ? • An applet is a small Java program that is embedded and ran in some other Java interpreter program such as • Java technology-enabled browser • Sun’s applet viewer program called applet viewer U- 5 HTML DOM - Prof. D. P. Mishra
- 54.
- 55. Applet, Webpage, Client,Server U- 5 HTML DOM - Prof. D. P. Mishra
- 56. Applet Program thatruns in appletviewer (test utility for applets) Web browser (IE, Communicator) Executes when HTML (Hypertext Markup Language) document containing applet is opened and downloaded Applications run in command windows U- 5 HTML DOM - Prof. D. P. Mishra
- 57. Java Application vsJava Applet Java applications Run in stand-alone mode No additional software required (such as a Web browser) Java applets Compiled Java class files Run within a Web browser (or an appletviewer) Loaded from anywhere on the Internet security restrictions! U- 5 HTML DOM - Prof. D. P. Mishra
- 58. First Java Applet importjava.awt.*; //Contains all of the classes for creating user interfaces //and for painting graphics and images import java.applet.Applet; public class HelloFromVenus extends Applet { public void paint(Graphics g) { Dimension d = getSize(); g.setColor(Color.orange); g.fillRect(0,0,d.width,d.height); g.setFont(new Font("Sans-serif",Font.BOLD,24)); g.setColor(new Color(255, 10, 0)); g.drawString("Hello From Venus, a Mars Colony!", 40, 25); g.drawImage(getImage(getCodeBase(),"venus.jpg"), 20, 60, this); } } U- 5 HTML DOM - Prof. D. P. Mishra
- 59. HTML Source <html> <head> <title> HelloFrom Venus Applet </title> </head> <body bgcolor=black text=white> <h2>Here is the <em>Hello From Venus</em> Applet</h2> <center> <applet code="HelloFromVenus.class" width=700 height=500> </applet> </center> <hr> <a href="HelloFromVenus.java">The source.</a> </body> </html> U- 5 HTML DOM - Prof. D. P. Mishra
- 60. Compile and Runan Applet To compile: javac HelloFromVenus.java Generates HelloFromVenus.class To run: a) Use the appletviewer from JDK appletviewer Venus.html b) Open page from browser: Venus.html U- 5 HTML DOM - Prof. D. P. Mishra
- 61. Elements of JavaApplets Superclass: java.applet.Applet extend javax.swing.JApplet if you have swing components Swing: Sun's set of GUI components that give much fancier screen displays than the raw AWT No main() method paint() method paints the picture Applet tags: code width height U- 5 HTML DOM - Prof. D. P. Mishra
- 62. Applet Lifecycle • InJava, an applet undergoes object creation and object removal (when its job is over) • This process is known as Applet Life Cycle. • In its life of execution, the applet exists (lives) in one of these 5 states known as callback methods. U- 5 HTML DOM - Prof. D. P. Mishra
- 63. Applet’s Life • Eachapplet has four major events in its lifetime: Initialization --- init() Starting --- start() Painting --- paint(Graphics) Stopping --- stop() Destroying --- destroy() • The methods defined Applet class Except for paint() in class java.awt.Container do nothing--they are stubs You make the applet do something by overriding these methods U- 5 HTML DOM - Prof. D. P. Mishra
- 64.
- 65. Methods are calledin this order • init and destroy are only called once each • start and stop are called whenever the browser enters and leaves the page • do some work is code called by your listeners • paint is called again when the applet needs to be repainted init() start() stop() destroy() paint do some work U- 5 HTML DOM - Prof. D. P. Mishra
- 66. Simple Java Applet:Drawing a String • Now, create applets of our own Take a while before we can write applets like in the demos Cover many of same techniques • Upcoming program Create an applet to display "Welcome to Java!!" Show applet and HTML file, then discuss them line by line U- 5 HTML DOM - Prof. D. P. Mishra
- 67. import java.awt.*; import java.applet.*; publicclass WelcomeApplet extends Applet { public void init() { } public void paint(Graphics g) { g.drawString("Welcome to Java Programming!", 25, 25 ); } } extends allows us to inherit the capabilities of class Applet. Method paint is guaranteed to be called in all applets. Its first line must be defined as above. U- 5 HTML DOM - Prof. D. P. Mishra
- 68. Simple Java Applet:Drawing a String Import predefined classes grouped into packages When you create applets, import Applet class (in the package java.applet) import the Graphics class (package java.awt) to draw graphics Can draw lines, rectangles ovals, strings of characters import specifies directory structure import java.awt.*; // import package with class Graphics import javax.applet.*; // import class Applet U- 5 HTML DOM - Prof. D. P. Mishra
- 69. Simple Java Applet:Drawing a String Class Applet defined for us Someone else defined "what it means to be an applet" Applets require over 200 methods! extends Applet Inherit methods, do not have to declare them all Do not need to know every detail of class Applet public class WelcomeApplet extends Applet { U- 5 HTML DOM - Prof. D. P. Mishra
- 70. Simple Java Applet:Drawing a String Class WelcomeApplet is a blueprint appletviewer or browser creates an object of class WelcomeApplet Keyword public required File can only have one public class public class name must be file name public class WelcomeApplet extends Applet { U- 5 HTML DOM - Prof. D. P. Mishra
- 71. Simple Java Applet:Drawing a String Our class inherits method paint from Applet By default, paint has empty body Override (redefine) paint in our class Methods init, start and paint. Guaranteed to be called automatically Our applet gets "free" version of these by inheriting from Applet Free versions have empty body (do nothing) Every applet does not need all three methods Override the ones you need Applet container “draws itself” by calling method paint public void paint( Graphics g ) U- 5 HTML DOM - Prof. D. P. Mishra
- 72. Simple Java Applet:Drawing a String Method paint Draws graphics on screen void indicates paint returns nothing when finishes task Parenthesis define parameter list - where methods receive data to perform tasks Normally, data passed by programmer, as in JOptionPane.showMessageDialog paint gets parameters automatically Graphics object used by paint Mimic paint's first line public void paint( Graphics g ) U- 5 HTML DOM - Prof. D. P. Mishra
- 73. Simple Java Applet:Drawing a String Body of paint Method drawString (of class Graphics) Called using Graphics object g and dot (.) Method name, then parenthesis with arguments First argument: String to draw Second: x coordinate (in pixels) location Third: y coordinate (in pixels) location Java coordinate system Measured in pixels (picture elements) Upper left is (0,0) g.drawString( "Welcome to Java Programming!", 25, 25 ); U- 5 HTML DOM - Prof. D. P. Mishra
- 74. Simple Java Applet:Drawing a String • Running the applet Compile As you would a regular file in JCreator or javac WelcomeApplet.java (from the command line) If no errors, bytecodes stored in WelcomeApplet.class Create an HTML file Loads the applet into appletviewer or a browser Ends in .htm or .html To execute an applet Create an HTML file indicating which applet the browser (or appletviewer) should load and execute U- 5 HTML DOM - Prof. D. P. Mishra
- 75. Simple Java Applet:Drawing a String Simple HTML file (WelcomeApplet.html) Usually in same directory as .class file Remember, .class file created after compilation HTML codes (tags) Usually come in pairs Begin with < and end with > Lines 1 and 4 - begin and end the HTML tags Line 2 - begins <applet> tag Specifies code to use for applet Specifies width and height of display area in pixels Line 3 - ends <applet> tag <html> <applet code = "WelcomeApplet.class" width = "300" height = "45"> </applet> </html> U- 5 HTML DOM - Prof. D. P. Mishra
- 76. Simple Java Applet:Drawing a String appletviewer only understands <applet> tags Ignores everything else Minimal browser Executing the applet appletviewer WelcomeApplet.html Perform in directory containing .class file <html> <applet code = "WelcomeApplet.class" width = "300" height = "45"> </applet> </html> U- 5 HTML DOM - Prof. D. P. Mishra
- 77. Simple Java Applet:Drawing a String • Running the applet in a Web browser U- 5 HTML DOM - Prof. D. P. Mishra
- 78. CGI – CommonGateway Interface
- 79. Need for CGI •HTML/XHTML is static, it is not parameterized; • Using only HTML/XHTML, CSS and JS one can not write dynamic web pages: pages that look differently • Depending on the user who visit it (client, administrator etc.), pages that display different products depending on what is in a database, pages that should be displayed depending on the value of some parameters. • using only HTML/XHTML, CSS and JS one can not develop distributed web applications (e-commerce sites, hotel booking, web search applications etc.) U- 5 HTML DOM - Prof. D. P. Mishra
- 80. What is CGI? •A standard protocol for interfacing external application software with the web server • Developed in 1993 at NCSA (National Center for Supercomputing Applications) • CGI 1.1 specified in RFC 3875, 2004 • Allows an external executable file to respond to an HTTP Request from the browser • CGI defines how information is passed from the web server to the executable program and how information is passed from this back to the server U- 5 HTML DOM - Prof. D. P. Mishra
- 81. Common Gateway Interface •CGI is a standard mechanism for: Associating URLs with programs that can be run by a web server A protocol (of sorts) for how the request is passed to the external program How the external program sends the response to the client U- 5 HTML DOM - Prof. D. P. Mishra
- 82. Server-side web programming •HTTP Response consists of the output of an external program located on the server machine: browser web server HTTP Request HTTP Response executable file/CGI, php file, jsp file, asp file Server-side Request Response Header + Html file U- 5 HTML DOM - Prof. D. P. Mishra
- 83.
- 84. CGI URLs • Thereis mapping between URLs and CGI programs provided by a web sever The exact mapping is not standardized web server admin can set it up • Typically: requests that start with /CGI-BIN/ , /cgi-bin/ or /cgi/, etc. not to static documents U- 5 HTML DOM - Prof. D. P. Mishra
- 85. HTTP Server -CGI Interaction U- 5 HTML DOM - Prof. D. P. Mishra HTTP SERVER CGI Program stdin stdout Environment Variables
- 86. Drawbacks of CGI •Errors are highly probable, - Since no special web-oriented language is used for writing CGI scripts (e.g. shell, perl, c/c++, python etc.) and so, • Security vulnerabilities due to these problems • Usually a new process is created for each run of a CGI script; this increases the load on the server • CGI scripts are executable file; they can write/delete from the local disk, so this is a security vulnerability U- 5 HTML DOM - Prof. D. P. Mishra
- 87. First CGI example(in shell) #!/bin/bash echo Status: 200 OK echo Content-Type: text/html echo echo echo "<html><head></head>" echo "<body>" echo "Hello world." echo "</body></html>" U- 5 HTML DOM - Prof. D. P. Mishra
- 88. Getting parameters fromthe client/browser • parameters can be passed from the user to the CGI script through an html <form> <form action=“script.cgi” method=“GET | POST”> <input type=“…” name=“input1” /> <input type=“…” name=“input2” /> … <input type=“…” name=“inputN” /> </form> • the script.cgi will get the parameters as: input1=val1&input2=val2& … &inputN=valN U- 5 HTML DOM - Prof. D. P. Mishra
- 89. Getting parameters fromthe client/browser (2) • parameters can be sent through the GET method (in the HTTP Request header) => the CGI script will receive the parameters from the web server in an environment variable $QUERY_STRING • or they can be passed through the POST method (in the body of the HTTP Request) => the CGI script will receive the parameters from the web server in the standard input U- 5 HTML DOM - Prof. D. P. Mishra
- 90. Form example <html> <head></head> <body> <form action="cgi-bin/post_ex.cgi"method="POST"> User: <input type="text" size="20" name="user" /><br /> Password: <input type="text" size="20" name="pass" /><br /> <input type="submit" value="Submit" name="submit" /> </form> </body> </html> U- 5 HTML DOM - Prof. D. P. Mishra
- 91. Getting parameters throughGET #!/bin/bash echo "Content-Type: text/html" echo echo echo "<html><head></head>" echo "<body>" echo "Parameters are:<br />" user=`echo $QUERY_STRING | cut -d"&" -f 1 | cut -d"=" -f 2` pass=`echo $QUERY_STRING | cut -d"&" -f 2 | cut -d"=" -f 2` echo $user $pass echo "</body></html>" U- 5 HTML DOM - Prof. D. P. Mishra
- 92. Getting parameters throughPOST #include <stdio.h> #include <string.h> main() { char line[255], *userline, *passline, *s; char user[20], pass[20]; printf("Content-Type: text/htmlnn"); printf("<html><head></head>"); printf("<body>"); fgets(line, 255, stdin); printf("Parameters are: <br />"); userline = strtok(line, "&"); passline = strtok(0, "&"); user[0] = 0; if (userline) { s = strtok(userline, "="); s = strtok(0, "="); if (s) strcpy(user, s); } pass[0] = 0; if (passline) { s = strtok(passline, "="); s = strtok(0, "="); if (s) strcpy(pass, s); } printf("%s, %s", user, pass); printf("</body>"); printf("</html>"); } U- 5 HTML DOM - Prof. D. P. Mishra
- 93. Beyond ISINDEX -Forms Many Web services require more than a simple ISINDEX HTML includes support for forms: lots of field types entire contents of form must be stuck together and put in QUERY_STRING by the Web server U- 5 HTML DOM - Prof. D. P. Mishra
- 94. Form Fields • Eachfield within form has a name and a value • The browser creates a query that includes a sequence of “name=value” substrings and sticks them together separated by the ‘&’ character • If user types in “Mehmet H.” as the name and “none” for occupation, the query would look like this: “name=Mehmet+H%2E&occupation=none” U- 5 HTML DOM - Prof. D. P. Mishra
- 95. HTML Forms • Eachform includes a METHOD that determines what http method is used to submit the request • Each form includes an ACTION that determines where the request is made U- 5 HTML DOM - Prof. D. P. Mishra
- 96. An HTML Form <FORMMETHOD=GET ACTION=http://foo.com/signup.cgi> Name: <INPUT TYPE=TEXT NAME=name><BR> Occupation: <INPUT TYPE=TEXT NAME=occupation><BR> <INPUT TYPE=SUBMIT> </FORM> U- 5 HTML DOM - Prof. D. P. Mishra
- 97. What a CGIwill get • query (from the environment variable QUERY_STRING) will be a URL-encoded string containing the name,value pairs of all form fields • The CGI must decode the query and separate the individual fields U- 5 HTML DOM - Prof. D. P. Mishra
- 98. HTTP Method: POST •GET method delivers data as part of URI • POST method delivers data as the content of a request <FORM METHOD=POST ACTION=…> • If REQUEST_METHOD is a POST, the query is coming in STDIN • The environment variable CONTENT_LENGTH tells us how much data to read U- 5 HTML DOM - Prof. D. P. Mishra
- 99. Possible Problem char buff[100]; char*clen = getenv(“CONTENT_LENGTH”); if (clen==NULL) /* handle error */ int len = atoi(clen); if (read(0,buff,len)<0) … /* handle error */ pray_for(!hacker); U- 5 HTML DOM - Prof. D. P. Mishra
- 100. GET vs. POST •When using forms it’s generally better to use POST: there are limits on the maximum size of a GET query string environment variable a post query string doesn’t show up in the browser as part of the current URL U- 5 HTML DOM - Prof. D. P. Mishra
- 101. HTML for Forms <HTML> <HEAD><TITLE>cgi-test</TITLE> </HEAD> <BODY> <p> This is a sample page to read two data items from the web page: <form action="cgi-bin/xaction" method=get> <p>First name=<input type=text name=xfirst size=10> <br>Last name=<input type=text name=xlast size=20> <br> <input type=submit value=SEND> <input type=reset value=RESET> </form> </BODY> </HTML> U- 5 HTML DOM - Prof. D. P. Mishra Parameters passed as arguments xfirst and xlast
- 102. Perl - CGIscript #!/usr/bin/perl print “Content-Type: text/htmlnn”; print “<html><head>n”; print “<title>Sample PERL script</title>n”; print “</head><body>n”; print “<p>Query_string is $ENV{'QUERY_STRING'}n”; foreach ( split( /&/, $ENV{'QUERY_STRING'}) ) { ( $key, $val ) = split( /=/, $_, 2 ); $tmp{$key} = $val; } print “<p>First name is <b>$tmp{'xfirst'}</b>n”; print “<p>Last name is <b>$tmp{'xlast'}</b>n”; print “</body></html>n” U- 5 HTML DOM - Prof. D. P. Mishra Perl program reads parameters as xfirst&xlast from $ENV (environment) into QUERY_STRING Output of Perl is the syntax of an HTML page that is displayed
- 103. U- 5 HTML DOM - Prof. D. P. Mishra Questions Appeared inPrevious year University Examination: Nov – Dec 2013 1. What do you mean by JVM? – 2m 2. What is DOM ? – 7M 3. What do you mean by CGI ? - 7M 4. What is java Applet ? Explain the lifecycle of java Applet - 7M Nov – Dec 2014 1. Define Document Object Model – 2m 2. Explain DHTML , Write down advantages of DHTML - 7M 3. Write a Short note on • Perl & • CGI Script – 7M 4. Explain Applet lifecycle with example - 7M April-May 2014 1. How is session tracking achieved by url rewriting ? – 2m 2. Explain in details DOM Event handling - 7M 3. Explain the environment variable in CGI & also debugging the CGI program- 7M 4. Describe the lifecycle of applet with Syntax - 7M
- 104. U- 5 HTML DOM - Prof. D. P. Mishra Questions Appeared inPrevious year University Examination … Nov – Dec 2015 1. What is byte code ? – 2m 2. Describe life cycle of an Applet - 7M 3. Describe the types of operations used in math – 7M 4. Write a short note on (i) HTML DOM & (ii) CGI - 7M Nov – Dec 2016 1. What do you mean by DOM ? – 2m 2. Write a short note on (i) CGI & (ii) PERL - 7M 3. Explain the lifecycle of an Applet – 7M 4. Write is java Discuss its characteristics and working - 7M Nov – Dec 2017 1. Write the name of the DHTML Components ? – 2m 2. What do you understand by DOM ? Explain the level of W3C DOM Specifications. - 7M 3. Write a shot note on i. CGI ii. Perl – 7M 4. Explain the use of Java Applet. What are the stages of lifecycle of Java Applet ? - 7M
- 105. U- 5 HTML DOM - Prof. D. P. Mishra Questions Appeared inPrevious year University Examination … Nov – Dec 2018 1. What is DOM ? – 2m 2. What are the advantages of Java Applet? Describe the advantages of Java Applet. - 7M 3. What is CGI ? Create simple CGI program using PERL. – 7M 4. How to run an Applet ? Give an Example. - 7M