Friday, February 27th, 2009
jsSO: Flash Shared Objects in Javascript
<p>Daniel Prieler has created a new library that allows realtime communication in JavaScript between clients. It works by embedding Flash in the page which is connected to a rtmp-flash-server.JSSO works like this:
The data-transfer and the connection to the server are maintained by a simple embedded Flashmovie in your page. The communication with other clients runs through the local Flashmovie and the Red5-Server.
The data-flow between two clients looks like this:Javascript/jsSO - Flashmovie - Red5-Server - Flashmovie - Javascript/jsSO
-
-
// Connect to to a shared object Handler (SOSample) on the Red5-Server and
-
// use the objectName "draw". The objectName is identical to a namespace
-
// for your data or a chat-room.
-
// SOSample is the simplest shared object example of the Red5-server
-
jsSO.connect('draw', 'rtmp://localhost/SOSample');
-
-
// On button click set someVar in the shared object
-
$(':button').live('click', function(){
-
jsSO.set('someVar', 'value');
-
});
-
-
// Listen to changes on the shared object
-
// event = A jquery event object
-
// updates = If a var is updated it is set in the updates-object.
-
// See code below for usage
-
// data = All data in the object
-
jsSO.onSync(function(event, updates, data) {
-
if (updates.someVar) {
-
// someVar was updated
-
console.log(data.someVar);
-
}
-
});
-
Related Content:











I wonder is the flash even needed there? why not just use Ajax to send messages directly to the server skipping the flash bit altogether?
and use a comet-like connection if you want live updates
RTMP is a much better protocol for low-latency message passing than long-polling HTTP.
Cool stuff, Does it contain fallbacks in case flashplugin is not present?
@kae: as millenomi already said, rtmp is really fast for low-tanency connections. with a local installation or even a installation on a remote webserver i have no lag e.g. when moving the mouse in the “draw example”.
@bengerrissen: thanks for the idea, i added it to the future improvements on my page.
Wow, this is going really fast ! Iwonder if it scales well…
Is IE support planned ?
A game like xsketch might be a good test case for this.
http://xsketch.com/
Ummm, a Flash Shared Object does not have anything to do with server communication. A shared object in flash is essentially a cookie. Name Fail!
Before the flame war begins, I was being sarcastic with the Name Fail comment. I know you are talking about server side shared objects. Using Flash to communicate with other servers via javascript isn’t anything new. Lots of sites use this approach over Ajax because of Flash’s cross domain policies. Ajax is far more strict and locked down when communicating cross domain, Flash has options.
Another novel use of Red5, I love it.. nice work!
Daniel Prieler, thank you this is really great. I am trying to get this working on my computer but don’t have a clue how to go about this as I have never done any Flash work before. So far I have installed Red5 server. Would you be able to provide details as to what files to copy onto the Red5 server to get this to work?
Ok I think I have worked it out so far. There are no files required to install on the Red5 as it uses the SoSample object that comes with the server. Now for my chat application, all I need to do is figure out how to talk to the Red5 server from PHP, which I also dont have a clue.
@ywg: i tested jsSO in firefox and ie6+7 and haven’t noticed any problems.
@samtoocan: yep, you only have to install red5 to start using jsSO, the SOSample is preinstalled in red5 :)
my next step for jsSO will be to implement a function to “call” server side logic on the red5 server.
then you are able to talk to your php-scripts by using a custom java-function with some database queries etc.
i also got asked how to implement a session for only 2 users (e.g. a 2 player game): the easiest way i could come up with is to created some random (or md5) id, which only those 2 players “know” and use this id in the conect method: jsSO.connect(‘game:’+random, …). it would also be nice to modify the red5-SOSample to only allow 2 connections for each sharedObject-name. but i’m not into the red5-java-codebase yet.
@GregHouston > Shared Object could be Remote or Local. You are telling about local SO. Here, JsSO is used to get Remote SO.
This Library is really usefull but in fact very simple… it only call a swfObject on page wich does communications. You could create your own as I did since several months.