Embedding SilverLight XAP in Blogger

I just thought of showing my simple "Lights On" puzzle in my blog. I hosted my XAP file in Google sites and tried adding it in <object> tag, like adding in a normal HTML file as shown below.

<object id="SL" data="data:application/x-silverlight," type="application/x-silverlight-2" 
style="width: 550px; height: 280px">
<param name="source" value="https://sites.google.com/site/rajganeshmountbatton/home/blogspotdocuments/25SquarePuzzle.xap" />
<param name="minRuntimeVersion" value="3.0.40624.0" />
<param name="enableHtmlAccess" value="true" />
<param name="initParams" value="someParam=value" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" style="border-style: none"
alt="Get Microsoft Silverlight" />
</a>
</object>

The above code looks good and every one expects it to work fine. But in real, it just displays a white blank SilverLight application. This is an expected behavior of SilverLight and Timheuer talks about the solution in this link.

The solution is to map proper XAP MIME Type, adding few changes in AppManifest.xml file and adding the below param tag inside the object tag as shown below.

Below code block is the change to be done in AppManifest.xml file.

<Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
ExternalCallersFromCrossDomain="ScriptableOnly">
<Deployment.Parts>
</Deployment.Parts>    
</Deployment>

Param change in object tag

<param name="enableHtmlAccess" value="true" />

AppManifest and Param changes are in our hands and can be modified, but mapping proper MIME type for SilverLight application in Google site cannot be done. Other options are like hosting your SilverLight application in some other MIME configurable hosting provider. But there are no better free SilverLight hosting provider available. Any other options? I heard about Google app engine. So thought of trying to use app engine as host.

Here is good post about embedding SilverLight in app engine. I followed the same and hosted my application in app engine. Then changed the source attribute in the object tag to the app engine URL. What a surprise, the application worked like charm.

Below is the code after hosting in the Google App Engine.

<object id="SL" data="data:application/x-silverlight," type="application/x-silverlight-2" 
style="width: 550px; height: 280px">
<param name="source" value="http://rajganeshsilverlight.appspot.com/25SquarePuzzle.xap" />
<param name="minRuntimeVersion" value="3.0.40624.0" />
<param name="enableHtmlAccess" value="true" />
<param name="initParams" value="someParam=value" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" style="border-style: none"
alt="Get Microsoft Silverlight" />
</a>
</object>

Here is the link to my hosted SilverLight application blog. Enjoy the Light On application and try lighting up 25 squares.