Leonardo França » Flash Media Server http://www.leonardofranca.com Flash Platform, Adobe AIR, ActionScript, Flash, RIA, Flex, Flash Media Server, RED5, Flash Lite, PHP, ZendAMF, AMFPHP, Java, GraniteDS, BlazeDS Wed, 08 Sep 2010 06:08:31 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 Using Dynamic Streaming with Flash Media Server 3.5 http://www.leonardofranca.com/index.php/2010/08/23/using-dynamic-streaming-with-flash-media-server-3-5/ http://www.leonardofranca.com/index.php/2010/08/23/using-dynamic-streaming-with-flash-media-server-3-5/#comments Mon, 23 Aug 2010 15:14:42 +0000 Leonardo França http://www.leonardofranca.com/?p=615

Adobe Flash has revolutionized the distribution of video content on the web, we have the Adobe Flash Media Server that helped with this by giving the possibility to distribute content via streaming, including the option to use encryption and features DRM (Digital Rights Management).

Adobe Flash has revolutionized the distribution of video content on the web, we have the Adobe Flash Media Server that helped with this by giving the possibility to distribute content via streaming, including the option to use encryption and features DRM (Digital Rights Management).

O Adobe Flash Media Server 3.5 and Flash Player 10 brings some novelties, among them the possibility to use the Dynamic streaming for content distribution.
Imagine the following scenario, you use a 3G internet limited(my case :( ), glad you’re watching a video and notes of nothing, the video begins to catch, and you’ve used all your available bandwidth and now can only use the minimum that the carrier provides. Another scenario is that the same video can be viewed both via the desktop or any mobile device such as smartphones, which have limited memory, processing power and smaller screen. Flash Media Server can depending on network conditions and client resources, exchange content (audio, video or both) with one that better fits the current conditions of the customer, thus guaranteeing the QoS (Quality of Service).

Flash Media Server can depending on network conditions and client resources, exchange content (audio, video or both) with one that better fits the current conditions of the customer, thus guaranteeing the QoS (Quality of Service).

Dynamic Streaming helps ensure the QoS(Quality of Service)

Dynamic Streaming helps ensure the QoS(Quality of Service)


Adobe recommends that you use dynamic streaming when you find the following criteria:

  • Video with long duration.
  • HD video.
  • Video with larger dimensions, such as full screen video.
  • Content distributed to users who are more susceptible to bandwidth issues, such as home users, rather than corporate users

QoS – Quality of Service – refers to resource reservation control mechanisms rather than the achieved service quality. Source: Wikipedia.

See in detail the use of dynamic streaming in Adobe’s documentation.
See also these two articles devnet with fonts available for download:

Recommended books:
Hands-On Guide to Flash Video: Web Video and Flash Media Server (Hands-On Guide Series)
Flash Video for Professionals: Expert Techniques for Integrating Video on the Web
Introduction to Flash Media Server 2

]]> http://www.leonardofranca.com/index.php/2010/08/23/using-dynamic-streaming-with-flash-media-server-3-5/feed/ 6 BR Conference http://www.leonardofranca.com/index.php/2010/07/12/br-conference/ http://www.leonardofranca.com/index.php/2010/07/12/br-conference/#comments Mon, 12 Jul 2010 16:27:35 +0000 Leonardo França http://www.leonardofranca.com/?p=570

BR Conference


BR Conference 2010 is the first event held in Brazil on RIA (Rich Internet Application) and ColdFusion.
With the support of Adobe Systems Inc’s and share some of the best and most renowned professionals in the world the tools and technologies ColdFusion, Flex, AIR, Flash Media Server and LiveCycle, BR Conference 2010 is an event created by developers for developers.
Learn more …

]]> http://www.leonardofranca.com/index.php/2010/07/12/br-conference/feed/ 0 Authenticating users in Flash Media Server with Flash Media Live Encoder http://www.leonardofranca.com/index.php/2010/07/05/authenticating-users-in-flash-media-server-with-flash-media-live-encoder/ http://www.leonardofranca.com/index.php/2010/07/05/authenticating-users-in-flash-media-server-with-flash-media-live-encoder/#comments Mon, 05 Jul 2010 16:43:50 +0000 Leonardo França http://www.leonardofranca.com/?p=559

Adobe Flash Media Live Encoder is a free software that Adobe offers for you to use to convey stream directly to a server and deploy Flash Media Server for your Web site or application.
Among the options available are:

  • High Quality Encode
  • H264 / VP6 Video
  • AAC / MP3 Audio
  • Command-line
  • Error Handling
  • VITC Timecode
  • Pre-processing
  • Live Metadata
  • Local Archive
  • DVR Support

With support for a variety of capture devices like webcam video, SDI, Composite, Component, Firewire.
There are cases where you need to restrict access to Flash Media Server via the Flash Media Live Encoder for that Adobe has created a plugin that is installed on your server, Flash Media Server, Flash Media Server Authentication Add-in.
Para instalar esse plugin, siga os seguintes passos:
Download and install Flash Media Server Authentication Add-in
https://www.adobe.com/cfusion/entitlement/index.cfm?e=fmle3
Then use the command prompt and go to conf directory Flash Media Server
C:\Arquivos de programas\Adobe\Flash Media Server 3.5\conf
To create a new user, simply use the command:

users add -u user -p 123

Where is the user login and password is 123
Note that the directory C:\Arquivos de programas\Adobe\Flash Media Server 3.5\conf Now there are two files, users.exe and users.dat, logins and passwords are saved in users.dat
Now simply open the Flash Media Live Encoder and try to connect, it asks login and password.
One of the advantages of Flash Media Live Encoder is that it recognizes most devices that capture the Flash Player.
More:
http://www.adobe.com/products/flashmediaserver/flashmediaencoder/
http://www.adobe.com/support/documentation/en/flashmedialiveencoder/

