Section 20.4. Scripting HTTP with script Tags

20.4. Scripting HTTP with <script> Tags

In Internet Explorer 5 and 6, the XMLHttpRequest object is an ActiveX object. Users sometimes disable all ActiveX scripting in Internet Explorer for security reasons, and in this case, scripts are unable to create an XMLHttpRequest object. If necessary, it is possible to issue basic HTTP GET requests using <script> and <iframe> tags. While it is not possible to reimplement all the functionality of XMLHttpRequest in this way,^[*] you can at least create a version of the HTTP.getText() utility function that works without ActiveX scripting.

^[*] A complete substitute for XMLHttpRequest probably requires using a Java applet.

It is relatively easy to generate HTTP requests by setting the src property of a <script> or <iframe> tag. What is more tricky is extracting the data you want from those elements without having that data modified by the browser. An <iframe> tag expects an HTML document to be loaded into it. If you try to download the content of a plain-text file into an iframe, you'll find that your text gets converted to HTML. Furthermore, some versions of Internet Explorer do not properly implement an onload or onreadystatechange handler for <iframe> tags, which makes the job harder.

The approach taken here uses a <script> tag and a server-side script. You tell the server-side script the URL whose content you want and what client-side function that content should be passed to. The server-side script gets the contents of the desired URL, encodes it as a (possibly quite long) JavaScript string, and returns a client-side script that passes that string to the function you specify. Since this client-side script is being loaded into a <script> tag, the specified function is automatically invoked on the URL contents when the download completes.

Example 20-9 is an implementation of a suitable server-side script in the PHP scripting language.

Example 20-9. jsquoter.php

 <?php // Tell the browser that we're sending a script header("Content-Type: text/javascript"); // Get arguments from the URL $func = $_GET["func"];       // The function to invoke in our js code $filename = $_GET["url"];    // The file or URL to pass to the func $lines = file($filename);    // Get the lines of the file $text = implode("", $lines); // Concatenate into a string // Escape quotes and newlines $escaped = str_replace(array("'", "\"", "\n", "\r"),                        array("\\'", "\\\"", "\\n", "\\r"),                        $text); // Output everything as a single JavaScript function call echo "$func('$escaped');" ?> 

The client-side function in Example 20-10 uses the jsquoter.php server-side script of Example 20-9 and works like the HTTP.getText() function shown in Example 20-2.

Example 20-10. The HTTP.getTextWithScript() utility

 HTTP.getTextWithScript = function(url, callback) {     // Create a new script element and add it to the document.     var script = document.createElement("script");     document.body.appendChild(script);     // Get a unique function name.     var funcname = "func" + HTTP.getTextWithScript.counter++;     // Define a function with that name, using this function as a     // convenient namespace. The script generated on the server     // invokes this function.     HTTP.getTextWithScript[funcname] = function(text) {         // Pass the text to the callback function         callback(text);         // Clean up the script tag and the generated function.         document.body.removeChild(script);         delete HTTP.getTextWithScript[funcname];     }     // Encode the URL we want to fetch and the name of the function     // as arguments to the jsquoter.php server-side script. Set the src     // property of the script tag to fetch the URL.     script.src = "jsquoter.php" +                  "?url=" + encodeURIComponent(url) + "&func=" +                  encodeURIComponent("HTTP.getTextWithScript." + funcname); } // We use this to generate unique function callback names in case there // is more than one request pending at a time. HTTP.getTextWithScript.counter = 0;