FMS3 and Flex create online multiplayer video conferencing and video chats (with original code)

Source: Internet
Author: User
Tags addchild

FLEX,FMS3 Series article Navigation
  1. FLEX,FMS3 related articles Index

This is a video chat, Conference development Example series of the 3rd article, the series of all articles linked as follows:
Http://www.cnblogs.com/aierong/archive/2008/12/30/Flex.html#sp

1. Working principle
Application of Netstream.publish method
Publish () Method: sends an audio stream, a video stream, and a text message stream from the client to Flash Media Server, and optionally record the stream during transmission. This method is intended for use only by publishers of the specified stream.
1th parameter: A string that identifies the stream.
2nd parameter: A string that specifies how to publish the stream. Valid values are "record", "Append", and "live". The default value is "Live". (these 3 parameters differ as follows:)
If you pass a record, Flash Player publishes and records real-time data, while saving the recorded data to a new file with a name that matches the value passed to the name parameter. This file is saved in a subdirectory of the directory where the server application resides on the server. If the file exists, the file is overwritten.
If you pass "append", Flash Player publishes and records real-time data and attaches the recorded data to a file that matches the value that is passed to the name parameter, which is stored in a subdirectory of the directory on the server that contains the server application. If a file that matches the name parameter is not found, a file is created.
If this parameter is omitted or "live" is passed, Flash Player publishes live data without recording. If there is a file with a name that matches the value passed to the name parameter, delete it.

About the Netstream.publish method you can also read my previous article
Http://www.cnblogs.com/aierong/archive/2009/01/10/flex_fms_video_start.html

To implement video conferencing is the type of "live" that is used

To take a look at the schematic, the user attending the meeting publish the picture captured by their local camera to the FMS, which is stored in the UserList collection object in the FMS, where each user name is the name of the video they publish. Whenever a new user joins or exits the meeting, the FMS broadcasts the userlist to each user who is also online. Users get userlist Just play video of several other users. How simple is the principle!

2. Preparatory work
In the application of the FMS installation directory, create a new folder Test_video2 and start the FMS server

3. Start code
This code is divided into 2 parts: The server-side ASC file and the client

There are 2 important classes in the ASC file:
Application class: The application class contains information about an instance of a Flash Media server application that maintains this information until the application instance is uninstalled.
Client class: The client class lets you handle every user or client that is connected to an instance of a Flash Media server application.

The application class has several important events as follows:
Application.onappstart is called when the application is loaded by the server.
Application.onappstop called when the application is unloaded by the server.
Application.onconnect called when a client connects to this application.
Application.ondisconnect called when a client disconnects from this application.

The application class has several important methods as follows:
Application.acceptconnection () accepts a connection from the client to an application.
APPLICATION.BROADCASTMSG () broadcasts a message to all connected clients.
Application.disconnect () Disconnects a client from the server.
Application.rejectconnection () denies the connection to an application.

The client class has 1 important methods as follows:
Client.call () Executes a method asynchronously on the flash client and returns the value from the Flash client to the server.

4. First write the ASC file, open WordPad, type the following code, and save as TEST_VIDEO2.ASC, and then copy this file to the Test_video2 folder (ASC file requirements and folder name or MAIN.ASC)
Userlist=[];

Application.onappstart=function ()
{
Trace ("FMS server starts ...");
}

Application.onconnect = function (currentclient)
{
 application.acceptconnection (currentclient);
 if (userlist.length>=3)
 {
  currentclient.call ("showservermsg", NULL, "Maximum number of users already reached") ;
  application.rejectconnection (currentclient);
 }
 else
 {                 &NBSP
  currentclient.communicateserver= Function (value)
  {
    currentClient.username=value;
   trace (currentclient.username+ "Join chat room");
   userlist.push (value);
   trace ("Current user list" +userlist);
   application.broadcastmsg ("Playothervideo", userlist);
  }
 }
}

Application.ondisconnect=function (currentclient)
{
Trace ("User" +currentclient.username+ "Leave chat room");

for (j=0;j<userlist.length;j++)
{
if (userlist[j]==currentclient.username)
{
Userlist.splice (j,1);
}
}
Trace ("Current user list" +userlist);
Application.broadcastmsg ("Playothervideo", userlist);
}

Code Description:
(1) application.broadcastmsg ("Client method name", parameter:); is an important method in ASC, and his role is to broadcast to all connected clients, calling the client's function. This method is equivalent to looping through the application.clients array and invoking Client.call () on each individual client, but this method is more efficient (especially when the number of clients connected is large). The only difference is that when you call BROADCASTMSG () You cannot specify a response object, except that the two syntaxes are the same.
(2) The function of Userlist.splice (A, b), which is to move the B element in the array from the a position (ASC is using the AS1 syntax)
(3) Restrictions in the code, only allow up to 3 people to connect FMS