Recommended Books:
Hands-On Guide to Flash Video: Web Video and Flash Media Server (Hands-On Guide Series)
Flash Video for Professionals: Expert Techniques for Integrating Video on the Web
Introduction to Flash Media Server 2

Translations:
Português do Brasil

]]> http://www.leonardofranca.com/index.php/2010/07/05/authenticating-users-in-flash-media-server-with-flash-media-live-encoder/feed/ 0 Simple protection of content from Flash Media Server http://www.leonardofranca.com/index.php/2010/03/05/simple-protection-of-content-from-flash-media-server/ http://www.leonardofranca.com/index.php/2010/03/05/simple-protection-of-content-from-flash-media-server/#comments Fri, 05 Mar 2010 17:27:30 +0000 Leonardo França http://www.leonardofranca.com/?p=542

I was called to resolve a problem with the protection of the contents of a client, the problem was that somebody malicious was stealing their live streams.
He simply took the html code of the site and pasted on her website, so you may transmit the content in your blog. The player in question was not developed by me, so I did not even bother to look at the source, I decided to go directly to the Flash Media Server.
Based on the documentation from Adobe, I decided in a very simple code main.asc is as follows:

PLAIN TEXT
JAVASCRIPT:
  1. trace("init application...");
  2.  
  3. var VALID_REFERRER = "http://www.mydomain.com.br/mySwf.swf";
  4. var VALID_PAGEURL = "http://www.mydomain.com.br/myPage.html";
  5.  
  6. application.onAppStart = function ()
  7. {
  8.     trace("init app...");
  9.     trace("onAppStart> " + application.name + " is starting at " + new Date());
  10. };
  11.  
  12. application.onStatus = function (info)
  13. {
  14.    trace("onStatus> info.level: " + info.level + ", info.code: " + info.code);
  15.    trace("onStatus> info.description: " + info.description);
  16.    trace("onStatus> info.details: " + info.details);
  17. };
  18.  
  19. application.onConnect = function (client)
  20. {
  21.     if ((client.referrer == VALID_REFERRER && client.pageUrl == VALID_PAGEURL))
  22.     {
  23.         trace("acesso permitido");
  24.         application.acceptConnection(client);
  25.     }
  26.     else
  27.     {
  28.         trace("acesso indevido");
  29.         application.rejectConnection(client)
  30.     }
  31.     trace("onConnect> client.ip: " + client.ip);
  32.     trace("onConnect> client.pageUrl: " + client.pageUrl);
  33.     trace("onConnect> client.agent: " + client.agent);
  34.     trace("onConnect> client.referrer: " + client.referrer);
  35.     trace("onConnect> client.protocol: " + client.protocol);
  36. };
  37.  
  38. application.onDisconnect = function (client)
  39. {
  40.     trace("onDisconnect> client.name: " + client.name)
  41.     trace("onDisconnect> disconnecting at: " + new Date());
  42. };
  43.  
  44. application.onAppStop = function (info)
  45. {
  46.    trace("onAppStop> application.name: " + application.name);
  47.    trace("onAppStop> stopping at " + new Date());
  48.    trace("onAppStop> info.level: " + info.level);
  49.    trace("onAppStop> info.code: " + info.code);
  50.    trace("onAppStop> info.description: " + info.description);
  51. };

The API Flash Media Server is very powerful and contains many interesting features, one of them is the ability to know where exactly the connection is coming from the swf. This passage has solved the problem with the constants declared at the beginning of the file.

PLAIN TEXT
JAVASCRIPT:
  1. if ((client.referrer == VALID_REFERRER && client.pageUrl == VALID_PAGEURL))
  2.     {
  3.         trace("acesso permitido");
  4.         application.acceptConnection(client);
  5.     }
  6.     else
  7.     {
  8.         trace("acesso indevido");
  9.         application.rejectConnection(client)
  10.     }

In short, so the connection is made with Flash Media Server is attempting to connect comes from a SWF and HTML defined by me.
A very simple solution but it solved the problem :D
As a last resort, the thief also copied the swf client and put into your blog :P

References:
http://www.adobe.com/devnet/flashmediaserver/articles/protecting_video_fms.pdf
http://www.flashcomguru.com/index.cfm/2007/7/3/video-content-protection
http://www.adobe.com/devnet/flashmediaserver/articles/digital_media_protection.html
http://www.adobe.com/devnet/flashmediaserver/articles/protecting_video_fms.html
http://blogs.adobe.com/security/2007/07/how_to_protect_flash_video_wit.html

]]> http://www.leonardofranca.com/index.php/2010/03/05/simple-protection-of-content-from-flash-media-server/feed/ 1 Flash Camp Brasil = Success!!! http://www.leonardofranca.com/index.php/2010/01/18/flash-camp-brasil-sucess/ http://www.leonardofranca.com/index.php/2010/01/18/flash-camp-brasil-sucess/#comments Mon, 18 Jan 2010 14:49:32 +0000 Leonardo França http://www.leonardofranca.com/?p=531

Flash Camp Brasil - I've been there!!!

Flash Camp Brasil - I've been there!!!


