Crossdomain Video Snapshot - Fixing BitmapData.draw() Security Sandbox Violation


Developer Side / Tutorials / AS3

So just like everybody else that tried to take a cross-domain snapshot of a streaming video, I encountered this Security Sandbox Violation thingy. It was frustrating (for me) to find a fix for this because I'm not very familiar with FMS (Flash Media Server) so it took me a couple of hours to come up with a working solution. Here are all the steps I took in order to draw that dadgum bitmap (just moved to Texas so get used to the 'dadgums')

Step 1 - Setting up your Cross-Domain policy

What is the Cross-Domain policy you ask? Here's the Adobe explanation: A cross-domain policy file is an XML document that grants a web client—such as Adobe Flash Player (though not necessarily limited to it)—permission to handle data across multiple domains. When a client hosts content from a particular source domain and that content makes requests directed towards a domain other than its own, the remote domain would need to host a cross-domain policy file that grants access to the source domain, allowing the client to continue with the transaction. Policy files grant read access to data as well as permit a client to include custom headers in cross-domain requests. Read full article here

So, create a new XML file, name it crossdomain.xml, add the following code:

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM
"http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">

<cross-domain-policy>
    <allow-access-from domain="*" to-ports="*"/>
</cross-domain-policy>

* - wildcard
For a complete list of all XML definitions allowed inside a crossdomain policy file click here.

Now, save your file and uploaded to your server in the root site directory. For the purpose of this example, we'll name our domain www.mydadgumwebsite.com therefore your file should be accessible at http://www.mydadgumwebsite.com/crossdomain.xml

Here comes the first Actionscript code:

Security.allowDomain("www.mydadgumwebsite.com"); //in order to successfully connect to our policy
Security.loadPolicyFile("www.mydadgumwebsite.com/crossdomain.xml");

..and we have successfully added our policy file.

Step 2 - How to take the snapshot - assuming you didn't have the code already

I'm not gonna try to act like I can re-invent the weel here so here's a simple tutorial on this: How to take a BitMap snapshot of an FLV

Also here's a cool jpg and png encoder(among other things): as3corelib. To install it you'll find all the include files under /com/adobe/ So from there it is just a matter of putting in your as3 code: import com.adobe.pathToEncoderFile

Step 3 - Setting up Flash Media Server
This example is for Flash Media Server 3 on a Windows OS so it may not be exactly the same on other FMS versions or different OS's

Ok, this is the last step. Let's do it for the VOD (video on demand) section of the FMS.

The vod section is found under root\Program Files\Adobe\Flash Media Server 3\applications\vod Now, in this folder there are a bunch of files but the only two that we're interested in are Application.xml and main.asc When I first did this, I noticed that there was no main.asc file in my vod folder but you can always copy the one from root\Program Files\Adobe\Flash Media Server 3\samples\applications\vod

» Modifying Application.xml

Inside the <Client> tag add the following child:

<Access>
    <VideoSampleAccess enabled="true">/</VideoSampleAccess>
</Access>

Other siblings should be <Bandwidth> and/or <MsgQueue>

» Modifying main.asc

If you copied the file from the samples folder then under the application.onConnect function there's a commented line that says: p_client.videoSampleAccess = "/"; Remove the comments, save the file and you're good to go. This means we allow raw video access to all the streams found inside the vod folder. To see a full documentation on the FMS Client Class click here.

Now restart your dadgum Flash Media Server and enjoy the sweet snapshot capabilities. Hope it helped...

 

Article by
Alexandru Trican
Senior Programmer
www.theBluePipe.com

Added on Thur, Jan 14 2010 - 9:32:53 PM CST

people like this