5. Open FB3, create a project

6. Drag the control in main mxml with the following interface:

The specific code is as follows:
<mx:label x= "Ten" y= "text=" "Your Picture"/>
<mx:videodisplay x= "Ten" y= "width=" "height=", "id=" Vd_myvideo
<mx:textinput x= "y=" text= "Enter your name" id= "Txt_username" width= "$" focusin= "txt_username.text="/>
<mx:button x= "288" y= "label=" into chat room id= "Btn_start"/>
<mx:vbox x= "y=" 161 "width=" id= "Vb_othervideo" >
</mx:VBox>

7. Import the package and define the variables as follows:
Import Mx.controls.Label;

Import Mx.controls.Alert;

private Var netconnection:netconnection;
private Var Outnetstream:netstream;
private Var Camera:camera;
private Var Microphone:microphone;
private Var Responder:responder;
private var appserver:string= "Rtmp://192.168.0.249/test_video2";
private Var username:string= "";

Code Description:
Outnetstream is the video stream you're going to post to the FMS, which is your picture, in layman's words.
Responder if the client calls a method in the server-side AS1 code that requires a callback function, define this responder, which will be specified later
Username the user name of each user, which is the name of the video when it is published

8.creationcomplete= "Init ()", page initialization code
Private Function init (): void
{
Netconnection = new Netconnection ();
Netconnection.addeventlistener (Netstatusevent.net_status,netstatushandler);
Netconnection.connect (AppServer);
Netconnection.client=this;
Initmedia ();
}

Private Function Initmedia (): void
{
Camera = Camera.getcamera ();
Camera.setmode (120,90,15);
Camera.setquality (0,90);
Vd_myvideo.attachcamera (camera);
Microphone=microphone.getmicrophone ();
}

Private Function Netstatushandler (evt:netstatusevent): void
{
Trace (Evt.info.code);

if (evt.info.code== "NetConnection.Connect.Success")
{
Btn_start.addeventlistener (mouseevent.click,startcommunicate);
}
Else
{
Alert.show ("FMS connection Failed" +evt.info.code);
}
}
The code is relatively simple, do not understand can see my last article
Http://www.cnblogs.com/aierong/archive/2009/01/10/flex_fms_video_start.html

9. Implement button Events
Private Function Startcommunicate (evt:mouseevent): void
{
Username=txt_username.text;
Responder=new Responder (Communicatestatahandler);
Netconnection.call ("Communicateserver", responder,username);
}

Private Function Communicatestatahandler (str:string): void
{
Outmyvideo ();
Btn_start.enabled=false;
}

Private Function Outmyvideo (): void
{
/* Publish video */
Outnetstream = new NetStream (netconnection);
Outnetstream.attachcamera (camera);
Outnetstream.attachaudio (microphone);
Outnetstream.publish (username, "live");
}
Code Description:
The Responder class provides an object that is used in Netconnection.call () to handle return values from servers that are related to success or failure of a particular operation.
Netconnection.call calls the ASC file in Communicateserver, after the call succeeds, the callback Communicatestatahandler method

10.showServerMsg Method implementation
Public Function Showservermsg (msg:string): void
{
Alert.show (msg);
}
Code Description:
To be called in an ASC file

11.playOtherVideo Method Implementation:
Public Function Playothervideo (newuserlist:array): void
{
Vb_othervideo.removeallchildren ();

for (Var i:int=0;i<newuserlist.length;i++)
{
if (newuserlist[i]!=username)
{
var vd:videodisplay = new Videodisplay ();
var video:video = new video ();
video.width=120;
video.height=90;
var innetstream:netstream= new NetStream (netconnection);
Video.attachnetstream (Innetstream);
Innetstream.play (Newuserlist[i]);
var label:label= new label ();
label.text=newuserlist[i]+ "the picture";

Vd.addchild (video);
vd.width=120;
vd.height=90;
Vb_othervideo.addchild (label);
Vb_othervideo.addchild (VD);
}
}
}
Code Description:
ASC file Application.broadcastmsg method call, broadcast to all connected clients

12. Run the program, picture below, one of them has no video camera

13. Code Download
Http://files.cnblogs.com/aierong/Video2.rar
After you receive the code, please return to the article under the message to tell it! If you don't get it, I can send it again!

Provide code to learn from each other and explore together! Please communicate with us more!
1. If you have any questions about the code, you can leave a message in the comment section of the article, I will do my best to answer you!
2. If you find a bug in the process of running the code, or if you have any good suggestions and comments, you can also leave a message in the comment section of the article, I will correct it in time!


Comment Area Use tips:
Comment Area message (using advanced review) is can be affixed to the picture, if there are difficult to describe the problem, you can paste pictures and text together to explain
Thank you!

FMS3 and Flex create online multiplayer video conferencing and video chats (with original code)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.