Home arrow JavaScript arrow Page 3 - Programmatic POST Requests with JavaScript: Automated Form Submissions
JAVASCRIPT

Programmatic POST Requests with JavaScript: Automated Form Submissions


In the first part of this article series, Alejandro Gervasio explained how the XMLHttpRequest object and be used to generate massive GET requests to a targeted server, in order to launch denial of service attacks. In this article, he shows how http POST requests, commonly used on Web forms to collect user data, can be automated, again leaving your system vulnerable to attack. With the information you learn from this series, you should be able to build more robust and safer Web applications, making your system less of a target.

Author Info:
By: Alejandro Gervasio
Rating: 5 stars5 stars5 stars5 stars5 stars / 42
July 20, 2005
TABLE OF CONTENTS:
  1. · Programmatic POST Requests with JavaScript: Automated Form Submissions
  2. · Automated POST requests: the basics of a JavaScript-based form emulator
  3. · Building the form emulator: defining the core functions “getXMLHTTPObject()” and “sendRequest()”
  4. · Tracking the request’s status: defining the “displayStatus()” function

print this article
SEARCH DEVARTICLES

Programmatic POST Requests with JavaScript: Automated Form Submissions - Building the form emulator: defining the core functions “getXMLHTTPObject()” and “sendRequest()”
(Page 3 of 4 )

To get started writing the form emulator, I’ll begin by defining the source code for the first functions, in conjunction with the proper explanation on the operations assigned within the JavaScript program. In first place, here is the definition for the “getXMLHTTPObject()” function:

// function getXMLHTTPObject

function getXMLHTTPObject(){

    //instantiate new XMLHttpRequest object

    var objhttp=(window.XMLHttpRequest)?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP');

    if(!objhttp){return};

    // assign event handler

    objhttp.onreadystatechange=displayStatus;

    // return XMLHttpRequest object

    return objhttp;

}

As I said before, this function should be already familiar, because it was defined in the first part of the series. Essentially, what it does is to return a new instance of the XMLHttpRequest object each time it’s invoked, in this way encapsulating the code responsible for object instantiation. If you have some knowledge about design patterns, then it should be clear that the factory pattern is basically applied here. By using this function, I’m decoupling the process to create objects from the rest of the program code.

The next function to be defined is “sendRequest()”, which acts as the workhorse of the program, since it makes all of the http requests. The structure of this function is essentially the same of that reviewed on my previous article, so shouldn’t be hard to understand. The only change that I’ve introduced within its code is the value assigned to the default http header. Due the fact that the script is aimed to emulate post forms, the http header specified is the following:

'Content-Type:application/x-www-form-urlencoded; charset=UTF-8'

The above header is the default value assigned on (X)HTML documents that implement regular forms. As long as a web server receives this header, it assumes that the request is coming from a web form. If the request method is set to POST, then the data is sent apart from the requested URL. Otherwise, if a GET method is used, the form data (name/value pairs) is appended to the URL as part of the query string.

I suppose all of these concepts are closely familiar to you, thus having briefly explained the meaning of this header within the context of the HTTP protocol, here is code for the ” sendRequest()” function:

// function sendRequest

function sendRequest(url,data,method,mode,header){

    // set default values

    if(!url){url='default_url.htm'};

    if(!data){data='defaultdata=defaultvalue'};

    if(!method){method='post'};

    if(!mode){mode=true};

    if(!header){header='Content-Type:application/x-www-form-urlencoded; charset=UTF-8'};

    // get XMLHttpRequest object

    objhttp=getXMLHTTPObject();

    // open socket connection

    objhttp.open(method,url,mode);

    // set http header

    objhttp.setRequestHeader(header.split(':')[0],header.split(':')[1]);

    // send data

    objhttp.send(data);

}

The only points worthy of mention on the above function are the default values assigned to the “Content-Type” http header, as well as the request mode. Essentially, the first request will be made in synchronous mode, because the program needs to get a response from the server, and then the subsequent ones will be performed asynchronously.

The next thing to do is reviewing another relevant function within the form emulator program. Let’s have a look at the “displayStatus()” function, which shows descriptive information about the http request’s progress. Its definition is only a few lines away.


blog comments powered by Disqus
JAVASCRIPT ARTICLES

- Project Nashorn to Make Java, JavaScript Wor...
- JavaScript Virus Attacks Tumblr Blogs
- Google Releases Stable Dart Version, JavaScr...
- Khan Academy Unveils New JavaScript Learning...
- Accessing Nitro? There`s an App for That
- JQuery 2.0 Leaving Older IE Versions Behind
- Fastest JavaScript Engine Might Surprise You
- Microsoft Adjusting Chakra for IE 10
- Brendan Eich: We Don`t Need Google Native Cl...
- An Overview of JavaScript Statements
- An Overview of JavaScript Operators
- Overview of JavaScript Variables
- More of the Top jQuery Social Plugins
- The Top jQuery Social Plugins
- More of the Top jQuery Slider Plugins

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 

Developer Shed Affiliates

 




© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials