FlashP2P

My coworker Asa wrote an excellent article detailing where and how you can tighten the security in your FMS installation.

You can read the article here:
http://www.adobe.com/devnet/flashmediaserver/articles/hardening_guide.html?devcon=f2

I’ve posted an example of creating a User List to the Adobe Flash Media Cookbook.
Click to visit the recipe directly.

Difficulty: Novice
Required Player: Flash Player 10.1
Required Server: Stratus
Required Tools: Flash CS5 or Flex 3 or Flash Builder 4

In an effort to make it easier to understand RTMFP groups (NetGroup) features, I have created the “Hello World” of posting applications.  This is about as simple as it gets to build an entry level app that uses NetGroup.post()!

There are some things you should know about RTMFP Posting:
- Posts should be unique, otherwise if you send a new post that is identical to the previous one, the NetGroup may mistake it for the previous one and not retransmit it.  Using a sequence number ensures that they are unique.
- Posts are ephemeral, if you send a post that is too large in size, it might time out while it tries to send to others in the group.
- Posting is designed for applications that require many to many sending information to a networked group.

This example is a very basic chat app.

Directions:

In Flash  CS5 or Flash Builder 4 or Flex 3 (with appropriate SDK for publishing to Flash 10.1) create a new project or AS3 file if you’re in Flash.  In the design view, drag a Text Input and Button onto the stage from the components list.  Assign their id or instance names to “nameInput” and “connectButton” respectively.  Also change the label of the Button to “Connect”.
Now drag a TextArea onto the stage under the TextInput and Button.  Give this TextArea an id or instance name of “chatLog”.
Under the TextArea, drag another TextInput and another Button onto the stage and name these “chatInput” and “chatButton” respectively.  Change the label of this Button to “Send”.

When you’re finished, it should look something like this:

Now that you have the UI in place, you will need to add the ActionScript.  This example was built to work with Stratus.  If you do not have a Stratus developer key, you can sign up for one at http://labs.adobe.com/technologies/stratus/ under the “Getting Started” section.

Once you have your Stratus Developer key, you can copy and paste the following code below into your project.  If you are using Flex or Flash Builder, you will need to switch to “Source” view and paste the following code inside of a mx:Script or fx:Script tag.
If you are using Flash CS5, you will need to select the first frame of the timeline and select the menu “Window > Actions” to bring up the ActionScript panel.  Once you have the ActionScript panel up, you can paste this code.

// variables for the NetConnection, NetGroup, and GroupSpecifier
var nc:NetConnection;
var ng:NetGroup;
var gs:GroupSpecifier;
 
var userName:String;
 
// increment this every time we send a new post
// ensures they are unique
// otherwise they might not transmit if identical to previous post msg
var messageSequenceNumber:uint = 0;
 
// Stratus URI and developer key
const STRATUS_URI:String = "rtmfp://stratus.rtmfp.net/";
const DEVELOPER_KEY:String = "Your_Stratus_Developer_Key_Goes_Here";
 
// creation complete funtion
function onCreation():void {
 
	// hide the chat button until connected
	chatButton.visible = false;
 
	// event listeners for the buttons
	chatButton.addEventListener(MouseEvent.CLICK, postText);
	connectButton.addEventListener(MouseEvent.CLICK, connect);
 
	trace("Flash Player Version: " + Capabilities.version);
}
 
// connect button handler
function connect(me:MouseEvent = null):void {
	userName = nameInput.text;
 
	// make a new NetConnection and connect
	nc = new NetConnection();
	nc.addEventListener(NetStatusEvent.NET_STATUS, rtmfpHandler);
	nc.connect(STRATUS_URI + DEVELOPER_KEY);
 
	trace("RTMFP Connect");
}
 
// net status handler for the NetConnection
function rtmfpHandler(evt:NetStatusEvent):void {
 
	trace("Net Status Code: " + evt.info.code);
 
	switch(evt.info.code) {
		case "NetConnection.Connect.Success":
 
			chatLog.text = " %%% Connected %%% \n";
			// form the NetGroup
			formNetGroup();
 
			break;
		case "NetGroup.Connect.Success":
 
			// user allowed P2P communication
			chatButton.visible = true;
 
			break;
 
		case "NetGroup.Posting.Notify":
 
			// append the text messages received
			appendChatLog(evt.info.message);
			break;
	}
}
 
// form the NetGroup
function formNetGroup():void {
	// create a new Group Specifier
	// this enables options in the group
	gs = new GroupSpecifier("com.example.posting");
	// required for posting
	gs.postingEnabled = true;
	// lets server introduce you to new neighbors
	gs.serverChannelEnabled = true;
	// allows you to discover neighbors on the same LAN
	gs.ipMulticastMemberUpdatesEnabled = true;
 
	trace("GroupSpec: " + gs);
 
	ng = new NetGroup(nc, gs.toString());
	ng.addEventListener(NetStatusEvent.NET_STATUS, rtmfpHandler);
 
	// wait for NetGroup.Connect.Success before moving foward 
	// in case user declines
}
 
// appends text to the chat window
function appendChatLog(msg:Object):void {
	chatLog.text += msg.text + "\n";
}
 
// posts the text to the group
function postText(me:MouseEvent = null):void {
 
	// prevent empty strings from being sent
	if(chatInput.text == "" || !nc.connected)
		return;
 
	// create a new post object of type text
	var msg:Object = new Object();
	msg.seq = messageSequenceNumber++;
	msg.senderID = nc.nearID;
	msg.text = "\<" + userName + "\> " + chatInput.text;
 
	// send the post to the group
	ng.post(msg);
 
	appendChatLog(msg);
 
	chatInput.text = "";
}

After you’ve posted the script, change the value for DEVELOPER_KEY to your Stratus developer key.
If you’re using Flex or Flash Builder, you will need to add an event to the <Application> tag like so: creationComplete=”onCreation()”
If you’re using Flash CS5 then press enter a couple times at the bottom of the script and add the following line:  onCreation();
This will ensure the necessary click events are assigned to the buttons.

Lastly, if you are using Flex or Flash Builder, you will need to go to the properties for the project, under the Flex Compiler options and set the Target Version of the Flash Player to 10.1.  Otherwise it will attempt to publish for an older Flash Player.

Once you have done this.  Save your files.  If you are in Flex or Flash Builder, select the menu Run > Debug (project name) or if you are in Flash CS5 select the menu Control > Test Move > Test.

Enter a user name in the user name field and click “Connect”.  If it successfully connects, you will get an authorization dialog asking you to Allow Peer Connections.  Select Allow.

Copy the URL (if you’re using Flex or Flash Builder) and open a new browser tab.  Paste that URL and follow the same instructions.  It should also prompt you to Allow Peer Connections.  If you are using Flash CS5 to test, you will need to open a second copy of the SWF you published in your browser.

You should now be able to type in the input text at the bottom and send messages to each other.  You can open additional copies of that application in your browser to test with even more participants.

Hope this helps!