The event was unprecedented in Brazil, the Flash Camp Brasil, occurred in the last days 15 and 16 in Maceió, Brazil.
To begin with, was an adventure can go to the event, with tickets and expensive hotel crowded, but it is something that would not miss for the world.
I was staying in a hostel and lucky for me, on the morning of day 15, shared a post from the street, and my notebook with a damaged battery, I decided to go to the hotel of the event to familiarize myself with the way.
The path to the hostel to the hotel was closer than imagined, having only to wait anxiously for 7 hours until the event start.
While waiting and sitting on the couch with a provision making(ufa!!!), reunion the Gabriela Zaninetti, Marketing Manager of Adobe Systems Brasil, soon after going to the place of lecture and mini-courses, met Demian Borba was already in full swing in the last preparations for the event and introduced me to Filipe Cunha of Globo.com, sorry that did not to attend the mini-course it. Who was it was also Pedro Taranto(we almost ran into the airport).
Shortly after the Gabi introduced me to Fabricio Manzi, guy who knew the years and only in the event I can finally meet you in person. Then I had the opportunity to meet Tiago Venegas, with whom he later exchanged ideas on Flash Media Server, Cássio Souza, Technical Director Gringo and Diego of COC, after some talk time, arrivesIgor Costa, another so that the web and knew I had the opportunity to meet personally, I played a little Mortal Kombat vs DC Comics and took a beating by Neto Leal.
A few minutes before the event, entering the auditorium, reunion the Lee with whom I had a quick conversation about our trips were.
In between I had the opportunity to meet Beck Novaes, in which I showed a bit of a speech that would do the next day. At the end of the event, I know Bruno Ribeiro who told me about the project that won the mini ignite.

About the sessions
First day
Well, full auditorium, all fully prepared and Demian opened the event with an exciting presentation on EFM and how did your dream to make a Flash Camp in Brazil.

Joshua Hirsch Minister of Technology of the Big Spaceship, commented on how your company works and has demonstrated some very interesting projects in which the developer program so even in the latest stage of the project, first you need to buy a machine to smoke.

The second lecture was the Daniel Morena Creative Director of the Agency 32 Bits, about 1.0 Enhanced Reality, that really surprised me, systems showed he made a few years with the Flash Platform using multitouch when not imagined that. I could personally give my congratulations to Daniel Morena.

Second day
O segundo dia se iniciou com a palestra do Sam Rivello, CEO of RMC, biology compared with programming, demonstrated in a simple and objective simulation of biological behavior in programming in Flex 4.

The second lecture was that of Igor Costa, and relaxed and animated, it showed 40 differences considered significant change between Flex 3 and Flex 4.

Tiago Venegas began his lecture by explaining what's new in Flash Media Server 3.5, demonstrated vorttice, a tool conference that owes nothing to the Adobe Connect, also shown as is done dynamic stream.

Next, Lee explained some news about Flash Player 10.1 and created an example using the Adobe Flash CS5 exporting directly to a native application for IPhone.

The presentation of Cássio Souza began with a story about how the way you work in, then explained design pattern State Machine. You may have used State Machine and did not know.

Daniel Dura told the story of the multitouch and demonstrated how it can be worked in Flash Platform.

The talk of closure of the event was dedicated to the Beck Novaes about OutBox, and in my opinion, was closed on a high note, was simply fantastic, I think one of the best speeches of the event.

This was a summary on how fast it was my adventure in Flash Camp Brasil and the ultimate feeling is that it was very worthwhile, Maceió was perfect for the event and a cry marked the Flash Camp Brasil: "sa porra!!!".

See more pictures:
http://www.garagem.com.br/novo_garagem/eventos/flashweb/1024/index.php?cd_evento=1227

]]> http://www.leonardofranca.com/index.php/2010/01/18/flash-camp-brasil-sucess/feed/ 0 Stream with Flex or Flash or Flash Lite and Flash Media Server http://www.leonardofranca.com/index.php/2009/08/22/stream-with-flex-or-flash-or-flash-lite-and-flash-media-server/ http://www.leonardofranca.com/index.php/2009/08/22/stream-with-flex-or-flash-or-flash-lite-and-flash-media-server/#comments Sat, 22 Aug 2009 03:58:54 +0000 Leonardo França http://www.leonardofranca.com/?p=458

Recent years have seen an explosion of growth of multimedia content available, but also the growing use of broadband, we have more users with access to multimedia content, but the main factor was the ease that Flash brought to this kind of implementation of rich content (or you think that if youtube was done with windows media, would have the same result :P ), Including mobile devices. Recently we had the highest peaks of people accessing streamed content with the funeral of Michael Jackson, not only surpassed by the Obama's Inauguration.

Adobe Flash Media Server e Flash Platform

Adobe Flash Media Server and Flash Platform


The aim of this paper is to demonstrate how we can make the mere distribution of content streamed using Adobe Flash Media Server along with the Flash Platform.

We will see how to implement a service stream with Adobe Flex, Adobe Flash and Adobe Flash Lite along with the streaming server Adobe Flash Media Server.

Adobe Flash Media Server 3.5

Adobe Flash Media Server 3.5


Adobe Flash Media Server, currently in its version 3.5, has three versions available:

  • Adobe Flash Media Streaming Server - for transmission to the streaming content with the Flash Platform
  • Adobe Flash Media Interactive Server - For interactive applications, multi-way communication, videos in real-time, audio, and data sharing.
  • Adobe Flash Media Development Server - Contains all the features of FMIS, being free and limited to 10 simultaneous connections.

In addition to these versions, there are the following:

Preparing the Adobe Flash Media Server
The version used in tutorial is Flash Media Server 3.5, see how to install this article from Tom Green, make sure that the server is running normally, and we will create the directory of our application for example, by default, the directories of the applications are created in the path: "C: \ Program Files \ Adobe \ Flash Media Server 3.5 \ applications", I changed the file fms.ini (C: \ Program Files \ Adobe \ Flash Media Server 3.5 \ conf) in the constant "VHOST . APPSDIR "to" C: \ apache \ htdocs \ applications \ ".
That done, let's create the directory of our application giving the name "videoondemand" and within that, another folder called "streams" and within this, a directory called "_definst_" where videos should be saved.
Our structure is ready to receive the videos will be provided for streaming with Flash Media Server, one last detail is to create a file called "main.asc" and save in "videoondemanda" can even be empty, he will be responsible for Flash Media Server recognizes the application. Let's test the console application using Flash Media Server, ( "C: \ Program Files \ Adobe \ Flash Media Server 3.5 \ webroot \ swfs \ fms_adminConsole.swf"), View Applications tab, select the server in my case will place in combobox "new instance ...". select videoOnDemand "if everything is correct, the island had begun to monitor the application. You should see something like the image below:

Flash Media Server Console

Flash Media Server Console


Stream with Flash and Flash Media Server
Now we just need to create our client that will run the videos, we have several ways to implement this, I will start using Adobe Flash CS4 Professional.

  • Go to "Files-> New .." select Flash File (ActionScript 3.0).
  • In the library panel, click on the "new Video. Give the name of instance "vd. In Type leave selecting "Video (ActionScript-controlled).
    Adobe Flash CS4

    Adobe Flash CS4

  • Create a layer to write our ActionScript.

In the initial code, instantiate the class NetConnection to make the connection to Flash Media Server:

PLAIN TEXT
ACTIONSCRIPT3:
  1. var rtmp:String = "rtmp://localhost/videoOnDemand";//your domain Flash Media Server//
  3.  
  4. function doConnect():void
  5. {
  6.     nc.connect(rtmp);
  7.     //nc.objectEncoding=ObjectEncoding.AMF0; // only for Flash Media Server 2
  8.     nc.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStatus);
  9. }
  10.  
  11. function handlerNetStatus(evt:NetStatusEvent):void
  12. {
  13.     var info:Object=evt.info;
  14.     trace(info.code);
  15. }
  16.  
  17. doConnect();

By doing so, we will test pressing ctrl + enter, if all goes well, we should see the following message in the output:

NetConnection.Connect.Success

Now just implement a function that will instantiate the NetStream class, responsible for the video stream, soon after adding the movieclip that will run the video.

PLAIN TEXT
ACTIONSCRIPT3:
  1. function doStream():void
  2. {
  3.     var ns:NetStream=new NetStream(nc);
  4.     vd.attachNetStream(ns);
  5.     ns.play("sneeze");
  6.     ns.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStreamStatus);
  7.     ns.addEventListener(AsyncErrorEvent.ASYNC_ERROR,onMetaData);
  8. }
  9.  
  10. function handlerNetStreamStatus(evt:NetStatusEvent):void
  11. {
  12.     var info:Object=evt.info;
  13.     trace(info.code);
  14. }

We should have the following result:

Stream com Flash e Flash Media Server

Stream com Flash e Flash Media Server


DOWNLOAD SOURCE

Using the FLVPlayback component

  • Go to "Files-> New .." select Flash File (ActionScript 3.0).
  • In dry go to "Window-> Components or Ctrl + F7, drag the FLVPlayback component to the stage, in the name of instance myFLVPlayback

Now we have to "tell" the component that will be using a video stream content, simply set the isLive property to true:

PLAIN TEXT
ACTIONSCRIPT3:
  1. import fl.video.*;
  2.  
  3. flvPlayer.isLive=true;
  4. flvPlayer.source="rtmp://localhost/videoondemand/sneeze";
  5. flvPlayer.scaleMode = VideoScaleMode.MAINTAIN_ASPECT_RATIO;
  6. flvPlayer.play();

Stream with Flex and Flash Media Server
We will see some examples implementing Adobe Flex, the first example will be using the Video class, we instantiate it and add a simple canvas component.
The basics are very similar as done in Adobe Flash.
Using the Video class

PLAIN TEXT
ACTIONSCRIPT3:
  1. private var url_rtmp:String = "rtmp://localhost/videoOnDemand";
  2. private var nc:NetConnection = new NetConnection();
  3. private var ns:NetStream;
  4. private var localVideo:Video = new Video(320,240);
  5. private var videoHolder:UIComponent;

Added the init function to be loaded as createComplete the application:

PLAIN TEXT
ACTIONSCRIPT3:
  1. public function init():void
  2. {
  3.     nc.connect(url_rtmp);
  4.     call();
  5.     //nc.objectEncoding = ObjectEncoding.AMF0; // for Adobe Flash Media Server 2.0
  6.     nc.addEventListener(NetStatusEvent.NET_STATUS,netStatusHandler);
  7.     btnView.addEventListener(MouseEvent.CLICK,play);
  8. }

We will have a function to check if the connection to Flash Media Server was successful.

PLAIN TEXT
ACTIONSCRIPT3:
  1. private function netStatusHandler(e:NetStatusEvent):void
  2. {
  3.     var info:Object = e.info;
  4.     trace(info.code);
  5.     switch(info.code)
  6.     {
  7.         case "NetConnection.Connect.Success":
  8.         btnView.enabled = true;
  9.         btnView.label = "Play";
  10.         break;
  11.         case "NetConnection.Connect.Closed":
  12.         trace();
  13.     break;
  14.     }
  15. }

Function callCamera be responsible for "building" the video (localvideos) to add it in the holder (instance of UIComponent) and only then adding the canvas (cv).

PLAIN TEXT
ACTIONSCRIPT3:
  1. private function call():void
  2. {
  3.     var holder:UIComponent = new UIComponent();
  4.     localVideo = new Video(320,240);
  5.     holder.addChild(localVideo);
  6.     cv.addChild(holder);
  7. }

