12 January 2009
This article is the second in my series of beginning-level tutorials about Adobe Flash Media Server 3.5. This particular tutorial gets you started using Flash Media Server 3.5 to stream a video into a Flash video player (SWF) using the VOD service.
Here are all the articles in the series:
To understand VOD, let's take a minute and step back to understand some fundamentals about using Flash Media Server 3.5. Earlier iterations of Flash Media Server (FMS) were not exactly one of those things you'd categorize as "really easy to learn." In fact, many people who approached Flash Media Server 2 for the first time found that the learning curve was steep, to put it mildly. You couldn't simply install the server, launch Flash authoring, generate an FLV file, and get into the streaming game. No way, no how.
Here's the fascinating thing about Flash Media Server 3.5: that's exactly what you now do.
To understand what I'm getting at, you need to clearly comprehend the fact that Flash Media Server 3.5 uses a client-server architecture, in which Adobe Flash is the client and FMS is the server. For this to work right, though, you have to rethink your workflow slightly. Instead of putting your video files in a folder on your web server—the familiar progressive download model—you put the videos in a folder on the FMS server. This folder is known as the "application"; the folder where the media files are located is called the "instance." It looks somewhat like this: rtmp://server/Application/Instance. (You'll be using the RTMP path in a minute.)
This concept trips up a lot of people who decide to get into the streaming game with Flash Media Server. It even tripped me up at first.
The other part of the equation was that you needed a fundamental grasp of server-side ActionScript to get yourself rolling. This ActionScript could range from a single line of code to hundreds of lines depending on the complexity of the project.
This latest iteration of FMS marks a significant break with standard practice. If you are into writing hundreds of lines of code, then you are going to adore Flash Media Interactive Server 3.5. If your goal, like me, is simply to get your video up and running, then Flash Media Streaming Server 3.5 and its VOD service is tailor-made for you.
Let's get started:
Flash Media Server 3.5 contains a "video on demand" capability, which explains the folder name vod. The VOD service lets you stream video and audio files through the server without having to write any application code or configure the server. You need only point the Flash FLVPlayback component or a Flash video object to a file in this folder and the file—as long as it is an MP4, FLV, or MP3 file—will play.
Now that you have placed the video in its proper location, let's play it locally using the VOD service on the streaming server:
That address is the path to the FLV file and follows the rtmp://server/Application/Instance syntax I mentioned earlier. In this case, the server is localhost, the application is vod and the instance is Legends.flv in the media folder.
Note: I discuss setting the FMS server to localhost in my other tutorial, Beginner's guide to installing Flash Media Server 3.5.
Flash Media Server 3.5 works with a number of file formats other than FLV. It also streams MPEG-4 and MPEG-3 files out of the vod folder. If you decide to use these two formats, the content path will be different.
Assume you have an MPEG-4 and MPEG-3 version of the Legend file. You've named the files Legend.mp4 and Legend.mp3 and placed them in the vod folder.
To access the MPEG-3 file, use this file path:rtmp://localhost/vod/mp3:Legend
Note the change after /vod. Also, you do not need to include the MP3 extension after the filename.
Things are a bit different when it comes to streaming an MPEG-4 file. As shown in Figure 4, the path to file would be this:
Notice that this time you do need to include the file extension (.mp4). This holds true for other formats that use the H.264 standard, such as MOV (.mov) files.
The different syntaxes are summarized as follows:
The next question, of course, is "That's all well and good, Tom, but how do I get it to play on a real, live FMS 3.5 server?"
The answer is a simple change to the code. Replace localhost with the RTMP address supplied by your Flash Media Server hosting provider and you are in business. Naturally, you will need to upload the video file to your account on the hosting provider's server but other than the address change and the upload, you really don't need to do much more than that.
Note: Keep in mind that no two Flash Media Server hosting providers are created equal, as pointed out in Consumer's guide to using a Flash Media Server hosting provider by the folks at Influxis. Your RTMP address and workflow may be a bit different, too, so it's always best to check with your hosting provider once you get going.
This technique is brand new to Flash Media Server 3.5 and should get the attention of any web developer out there who lives in a world of pure HTML and CSS. If you're always telling yourself that you simply never have time to learn Flash, then your time has arrived. All you need is Adobe Dreamweaver (CS3 or CS4). For you purists who believe that plain-text editors like Notepad are the way to code, knock yourself out.
When you installed Flash Media Server 3.5, you also installed an HTTP server running Apache 2.2. If you open the webroot folder (C:\Program Files\Adobe\Flash Media Server 3.5\webroot), you will disover that there is a vod folder too. Let's use this folder to add the video player contained on the start screen to play a video:
There is another way to do this. Navigate to the samples folder in your Flash Media Server 3.5 folder. Open the videoPlayer folder and double-click the videoPlayer.html file in that folder. The code you can copy appears at the bottom of the page. There is a bit more to this and I'll get into that in the next installment of this series.
The next tutorial shows you how to use ActionScript 3.0 to stream an H.264 video from the vod folder, and then stream that same video from an application.
Tutorials & Samples