WebSockets - HTML5 and JavaScript Web Apps - page 102

Using the new and shiny
As of this writing, JBoss has just begun to implement WebSockets natively on JBoss AS7.
The same example from above has been converted for native WebSocket support
(without embedding Jetty) on JBoss AS 7.1.2 and beyond. This gives you the benefit of
having both HTTP and WS traffic over the same port without needing to worry about
managing data across threads. To see a chat room example that uses native WebSocket,
check out https://github.com/html5e/HTML5-Mobile-WebSocket . You can find the JBoss
WebSocket source at https://github.com/mikebrock/jboss-websockets .
Binary Data Over WebSockets
Another cool use of WebSockets is the ability to use binary data instead of just JSON
strings. For example:
objWebSocket . onopen = function ( evt )
{
var array = new Float32Array ( 5 );
for ( var i = 0 ; i < array . length ; ++ i ) array [ i ] = i / 2 ;
ws . send ( array , { binary : true });
};
Why send binary data? This allows you to stream audio to connected clients using the
Web Audio API. Or you could give users the ability to collaborate with a real-time screen
sharing application using canvas and avoid the need to base64-encode the images. The
possibilities are limitless!
The following code sets up a Node.js server to demo an example of sending audio over
a WebSocket connection. See https://github.com/einaros/ws-audio-example for the full
example.
var express = require ( 'express' );
var WebSocketServer = require ( 'ws' ). Server ;
var app = express . createServer ();
function getSoundBuffer ( samples ) {
var header = new Buffer ([
0x52 , 0x49 , 0x46 , 0x46 , // "RIFF"
0 , 0 , 0 , 0 , // put total size here
0x57 , 0x41 , 0x56 , 0x45 , // "WAVE"
0x66 , 0x6d , 0x74 , 0x20 , // "fmt "
16 , 0 , 0 , 0 , // size of the following
1 , 0 , // PCM format
1 , 0 , // Mono: 1 channel
0x44 , 0xAC , 0 , 0 , // 44,100 samples per second
0x88 , 0x58 , 0x01 , 0 , // byte rate: two bytes per sample
2 , 0 , // aligned on every two bytes
16 , 0 , // 16 bits per sample
0x64 , 0x61 , 0x74 , 0x61 , // "data"
0 , 0 , 0 , 0 // put number of samples here
]);