Now implementing the rest of the code.

PLAIN TEXT
ACTIONSCRIPT3:
  1. private function play(evt:MouseEvent):void
  2. {
  3.     ns = new NetStream(nc);  
  4.         ns.play("sneeze");
  5.     localVideo.attachNetStream(ns);
  6.     ns.addEventListener(NetStatusEvent.NET_STATUS,netStatusHandlerNC);
  7. }
  8.            
  9. private function netStatusHandlerNC(e:NetStatusEvent):void
  10. {
  11.     var info:Object = e.info;
  12.     trace(info.code);
  13. }

Mxml code in this source:
DOWNLOAD SOURCE

Using the component VideoDisplay
The implementation of this component created by Giacomo (Peldi) Guilizzoni after being included in the Flex Framework should be the most difficult of all :P , Or I'll take the time to explain.

PLAIN TEXT
ACTIONSCRIPT3:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  3.     <mx:VideoDisplay id="vd" source="rtmp://localhost/videoondemand/streams/sneeze.flv" x="10" y="10"/>
  4. </mx:Application>

DOWNLOAD SOURCE

Using the FLVPlayback component in Flex
The component can also be FLVPlaybak using Adobe Flex, for this just follow the following steps:

  • Go to "directory to install the Adobe Flash\Common\Configuration\Components\Video\".
  • FLVPlaybackAS3.swc Copy the file to your project in Flex Builder
  • Choose the skin (the installation directory of the Adobe Flash \ Common \ Configuration \ FLVPlayback Skins \ ActionScript 3.0) of your preference and save on your project.

Now just instantiate the class instance and adds it to the stage:

PLAIN TEXT
ACTIONSCRIPT3:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="createVideo();">
  3.     <mx:Script>
  4.         <![CDATA[
  5.             import mx.core.UIComponent;
  6.             import fl.video.FLVPlayback;
  7.             import fl.video.VideoScaleMode;
  8.            
  9.             private function createVideo():void
  10.             {
  11.                 var vid:FLVPlayback = new FLVPlayback();
  12.                 var ui:UIComponent = new UIComponent();
  13.                 //this.addChild(ui);
  14.                 ui.addChild(vid);
  15.                 flvbp.addChild(ui)
  16.                 vid.width = 320;               
  17.                 vid.height = 240;
  18.                 vid.source = "rtmp://localhost/videoondemand/sneeze";
  19.                 vid.skinBackgroundColor = 0x666666;
  20.                 vid.skin = "skins/SkinUnderPlayStopSeekFullVol.swf"; // salvar o skin no projeto
  21.                 vid.scaleMode = VideoScaleMode.MAINTAIN_ASPECT_RATIO;
  22.                 vid.skinAutoHide = false;
  23.             }
  24.         ]]>
  25.     </mx:Script>
  26.     <mx:Canvas id="flvbp" x="0" y="0" />
  27. </mx:Application>

Stream with Flash Lite and Flash Media Server
Adobe Flash Lite 3.0 introduced some new ones, the ability to play video streamed directly with Adobe Flash Media Server. Joining this with the growing use of 3G and models of phones with Flash Lite (the work everyone has a Nokia N95, the less I :P ) , We have an unprecedented range of possibilities in world.
To schedule content for Flash Lite, we will use Adobe Flash CS4 and ActionScript 2.0 programming (still can not use ActionScript 3.0 or even Adobe Flex).

  • Go to "Files-> New .." select Flash File (Mobile).
  • Then, will open the Adobe Device Central CS4, pick any phone model that supports Flash Lite 3.0, has no case, ask for the Device Central update your library.
  • We will do the same thing we did to play stream with Flash CS4, In the library, click on the "new Video. Give the name of instance "vd. In Type leave selecting "Video (ActionScript-controlled).
  • Create a layer to write our ActionScript.

In the initial code, instantiate the class NetConnection to make the connection to Flash Media Server, if successful, begin the stream:

PLAIN TEXT
ACTIONSCRIPT:
  1. //#include "BandwidthAS2.as"
  2.  
  3. var rtmp:String = "rtmp://localhost/webcam";
  4. client_nc = new NetConnection();
  5. client_nc.connect(rtmp);
  6.  
  7. fscommand2("FullScreen", true);
  8.  
  9. client_nc.onStatus = function(info) {
  10.     trace("Level: "+info.level+" Code: "+info.code);
  11.     switch (info.code) {
  12.         case "NetConnection.Connect.Success" :
  13.             doPlay();
  14.             break;
  15.         case "NetConnection.Connect.Closed" :
  16.             break;
  17.     }
  18. };
  19.  
  20. function doPlay()
  21. {
  22.     in_ns = new NetStream(client_nc);
  23.     vd.attachVideo(in_ns);
  24.     in_ns.play("sneeze");
  25.     in_ns.connect();
  26. }

One detail that we must look at the setting of publication, we put the option "Local Playback" to "Access network only", but the video will not run on the phone.

Configuração de publicação para p Flash Lite 3.1

Configuração de publicação para o Flash Lite 3.1


That done, we have the following result:
Adobe Device Central

Adobe Device Central


Now it so save the swf and test the phone, you can also save it as Flash Lite 3.1 and use Adobe Mobile Package to create an installer .sis (to Simbiam) or .cab (for windows mobile) for your mobile.

DOWNLOAD SOURCE

Bonus 1
Stream with Adobe Dreamweaver CS4 and Flash Media Server
Ok ok, not quite but it is an alternative for those not familiar with Adobe Flash or Adobe Flex. Let it:

  • Create a blank html page.
  • Go to "Insert-> Media-> FLV .
  • In Video type, select "Streaming Video".
  • On server load URI put rtmp://localhost/videoondemand/.
  • In stream name, put the name of the video, in our case will "sneeze".
  • Configure the remaining options to your liking, save the page and open in your browser (Dreamweaver will copy some files to your next page)

