Silverlight Streaming Development Considerations

Switch View

Collapse All

There are several key issues to consider when designing Silverlight applications for Silverlight Streaming. This topic discusses the nature of the Silverlight Streaming hosting environment, and presents workarounds for some key constraints.

Cross-Domain Issues

Application code for Silverlight Streaming applications must reside on the Silverlight Streaming server, separate from the hosting web page. Because the hosting page and the application code are in different domains, interaction between the application and the hosting web page is limited to passing initialization strings at load time. All other interaction involves streaming data between the Silverlight Streaming server, and the embedded Silverlight control on the hosting page.

Passing Initialization Parameters to Silverlight Streaming applications using Silverlight v1.0

Use the initParams parameter to pass initialization data at load time. Create an "OnLoad" script to handle this data at load time. Call the script from the XAML file by specifying the function name in the the Loaded attribute of the root <Canvas> element. Note that using the <onLoad> element in manifest.xml will supersede this, so omit <onLoad> when using the Loaded attribute. For example, the following code passes a string containing the current date and time:
```
function createMySilverlightControl()
{
    var myDate = new Date();
    Silverlight.createHostedObjectEx(
    {source: "streaming:/XXXXX/HelloWorld",
    parentElement: document.getElementById("mySilverlightControlHost"),
    initParams: [myDate]});
}
```
The initParams parameter takes multiple string values, separated by a comma. The control object stores the data as an array named the initParams property.

To handle the data, get the value of the initParams property of the control object. In the following example, this string is used to create a new XAML element.

function hwOnLoad(sender)

{    
    // Retrieve a reference to the control.
    var control = sender.getHost();
    
    // Get the parameter.
    var params = control.initParams;
    
    // Define a XAML fragment and create it.
    var xamlFragment = '';
    textBlock = control.content.createFromXaml(xamlFragment);

    // Add the XAML fragment as a child of the root Canvas object.
    sender.children.add(textBlock);

Passing Initialization Parameters to Silverlight Streaming applications using Silverlight v1.1

As with the 1.0 version, use the initParams parameter to pass initialization strings to the application at load time. When writing a Silverlight 1.1 application, pass the initParam values as key-value pairs, enclosed in quotation marks and separated by commas (i.e. ["key01=value01", "key02=value02"]). Note that the value of the key-value pair cannot contain any spaces, and should be escaped, as shown in the following example:
```
function createSilverlightControl()
{
    var myDate = new Date();
    var myDateStr = escape(myDate.toString());
    var init = 'init=' + myDateStr;
    Silverlight.createHostedObjectEx(
    {source: "streaming:/XXXXX/HelloWorld",
    parentElement: document.getElementById("mySilverlightControlHost"),
    initParams: ["myKey=theValue", myDate]});
}
```

Use the IDictionary object to capture the initParam values. In order to use IDictionary, a reference to System.Collections.Generic is required. The following C# code example shows how to do this:

// Get the startup arguments (passed from the hosting web page).
IDictionary<string, string> startupArguments = WebApplication.Current.StartupArguments;

// Create a string for the startup argument by referencing the key.
string strText = startupArguments["myKey"];

You've Been Iframed!

When a Silverlight object is created in a traditionally hosted (i.e. non-streamed) web page, HTML code for the containing <object> tag is rendered within the containing <div> element. However when the same application is hosted in Silverlight Streaming, the <object> tag is nested within additional elements.

The following example shows the structure of the live source code for HelloWorld.htm, as it appears within a non-streamed web page:

<html>
   <head>...</head>
   <body>
      <div id="mycontrol">
         <object>
            <!-- params -- >
         </object>
      </div>
    </body>
    <script>..</script>
</html>

Now compare that with the following example, which shows the structure of the live source code for HelloWorld.htm, as it appears when hosted in Silverlight Streaming:

<html>
   <head>...</head>
   <body>
      <div id="mycontrol">
         <iframe>
            <html>
               <head>...</head>
               <body>
                  <div id="aghostDiv">
                     <object id="bl2">
                        <!-- params -- >
                     </object>
                  </div>
               </body>
            </html>
         </iframe>
      </div>
   </body>
   <script>...</script>
   <script>...</script>
</html>