We have already looked at using FMS to broadcast live media (video) but how about broadcasting simple messages back and forth.
Fortunately, it is relatively easy with FMS to do that with:
Flash and FMS have a capability which is called a SharedObject. SharedObject allows us to have a Flash object which can be used to transmit data back and forth from client to server to all of the clients. In effect it is shared between all of the clients.
Flash Media Server Developer Documentation: About Shared Objects
Shared Objects can be local (like a browser cookie) or remote (on the server shared amongst different people), they can also be persistent (saved to disk) or non-persistent (deleted when the last client disconnects).
Here is a very very basic example of a non-persistent remote shared object:
package
{
// Class so we can display and/or be used in the Flash IDE
import flash.display.Sprite;
// Class that allows a Shared Object to exist on FMS
import flash.net.SharedObject;
// So we can get Status from the NetConnection (callback)
import flash.events.NetStatusEvent;
// So we can get events from the SharedObject (callback)
import flash.events.SyncEvent;
// So we can connect to FMS
import flash.net.NetConnection;
// Import TextField to show what to send/recieve
import flash.text.TextField;
import flash.text.TextFieldType;
// Import TextEvent so we know when something happens in TextField
import flash.events.TextEvent;
public class SimpleSO extends Sprite
{
// Declare a SharedObject object
private var sharedObject:SharedObject;
// Declare a NetConnection Object
private var netConnection:NetConnection;
// Declare a TextField
private var textField:TextField;
// Constructor
public function SimpleSO()
{
trace("starting");
// String with URL to app on FMS
var rtmpURL:String = "rtmp://itp-flash.es.its.nyu.edu/sve204/SimpleSO";
// Instantiate NetConnection
netConnection = new NetConnection();
// Event listener, calls netStatusCallBack when a NetStatusEvent is fired
netConnection.addEventListener(NetStatusEvent.NET_STATUS,netStatusCallBack);
// Connect to the application on the server
netConnection.connect(rtmpURL);
// Create the textField
textField = new TextField();
// Add event listener
textField.addEventListener(TextEvent.TEXT_INPUT, textEventCallBack);
// Make the textField an input field
textField.type = TextFieldType.INPUT;
// Set it's position and dimensions
textField.x = 10;
textField.y = 10;
textField.width = 100;
textField.height = 40;
// Set it's starting text
textField.text = "hi";
// Add it to the display
addChild(textField);
}
// NetStatusEvent Callback
private function netStatusCallBack(nsEvent:NetStatusEvent):void
{
// If we connected successfully
if (nsEvent.info.code == "NetConnection.Connect.Success")
{
// Set up the shared object
// We'll call it SimpleSO, pass in the app url and not make it persistent
sharedObject = SharedObject.getRemote("SimpleSO",netConnection.uri,false);
// Add a listener for when shared object is changed
sharedObject.addEventListener (SyncEvent.SYNC,syncEventCallBack);
// Connect the shared object to our netConnection
sharedObject.connect(netConnection);
}
else
{
// Didn't connect
trace("Sorry connection failed");
}
}
private function syncEventCallBack(syncEvent:SyncEvent):void
{
// Array of changes: syncEvent.changeList[]
for (var i:int = 0; i < syncEvent.changeList.length; i++)
{
trace(syncEvent.changeList[i].code);
switch(syncEvent.changeList[i].code)
{
case "clear":
break;
case "success":
break;
case "change":
// get the new data
var newData:String = sharedObject.data.theData;
trace("recieved " + newData);
// Update TextField
textField.text = sharedObject.data.theData;
break;
}
}
}
private function textEventCallBack(textEvent:TextEvent):void
{
trace(textEvent.text);
// If the text == a space
if (textEvent.text == " ")
{
// send it
sendData(textField.text);
}
}
// send the data
private function sendData(dataToSend:String):void
{
sharedObject.setProperty("theData",dataToSend);
}
}
}
You can download the code: SimpleSO.as or Try it: SimpleSO.swf
A SharedObject combined with Live Streaming for sharing screenshots example
Here is a simple white board example that uses shared objects but uses the send method instead: WhiteBoardSO.as or try it: WhiteBoardSO.swf
What about doing the same thing in AJAX using the newish HTML 5 canvas tag: Try it, Download It