Bonus 2
Some useful tools for developing with Adobe Flash Media Server, including an update of the FLVPlayback with support for Dynamic Streaming and DVR.
http://www.adobe.com/products/flashmediaserver/tool_downloads/

Bonus 3
The file main.asc used in the example has an implementation to detect the speed of bandwidth used and we can create a feature to determine a video that best fits User Connection. This file appears in the examples that are located in the installation of Adobe Flash Media Server.

DOWNLOAD SOURCE

Flash Media Server Developer Center
http://www.adobe.com/devnet/flashmediaserver/

Recommended Books:
Hands-On Guide to Flash Video: Web Video and Flash Media Server (Hands-On Guide Series)
Flash Video for Professionals: Expert Techniques for Integrating Video on the Web
Introduction to Flash Media Server 2

Translations:
Português do Brasil

]]> http://www.leonardofranca.com/index.php/2009/08/22/stream-with-flex-or-flash-or-flash-lite-and-flash-media-server/feed/ 0 Flex with Flash Media Server!!! http://www.leonardofranca.com/index.php/2006/03/12/flex-with-flash-media-server/ http://www.leonardofranca.com/index.php/2006/03/12/flex-with-flash-media-server/#comments Mon, 13 Mar 2006 00:19:32 +0000 Leonardo França http://www.leonardofranca.com.br/index.php/2006/03/12/flex-with-flash-media-server/

A well interesting article on as to use Flex 2 with Flash Media Server, is a simple example but of the one notion of as to use the class NetConnection and NetStream in Flex 2 and to feel some differences in the Action Script 3.0.

link of the article: http://flash-communications.net/technotes/fms2/flex2FMS/index.html

See the application working
14/03/2006 *** UPDATE ******
I found another article on Flex and Flash Media Server written by Christophe Coenraets, very good for signal!
Link of the article: http://coenraets.com/viewarticle.jsp?articleId=98
Link for the application

For to see the examples is need to have the Flash Player 9

To know more: Programming Flash Communication Server
http://flash-communications.net/index.html
Adobe Labs http://labs.macromedia.com/

]]> http://www.leonardofranca.com/index.php/2006/03/12/flex-with-flash-media-server/feed/ 0 Creating one playlist with Flash Communication Server/Flash Media Server. http://www.leonardofranca.com/index.php/2006/03/04/creating-one-playlist-with-flash-communication-serverflash-media-server/ http://www.leonardofranca.com/index.php/2006/03/04/creating-one-playlist-with-flash-communication-serverflash-media-server/#comments Sat, 04 Mar 2006 11:53:17 +0000 Leonardo França http://www.leonardofranca.com.br/index.php/2006/03/04/creating-one-playlist-with-flash-communication-serverflash-media-server/en/

We saw in the previous article as to record they stream using the Flash Communication Server/Flash Media Server, now we go to implement one playlist for this resource. Each video that to record will be added playlist for later being seen.

For this we will use the SharedObject Remote to keep the information of the recorded videos. SharedObjects offers sharing of information in real time between multiplos customers SWF' s being able to be persistent in schemes local or in the remote server. The Shared place object would be as "Cookies" and the SharedObject Remote as transference of data in real-time.

