Streaming Multiple YouTube Videos

Posted on 28. Mar, 2009 by Prlwytzkofsky in Robot

I must admit, after a few days without progress, I had to suspect it just wasn’t going to work. I couldn’t get Flash to stream more than one YouTube video at the same time.

EDIT APRIL 12th: Example works again, thanks to some rather ugly patches. Have to bounce requests to-and-fro Flash and PHP to bypass the Flash Players security sandbox. I will repost the updated source code when I have some time to clean up the code.

EDIT APRIL 2nd: YouTube has made some changes (probably IP-related added security) to its code again, which was to be expected. Will look into possible solutions later this week. For now my demo is not able to stream any videos. Search and 3d code is still fine.

Still, I needed this feat rather urgently… So imagine my joy when I finally found a way to make things work!

multitubes

Ironically, the code that made my final attempt successful has been available for quite some time. As far back as October 2007 Shane McCartney made a custom YouTube API available on his “Lost in Actionscript” blog. Since his API circumvents the need for the AS2 YouTube player, it also bypasses the official players (intentional?) one-stream-at-a-time limit.1

Nevertheless there was still one last problem I had to solve. In order to retrieve a direct link to the FLV residing on its YouTube server McCartney makes use of an external script. This script retrieves the correct URL, to be fed to a NetStream instance, which plays the YouTube stream. The trouble is that there is no official way of doing this. You have to retrieve some data that YouTube uses to guide its streaming process. Which YouTube has no reason not to change, every now and then, causing McCartney’s 2007 script not to work any more.

Shane McCartney was kind enough to send me an e-mail rectifying the above:

“The YouTube API I have provided before there even really was one from YouTube has worked 100% for about 2 years now, I wrote the server side code in C#. The problems you talk of have been the PHP code other developers have supplied me.”

Also, I appear to have used an older version of his API. I will implement some changes to the code accordingly.

So there is no way of knowing if and when YouTube makes some changes and my adaptation of the PHP script breaks. But for the time being, my YouTube vids were, and still are, happily humming along.

If only I could have been contented with streaming the videos without further ado everything would have been fine. But I thought it might be fun to use the YouTube streams as Papevision3d textures. Thanks to some excellent examples it didn’t prove too hard either.2 :D

There they were, my videos, alive in 3d! As long as they didn’t leave the Adobe CS4 environment, that is. It appears that when you deploy a Papervision app which retrieves a video that does not reside on your server, BitmapData.draw() throws an unrecoverable security error. Now the only way to bypass the Flash security sandbox and distribute my Papervision 3d video wall is to publish it as an Adobe AIR application. Which is all fine and dandy but not the Flash demo I’d started out to code.

Hence it was back to the drawing board. Where I realized that Flash 10 has its own 3d (2.5d, really) API, making Papervisions BitmapData redundant for my small app. To save some time, I used code made available by Lee Brimelows, replacing his images by FLV Players. Now all that was left to do was to add a little code, tweak the odd parameter, and lo and behold, at last, a multiple YouTube Video streaming FLV quasi 3d video thingy sees the light!

Example
Link to the example, 2.5d (adaptation of Lee Brimelows Photo Panels) and search option thrown in for good measure: http://www.robinvanemden.dds.nl/

Source Files
Source Code (AS3/CS4) – Don’t forget to replace the placeholders with your own YouTube developer key in com/flashdynamix/services/YouTube.as. You also have to download & add the TweenLite tweening library. Now just publish, get yourself some popcorn, sit back and watch those movies stream along :)


  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • LinkedIn
  • RSS
  • Twitter
  1. While some people claim to be able to elude the limit using LocalConnections with unique IDs, I had little luck with this technique :(   [↩]
  2. References and Credits

    wall3d:
    http://www.thetconcept.com/ (!)

    http://pv3d.org/

    http://blog.papervision3d.org/

    http://papervision2.com/

    http://www.sebleedelisle.com/

    http://theflashblog.com/

    http://labs.blitzagency.com/

    based on http://pv3d.org/2009/01/11/tweening-rotated-planes-to-you/

    pv3d/flv:

    http://www.prlwytzkofsky.com/

    http://www.lessrain.com/

    http://www.greensock.com/

    youtube api:

    http://www.lostinactionscript.com/

    [↩]

Tags: , , , , , , , , ,

4 Responses to “Streaming Multiple YouTube Videos”

    • Thank you for your interest! Following up on your remark I have added a CS4 tag to the “Source Files” paragraph. Still, the multi-stream related code is to be found in PHP and AS files, and can be used sans Adobe Flash IDE.

      But the downloadable source code is an older version of my video wall though and will not be able to retrieve videos from YouTube.

      The following links should help you on the way though:

      http://www.longtailvideo.com/support/forum/Setup-Problems/13704/YouTube-streaming-stopped-working-

      http://ghalex.com/blog/download-a-movie-from-youtube-with-flex

      Adapted Alexandru Ghiura code as follows:

      private function download(siteUrl):void {
      loader = new URLLoader();
      videoID=parseURL(siteUrl);
      var serviceurl:String=mygetvideoUrl+”?video_id=”+videoID;
      var request:URLRequest=new URLRequest(serviceurl);
      request.method=URLRequestMethod.GET;
      loader.addEventListener(Event.COMPLETE, onDataLoad);
      loader.addEventListener(IOErrorEvent.IO_ERROR, onIOError);
      loader.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onSecurityError);
      loader.load(request);
      }
      private function onDataLoad(e:Event):void {
      var raw:String=URLLoader(e.target).data;
      var urlVariables:URLVariables=new URLVariables(raw);
      downloadVideo(escape(urlVariables['token']));
      }

      In combination with a proxy-like script you should be all set…

    Reply to this comment

    • Couldn’t open you file in CS3 because it is ofcourse… CS4.

      I have CS4 now, thanks, I hope I can finally learn something about youtube api and as3 and such.

    Reply to this comment

    • I just love your youtube-video-wall-thingy

      So I downloaded your source code, since Shane’s seems broken
      Also “installed” the tweenlite

      I have Flash CS3, but your Movie Panels.fla says unexpected file format.

      Do you have any clue?

    Reply to this comment

Leave a Reply