Section 9.5. Plain-Text Message

9.5. Plain-Text Message

Acknowlegement, Custom, PlainText, Semantic, String

Figure 9-6. Plain-Text Message

9.5.1. Developer Story

Devi's working on an auto-completion form field. Every few seconds, the server needs to respond with a list of suggestions. Devi codes the server side to output the suggestions as a comma-separated list, as it's convenient to output on the server and easy to parse in the browser.

9.5.2. Problem

How can you transfer data between server and browser?

9.5.3. Forces

• Ajax Apps require messages to be transmitted back and forth.

• Both browser and the server must be able to access the message. That usually means the format must be easily accessed in JavaScript as well as in whichever server-side language is used.

9.5.4. Solution

Pass simple messages between server and browser in plain-text format. This is a broad pattern, because "plain-text" is an ambiguous term. The emphasis here is on keeping things simpleXML or JSON are often more appropriate for complex data structures, but can also add unnecessary complexity.

Despite the name, XMLHttpRequest is perfectly capable of working with plain-text responses. As discussed in XMLHttpRequest Call (Chapter 6) and XML Message (later), the browser script can decide how to interpret the response in XMLHttpRequest by switching between the responseText and responseXML properties.

Plain-text formats include:

Response Code

Sometimes, all that's required is a simple response code, such as a numeric ID or a text message such as "OK" or "Failed." Note that, in this case, an appropriate HTTP Response Code codes may be more standards-based and in line with RESTful Service conventions.

A simple text string

For example, a user's name.

A list

For example, a comma-separated list of search results.

A custom data format

For example, a list of strings, where each string is a comma-separated list of object attributes.

While browser support for XML is reasonably good, especially with third-party libraries, it's also quite easy to manipulate arbitrary text formats. JavaScript provides a standard string manipulation library, including the particularly helpful regular expression and grouping facilities.

The case for plain-text is particularly compelling in the following situations:

Simpler messages

The simpler the message, the more compelling the argument for plain-text messages. Once the string starts to get more complex, there's a better argument for relying on XML support from the browser and third-party libraries.

External clients

XML is often a better choice when it's not just the web app that's using the service. That's partly for reasons of conventionXML is simply a standard transfer format on the Internet. But there's also a more technical reason: using DTDs or XML Schemas, you can specify the format in an unambiguous manner that can be enforced whenever a document is encountered.

Skill base

XML may be a standard, but that's useful only if people know the standard. The better developers are with XML technologies in both the browser and the server, the more compelling the argument for XML.

9.5.5. Real-World Examples

9.5.5.1. Lace Chat

Brett Stimmerman's Lace Chat (http://www.socket7.net/lace/) is an Ajax chat app (Figure 9-7). When the page is initially shown, all user messages are downloaded as a single, long string. Within the string, each user message is captured as a set of attributes, separated by pipe characters:

   1135646360:749||||date-1135646204||*Monday, 26 December   2005||||hour-17||*17:00||||1135646204||Posted about 3 minutes ago at   17:16||Aj Two||Yeah you can *SO* chat in real time||||1135646212||Posted   about 2 minutes, 52 seconds ago at 17:16||*Lace||AJ One   has joined the conversation||||1135646212|| 

Figure 9-7. Lace Chat

9.5.5.2. Magnetic Poetry

In Magnetic Poetry (http://www.broken-notebook.com/magnetic/), you drag tiles around a workspace. When the browser receives an updated position, the message looks like a structured command statement:

   Update magnetic_poetry set top_value=291, left_value=119 WHERE id=81 

9.5.5.3. HousingMaps

HousingMaps (http://housingmaps.com) is a mashup between Google Maps and Craigslist (http://craigslist.com), a community-oriented classified advertising web site. The HousingMaps portion is downloaded with an XMLHttpRequest Call that retrieves the 15 or so results matching a query. Each result represents a single home and is broken into a sequence of attributes, one line at a time, and prefixed with an identifier:

   PA:34.0917   PN:-118.28   IC:p   DS:One Bath With Small Loft Duplex Near Sunset Junction   AD:Hyperion Ave &&& Sunset Blvd</line><line> Los Angeles</line><line>CA   ...   I4:a.im.craigslist.org/rR/iv/X1dT18TzV07cfjuQzouhKQ5EETuK.jpg   LC:1071999   PA:34.0763   PN:-118.294   IC:p   DS:1930&&#39;s Restored Spanish Beauty- 1St Month Free   AD:Berendo &&& Beverly</line><line> Los Angeles</line><line>CA   ...   I4:a.im.craigslist.org/n0/Xm/SS3hSoIWLOsc8wOjaiLGQK5HFbzl.jpg   LC:1072004   ... 

9.5.6. Code Example: Lace Chat

The response in Lace Chat is a list of attributes, separated by pipe characters. Each complete record is separated by ||||, and each attribute within a record is separated by a smaller string, ||. The handling code first splits the string into an array of records, then splits out the attributes within each record:

   // Records are separated by four pipes ||||   var results = this.httpGetObj.responseText.split('||||');   ...   for (var i = 1; i < results.length; i++) {     var first;     // Fields are separated by two pipes ||     var fields = results[i].split('||');     ...     var timeStr = fields[1];     var textStr = fields[3];     ...     p.setAttribute('id', 'msg_' + fields[0]);     ...   } 

9.5.7. Alternatives

9.5.7.1. XML Message

As discussed in the "Solution," an XML Message may be a better alternative for more complex data.