It opens a new document in the Flash, we go to create two movies clips of the video type, to add to a video object in its library, opens the panel library (windom Video object you your library, open the Library panel (Window > Library or Ctrl+L or F11) adds to one embedded Video object to it selecting New Video in the options of library.

First connecting to the Flashcom/Flash Media Server:

PLAIN TEXT
Actionscript:
  1. client_nc = new NetConnection();
  2. client_nc.onStatus = function(info) {
  3.        trace("Level: "+info.level+"   Code: "+info.code);
  4. };
  5. client_nc.connect("rtmp:/playlist");//considerando localhost

Recouping the data of the Shared Object Remote, and filling component “List” using the method onSync, this method is the responsible one for the synchronization of data with the server.

PLAIN TEXT
Actionscript:
  1. rec_so = SharedObject.getRemote("videos", client_nc.uri, true);
  2. rec_so.onSync = function(list) {
  3.         _root.Play_list.removeAll();
  4.        for (var i in _root.rec_so.data) {
  5.                     _root.Play_list.addItem(i);
  6.       }
  7. };
  8. rec_so.connect(client_nc);

In the first line it notices that we give the name of "video" to the object created, the third parameter "true" will guarantee that the data remain in the server, in case that parameter were passed falsifies, the data so would remain while the user was connected to the application. In stage we will have two textfields, one with the name of instance of "ListItem" of the type "input" and another one with the o name of instance of "Status_msg" of the type "dynamic", also will have two movie clips of the type video, one to receive it webcam with the name of instance of "live" and other to show the selected videos of the list with "the published" name of instance of. We create a function to record stream it:

PLAIN TEXT
Actionscript:
  1. function doRecord() {
  2.     if (ListItem.text == undefined || ListItem.text == "") {
  3.         Status_msg.text = "Necessario um titulo.";
  4.         ListItem.setFocus();
  5.     } else if (Record_btn.label == "Record") {
  6.         Status_msg.text = "Recording...";
  7.         if (Play_btn.label == "Stop") {
  8.             doPlay();
  9.         }
  10.         Play_btn.enabled = false;
  11.         out_ns = new NetStream(_root.client_nc);
  12.         out_ns.attachAudio(Microphone.get());
  13.         var teste_cam:Camera = Camera.get();
  14.         live.attachVideo(teste_cam);
  15.         out_ns.attachVideo(teste_cam);
  16.         out_ns.publish(ListItem.text, "record");
  17.         _root.rec_so.data[ListItem.text] = ListItem.text;
  18.         _root.rec_so.flush();
  19.         Record_btn.label = "Stop";
  20.     } else if (Record_btn.label == "Stop") {
  21.         out_ns.close();
  22.         Play_btn.enabled = true;
  23.         Record_btn.label = "Record";
  24.         ListItem.text = "";
  25.         Status_msg.text = "...";
  26.     }
  27. }

Interesting detail in the method "publish" of the NetStream class, that can have three arguments, its syntax is the following one:

  • record: saved the archive as flv in the server, if the archive already to exist will be sobrescrito.
  • append: saved the archive as flv in the server, adding from the safe archive previously.
  • live: it transmits to the living without saving, if the archive to exist will be deleted.

Creating the method to play the video of the list.

PLAIN TEXT
Actionscript:
  1. function doPlay() {
  2.     if (Play_btn.label == "Play") {
  3.         Status_msg.text = "Playing...";
  4.         Play_btn.label = "Stop";
  5.         var playFileName = Play_list.selectedItem.label;
  6.         _root.in_ns = new NetStream(_root.client_nc);
  7.         publicado.attachVideo(_root.in_ns);
  8.         _root.in_ns.play(playFileName);
  9.         in_ns.onStatus = function(info) {
  10.         if (info.level == "error" || info.code == "NetStream.Play.Stop") {
  11.             Status_msg.text = "Stopped sending data...";
  12.                     Play_btn.label = "Play";
  13.         }
  14.         };
  15.     } else if (Play_btn.label == "Stop") {
  16.         Status_msg.text = "Stop...";
  17.         in_ns.onStatus = null;
  18.         in_ns.close();
  19.         Play_btn.label = "Play";
  20.        }
  21. }

Finishing with the creation dynamically of the buttons, the list and associating the methods doRecord and doPlay to the events of the buttons.

PLAIN TEXT
Actionscript:
  1. Play_list.addEventListener("change", listListener);
  2. var Play_list = _root.createClassObject(mx.controls.List, "Play_list", 1, {_x:357, _y:214});
  3. Play_list.setSize(148, 177);
  4. var Play_btn = _root.createClassObject(mx.controls.Button, "Play_btn", 2, {_x:170, _y:216, label:"Play"});
  5. var Record_btn = _root.createClassObject(mx.controls.Button, "Record_btn", 3, {_x:47, _y:216, label:"Record"});
  6. Record_btn.onRelease = function() {
  7.        doRecord();
  8. };
  9. Play_btn.onRelease = function() {
  10.        doPlay();
  11. };
  12. var listListener:Object = new Object();
  13. listListener.change = function(evt_obj:Object) {
  14.     var playFileName = evt_obj.target.selectedItem.label;
  15.     trace(playFileName);
  16.     in_ns.pause();
  17.     in_ns = new NetStream(_root.client_nc);
  18.     publicado.attachVideo(in_ns);
  19.     in_ns.play(playFileName);
  20. };

The code complete:

PLAIN TEXT
Actionscript:
  1. client_nc = new NetConnection();
  2. client_nc.onStatus = function(info) {
  3.               trace("Level: "+info.level+"   Code: "+info.code);
  4. };
  5. client_nc.connect("rtmp://200.219.239.68/osfederais/playlist");
  6. rec_so = SharedObject.getRemote("recordings", client_nc.uri, true);
  7. rec_so.onSync = function(list) {
  8.                _root.Play_list.removeAll();
  9.                for (var i in _root.rec_so.data) {
  10.                               _root.Play_list.addItem(i);
  11.                }
  12. };
  13. rec_so.connect(client_nc);
  14. function doRecord() {
  15.                if (ListItem.text == undefined || ListItem.text == "") {
  16.                               Status_msg.text = "Necessario um titulo.";
  17.                               ListItem.setFocus();
  18.                } else if (Record_btn.label == "Record") {
  19.                               Status_msg.text = "Recording...";
  20.                               if (Play_btn.label == "Stop") {
  21.                                              doPlay();
  22.                               }
  23.                               Play_btn.enabled = false;
  24.                               _root.out_ns = new NetStream(_root.client_nc);
  25.                               _root.out_ns.attachAudio(Microphone.get());
  26.                               _root.teste_cam = Camera.get();
  27.                               _root.live.attachVideo(teste_cam);
  28.                               _root.out_ns.attachVideo(_root.teste_cam);
  29.                               _root.out_ns.publish(ListItem.text, "record");
  30.                               _root.rec_so.data[ListItem.text] = ListItem.text;
  31.                               _root.rec_so.flush();
  32.                               Record_btn.label = "Stop";
  33.                } else if (Record_btn.label == "Stop") {
  34.                               _root.out_ns.close();
  35.                               Play_btn.enabled = true;
  36.                               Record_btn.label = "Record";
  37.                               ListItem.text = "";
  38.                               Status_msg.text = "...";
  39.                }
  40. }
  41. function doPlay() {
  42.                if (Play_btn.label == "Play") {
  43.                               Status_msg.text = "Playing...";
  44.                               Play_btn.label = "Stop";
  45.                               var playFileName = Play_list.selectedItem.label;
  46.                               _root.in_ns = new NetStream(_root.client_nc);
  47.                               publicado.attachVideo(_root.in_ns);
  48.                               _root.in_ns.play(playFileName);
  49.                               _root.in_ns.onStatus = function(info) {
  50.                                              if (info.level == "error" || info.code == "NetStream.Play.Stop") {
  51.                                                             Status_msg.text = "parado...";
  52.                                                             Play_btn.label = "Play";
  53.                                              }
  54.                               };
  55.                } else if (Play_btn.label == "Stop") {
  56.                               Status_msg.text = "Stop...";
  57.                               _root.in_ns.onStatus = null;
  58.                               _root.in_ns.close();
  59.                               Play_btn.label = "Play";
  60.                }
  61. }
  62. Play_list.addEventListener("change", cbListener);
  63. var Play_list = _root.createClassObject(mx.controls.List, "Play_list", 1, {_x:357, _y:214});
  64. Play_list.setSize(148, 177);
  65. var Play_btn = _root.createClassObject(mx.controls.Button, "Play_btn", 2, {_x:170, _y:216, label:"Play"});
  66. var Record_btn = _root.createClassObject(mx.controls.Button, "Record_btn", 3, {_x:47, _y:216, label:"Record"});
  67. Record_btn.onRelease = function() {
  68.                doRecord();
  69. };
  70. Play_btn.onRelease = function() {
  71.                doPlay();
  72. };
  73. var cbListener:Object = new Object();
  74. cbListener.change = function(evt_obj:Object) {
  75.                var playFileName = evt_obj.target.selectedItem.label;
  76.                trace(playFileName);
  77.                in_ns.pause();
  78.                in_ns = new NetStream(_root.client_nc);
  79.                publicado.attachVideo(in_ns);
  80.                in_ns.play(playFileName);
  81. };

To define its application in the server, it creates a diretory called "playlist" in its server the Flash Communication Server/Flash Media Server. It gives to ctrl+enter to test the application
It sees application in functioning

more
Flash Media Server Developer Center
http://www.macromedia.com/devnet/flashmediaserver/

FlashComGuru
http://www.flashcomguru.com/

FlashCom.com.br
http://www.flashcom.com.br/

Flash Media Server Fun
http://www.fczone.com/

]]> http://www.leonardofranca.com/index.php/2006/03/04/creating-one-playlist-with-flash-communication-serverflash-media-server/feed/ 0 Testing Webcam with Flash Communication Server/Flash Media Server http://www.leonardofranca.com/index.php/2005/12/03/testing-webcam-with-flash-communication-serverflash-media-server/ http://www.leonardofranca.com/index.php/2005/12/03/testing-webcam-with-flash-communication-serverflash-media-server/#comments Sat, 03 Dec 2005 23:42:52 +0000 Leonardo França http://www.leonardofranca.com.br/index.php/2005/12/03/testing-webcam-with-flash-communication-serverflash-media-server/en/

