A simple way to transfer XML documents onto a server is to use an Ajax-driven Web interface to upload the files. However, this approach won't work for huge XML files because Ajax doesn't support uploading of files that large. In this article you will learn an innovative solution for transferring huge XML documents on the server via a Web interface using Ajax and the GET method. The solution works like this:
  1. Transform the XML documents into a character string.
  2. Split the character string into equal chunks (400 characters).
  3. Save each chunk as a value in an array.
  4. Transfer the chunks one by one using the Ajax mechanism into the final XML document (test.xml).
The remainder of the article provides step-by-step instructions for building an application for this solution.

The Functions That Run the Application

First, a JavaScript function gets a string as an argument and deletes white spaces from the beginning and the end of that string. This function is equivalent to the trim() function from PHP:
  function trim(s)
        {
        var trimmed = s.replace(/^\s+|\s+$/g, '') ;
        return trimmed; 
        }
A second JavaScript function, collapseWhiteSpaces, collapses white spaces generated by the Enter or Tab keys:
function collapseWhiteSpaces(allstr)
 {
 var whtSpMult = new RegExp("\\s\\s+", "g");
 var strWithoutMultipleSpaces = allstr.replace(whtSpMult, " "); 
 return strWithoutMultipleSpaces;
 }
The next function, clientRequests, is the main function. It does nearly all the work behind the application as follows:
  1. Gets the reference of the textarea HTML element (<textarea id="xml" rows="10" cols="50">) using its ID from the Web interface
  2. Declares the chunks array, which will be storing the transformed XML document
  3. Sets the final XML document name that will contain all the chunks which will rebuild the XML document from the interface
  4. Prepares the document for the transfer by replacing the "<" and ">" characters with the &lt and &gt entities and deleting the white spaces generated by the Enter or Tab keys
  5. Splits the XML documents into equal 400-character substrings (400 is an optional value; you can choose any value you want) and builds the chunks array
  6. Stores the calls of the saveChunks() function, which contains the Ajax mechanism implementation and is described after the clientRequests function body
See Listing 1 for the complete code of the clientRequests function.
The saveChunks() function builds the URL of the server script (in this case 2.php) as well as the following parameters:
  • XMLchunck -- the current chunk, which is sent through the URL
  • chunkNr -- the total number of chunks
  • chuncks -- the current chunk number
  • XMLName -- the XML document name (in this case test.xml)
The saveChunks() function then opens a connection to the server using a GET request and calls the callback function to check the progress of requests, identify the result of the request and handle data returned from the server. See Listing 2 for the complete code of the saveChunks() function.
The final function is callback(), which is the Ajax callback function. It is responsible for checking the progress of requests, identifying the result of the request and handling data returned from the server. See Listing 3 for the complete code of the callback() function.
Listing 4 shows all the code for the complete application, which puts all the above functions together.
The second page involved in this application's Ajax mechanism opens the test.xml file, writes each chunk one by one as they comes from the 1.php application using the $_GET['XMLchunck'] parameter, and lists a progress percentage using $_GET['chunkNr'] and $_GET['chuncks'] parameters into this simple formula (int)(( $_GET['chunkNr'] *100)/ $_GET['chuncks']). See Listing 5 for the complete code for the second page of the Ajax mechanism.

The Application Output

The output of this application is listed below, also in the step by step manner.



Click here for larger image
Figure 1. The Web interface of the Application Transferring and Monitoring Huge XML Documents



Click here for larger image
Figure 2. The Web Interface of the Application After Inserting a Huge XML



Click here for larger image
Figure 3. The Transfer of the Huge XML Document in Progress



Click here for larger image
Figure 4. The Transfer Completed Successfully



Click here for larger image
Figure 5. The Generated XML Document, test.xml



Click here for larger image
Figure 6. The Content of the Generated XML Document, test.xml, as Seen from the Web Interface of the Application

Conclusion

In this article you have learned how to transfer huge XML documents via a Web interface using Ajax and the GET method by splitting the XML document into equal pieces and then rebuilding it into a specific file.

About the Author

Octavia Andreea Anghel is a senior PHP developer currently working as a primary trainer for programming teams that participate at national and international software-development contests. She consults on developing educational projects at a national level. She is a coauthor of the book "XML Technologies: XML in Java" (Albastra, ISBN 978-973-650-210-1), for which she wrote the XML portions. In addition to PHP and XML, she's interested in software architecture, web services, UML, and high-performance unit tests. to e-mail her.