Getting Expression Encoder 2 SP1's media player template to work with CDNs and cross-domain embedding

The new Silverlight 2 media player that Expression Encoder 2 SP1 ships with is great. You can encode video and output Silverlight content in minutes. With SP1, when you select one of the new templates, the only bits generated are your video asset + thumbnail, a single media player .Xap file, and a sample .Html page.

This really cuts down on the moving parts from the previous 1.0 templates that had dependencies on so many loose JavaScript files.

I wanted to blog about my experience in case others ran into this: if you have your Xap files on a domain different than your pages, you might find that the Silverlight plugin is blank and the media player never loads. This is a by-design feature per the Silverlight HTML DOM bridge security model - but you can actually do a few things to get this to work.

I host my Silverlight applications and media assets on a separate domain. This creates the situation where the bridge is disabled; if you would like to reference the .Xap files from different sites or enable others to embed your video player, it won't work out of the box unless you modify the <object /> tag or modify and rebuild the managed media player to gracefully move on in this situation.

Here's the breakdown that I have for my web pages vs. my Silverlight assets, including the apps:

The additional parameter within the object tag will be easiest for most folks, and is probably the way that the Expression team hopes that you'll enable this scenario. I always forget things like modifying the object tags, since this isn't in the default generated HTML file that Encoder outputs, so I'm going for a more involved solution.

Oh, and don't get me wrong: SP1 rocks. I highly recommend that you install it; I'm getting so much more use out of Encoder 2 now. If you haven't purchased Encoder... well, you really should try or buy it. With SP1 it not only adds the nice Silverlight 2 templates, but also H.264 mobile encoding. I was able encode my screencast in H.264, and it looks great on my iPhone!

The HTML DOM Bridge security model in Silverlight

Per the DOM bridge security model in Silverlight 2, the default behavior when the .Xap is hosted on a domain different than your web page, is that the HTML DOM bridge feature will be disabled for that Silverlight application in the .Xap. The DOM bridge is used by the managed media player to get the document URI property when trying to look up relative-path video assets.

This situation can also present itself on the same domain, when the web page author explicitly denies the HTML DOM bridge access to a plugin: if the <param name="EnableHtmlAccess" value="false" /> tag is present in the object tag, the DOM bridge will not work and the media player template will end up throwing an exception while trying to access the HtmlPage.Document.DocumentUri property.

The quick fix

Inside your Silverlight plugin object tag, add the EnableHtmlAccess parameter with a value of 'true'. Here is a sample embedded object tag with the parameter added:

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="685" height="448">
     <param name="source" value="http://media.cdn.com/Xaps/MediaPlayerTemplate.xap" />
     <param name="initparams" value="expression encoder generated parameters go here" />
     <param name="enableHtmlAccess" value="true" />
</object>

The source fix

I decided to just update the media player to not be dependent on the HTML DOM bridge feature.

This fix assumes that you always provide the absolute URI for video assets in the playlist. Effectively it won't try any relative URI lookups when HTML DOM bridge access is not permitted.

Thanks to the Expression team, they did a good thing and shipped the source to the media player template with the product. You will find it in %programfiles%\Microsoft Expression\Encoder 2\Templates\en\SL2Standard\Source. It opens with Visual Studio 2008 SP1 + the Silverlight 2 Developer Tools.

I went ahead and rebuilt the template: whenever the C# code would try and use the HtmlPage.Document.DocumentUri getter, I would encase the code in an HtmlPage.IsEnabled check. I had to do this in just a few spots.

One nice side effect was that I was able to chop the .Xap size down about 50K by removing the Adaptive Streaming support built into the template, since I just host my media assets over simple HTTP and do not do streaming.

For your reference:

Download ModifiedTemplate.zip (69 K, solution in a Zip)
Download MediaPlayerTemplate.xap (114 K, Xap)
Note: Does not contain adaptive streaming support.

HtmlPage.IsEnabled lesson

You should always make sure to check the HtmlPage.IsEnabled property before attempting to access any of the HTML DOM bridge resources. This is good practice whether thinking about scenarios where the bridge is disabled, or designer tools like Cider and Blend.

Disclaimer: I am not a member of the Expression team, this is not my area of expertise, other than being a member of the original HTML DOM bridge feature crew for Silverlight. I do not know if this was a known issue before, an expected, by-design feature, will be fixed, or anything like that.

Live, embeddable player: Shawn Burke's PDC talk

Oh, and here's Shawn Burke's excellent PDC talk. If you haven't checked out everything that was released in the Silverlight Toolkit, or heard about the release model, you should watch this. It is using my updated Xap player, so you can even embed Shawn's talk in your own blog.

Hope this helps.