The Flash Media Server/Flash Communication Server is a server of stream developed by Macromedia, with it can be developed applicatory of the most varied as complex videoconferences , chats, stream of audio, video and what more the imagination to allow. We will see with the time as to develop a complex application and robust using the FMS/FCS, however, I go to look for to show as to make this without using the ready components of the Flash.

Installing and creating its first application in FlahCom
Having the FMS/FCS installed correctly in its machine or the server, we go to test connection and to create small applicatory that will test its they webcam

Opens a new document in the Flash, presses F11 to open the library, later inserts a new item in the library (New Video) as in the image below:

Inserindo novo video

It drags this item for palco of the Flash, gives the name of instance “live�?. presses F9 to open the window of Actions.
Create one variavel for connection.

PLAIN TEXT
Actionscript:
  1. var teste_nc:NetConnection = new NetConnection();

Testing the connection.

PLAIN TEXT
Actionscript:
  1. teste_nc.onStatus = function(info) {
  2.     trace("Level: "+info.level+"   Code: "+info.code);
  3. };

Connecting the server FMS/FCS

PLAIN TEXT
Actionscript:
  1. teste_nc.connect("rtmp://doman");//for localhost use rtmp:/aplication

Getting images of webcam

PLAIN TEXT
Actionscript:
  1. var teste_cam:Camera = Camera.get();

Insert the images of webcam in instance of video create

PLAIN TEXT
Actionscript:
  1. live.attachVideo(teste_cam);

The code:

PLAIN TEXT
Actionscript:
  1. var teste_nc:NetConnection = new NetConnection();
  2. teste_nc.onStatus = function(info) {
  3.     trace("Level: "+info.level+"   Code: "+info.code);
  4. };
  5. teste_nc.connect("rtmp://dominio");//para localhost use
  6. var teste_cam:Camera = Camera.get();
  7. live.attachVideo(teste_cam);

Test the swf(ctrl+enter) if everything will be certain swf will ask to it if it will be able to have access its webcam, accepting you will see its webcam functioning.

see the test

***UPDATE*** 18/02/2006
When you use the method "Camera.get();" automatically the Flash Player shows to the user the option to allow or to deny the access of the flash they webcam it. In this we can know if the access or was allowed not using the function onStatus later as in the following example:

PLAIN TEXT
Actionscript:
  1. var client_cam = Camera.get();
  2. client_cam.onStatus = function(infoObj:Object) {
  3.             switch (infoObj.code) {
  4.             case 'Camera.Muted' :
  5.                 trace("Camera deny");
  6.                 break;
  7.             case 'Camera.Unmuted' :
  8.                 trace("Camera access");
  9.                 break;
  10.             }

Flash Media Server Developer Center
http://www.macromedia.com/devnet/flashmediaserver/

FlashComGuru
http://www.flashcomguru.com/

FlashCom.com.br
http://www.flashcom.com.br/

]]> http://www.leonardofranca.com/index.php/2005/12/03/testing-webcam-with-flash-communication-serverflash-media-server/feed/ 0