CHAPTER 6  USING THE COMMUNICATION APIS

<p>

<b>Status: </b> <span id="progress">ready</span>

</p>

The Application in Action

To see this example in action, there are two prerequisites: the pages have to be served up from different domains, and the target page has to be served up by a web server that understands CORS headers. A CORS-compliant Python script that can handle incoming cross-origin XMLHttpRequests is included in the example code for this chapter. You can run the demo on your local machine by performing the following steps:

1.Update your hosts file (C:\Windows\system32\drivers\etc\hosts on Windows or /etc/hosts on Unix/Linux) by adding two entries pointing to your localhost (IP address 127.0.0.1) as shown in the following example:

127.0.0.1 geodata.example.net

127.0.0.1 portal.example.com

Note You must restart your browser after modifying the host file to ensure the DNS entries take effect.

2.Install Python 2, which includes the lightweight SimpleHTTPServer web server, if you did not do so for the previous example.

3.Navigate to the directory that contains the example file (crossOrignUpload.html) and the Python CORS server script (CORSServer.py).

4.Start Python in this directory as follows: python CORSServer.py 9999

5.Open a browser and navigate to http://portal.example.com:9999/crossOriginUpload.html. You should now see the page shown in Figure 6-6.

Practical Extras

Sometimes there are techniques that don’t fit into our regular examples, but that nonetheless apply to many types of HTML5 applications. We present to you some short, but common, practical extras here.

Structured Data

Early versions of postMessage only supported strings. Later revisions allowed other types of data including JavaScript objects, canvas imageData, and files. Support for different object types will vary by browser as the specification develops.

155