Deeplink Study Notes for Silverlight

The so-called deeplink technology is designed to solve the problem that RIA Web applications such as Silverlight (or flash) cannot be indexed by search engines and belongs to the SEO category.

Take the most common enterprise website as an example. There are enterprise profiles (about), product presentations (products), and contact us (aboutus )... if Silverlight/flash is used for the entire site, the default.html page will be embedded with an xap/swf, and the search engine will receive a page of default.html.

If we can use http://www.xxx.com/default.html#/About to switch Silverlight to an enterprise profile (about) scenario, we can use "... /default.html #/product switch to the product display module ".. /default.html #/product? Id = 123 "switch to the product ID = 123, which is very friendly to the search engine. It will think that this is a different URL, so as to include more pages.

Fortunately, it is very easy to implement this in Silverlight 3 (SL designers really think very well)

When creating a new project in vs2008Program"This type, create a try

 

Follow the instructions in the browser address bar to compile and run F5.

It can be found that it automatically becomes like http: // localhost: 19341/slnavtestpage. aspx #/home, the page title is automatically changed to "Homepage", and then click the "about" button. The address bar is changed to http: // localhost: 19341/slnavtestpage. aspx #/about, the page title is automatically changed to "about", and we still have a lineCodeNone of them are written. Isn't that exactly what we want?

If you want to manually achieve this effect, it is not difficult to create a new index. XAML control (or page) with the following content:

 

< Usercontrol X: Class = "Slnav. Index"
Xmlns = "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
Xmlns: x = "Http://schemas.microsoft.com/winfx/2006/xaml"  
Xmlns: navigation = "CLR-namespace: system. Windows. controls; Assembly = system. Windows. Controls. Navigation"  
Xmlns: urimapper = "CLR-namespace: system. Windows. Navigation; Assembly = system. Windows. Controls. Navigation"  
>

< Stackpanel Orientation = "Vertical" >

< Navigation: Frame X: Name = "Contentframe" Source = "/Home" Navigationfailed = "Contentframe_navigationfailed" Height = "300" Navigated = "Contentframe_navigated" >
< Navigation: frame. urimapper >
< Urimapper: urimapper >
< Urimapper: urimapping Uri = "" Mappeduri = "/Views/home. XAML" />
< Urimapper: urimapping Uri = "/{Pagename }" Mappeduri = "/Views/{pagename}. XAML" />
</ Urimapper: urimapper >
</ Navigation: frame. urimapper >
</ Navigation: Frame >

< Textblock X: Name = "Xuri" > </ Textblock >

</ Stackpanel >

</ Usercontrol >

The key lies in the <navigation: frame> .. </navigation: frame> control.It is a container used to jump between pages and automatically change the address bar.

A source attribute is critical and can be used to specify the displayed XAML page for navigation. For example, you can specify it as "/pages/about. XAML ", it will load/pages/about at runtime. XAML is displayed in the container, but some people may think this is too long and expose the directory structure of the website. If you can use "/about" to directly display "/pages/about. XAML "Good, no problem!

Note that the preceding <urimapper: urimapper>... <urimapper: urimapper> provides the address ing capability.! (Like urlrewriter)

<Urimapper: urimapping uri = "/{pagename}" mappeduri = "/views/{pagename}. XAML"/>

Indicates that the address "/ABC" will be automatically mapped to "/views/ABC. XAML", and the address "/about" will be automatically mapped to "/views/about. XAML"

After the ing rule is defined, the source attribute can be abbreviated as "/views/home. XAML"/home"

Note that if you define multiple mappings, arrange the order properly.

For example:

<Urimapper: urimapper>
<Urimapper: urimapping uri = "" mappeduri = "/views/home. XAML"/>
<Urimapper: urimapping uri = "/link/{ID}" mappeduri = "/views/link. XAML? Id = {ID} "/>
<Urimapper: urimapping uri = "/{pagename}" mappeduri = "/views/{pagename}. XAML"/>
</Urimapper: urimapper>

This is valid. Input ".. #/link/3" will be automatically mapped to "/views/link. XAML? Id = 3"

However, if the order is changed:

<Urimapper: urimapper>
<Urimapper: urimapping uri = "" mappeduri = "/views/home. XAML"/>
 <Urimapper: urimapping uri = "/{pagename}" mappeduri = "/views/{pagename}. XAML"/>

<Urimapper: urimapping uri = "/link/{ID}" mappeduri = "/views/link. XAML? Id = {ID} "/>
</Urimapper: urimapper>

This is invalid. ".. #/link/3" will never get the correct ing! Because the second red rule matches first, it will translate the valid part that this address can recognize into "/views/link. XAML ", as for the"/3 "behind it, it will be appended to the back as it is, and the final address obtained is"/views/link. XAML/3 ", because there is no link under/views. the XAML directory, so of course, the path cannot be found and an error occurs!

General principle: Write special rules first, and general rules later.

Another question is, navigate to something like "/product? After id = 123,How to accept parameters in Silverlight like request. querystring in Asp.netWhat about it?

You can perform the following operations in product. XAML. CS:

1
2 // Run the command when you navigate to this page.
3 Protected   Override   Void Onnavigatedto (navigationeventargs E)
4 {
5 Idictionary < String , String > _ Dicparm =   This . Navigationcontext. querystring;
6
7 If (_ Dicparm. containskey ( " ID " ))
8 {< br> 9 xparm. text = " product ID = " + _ dicparm [ " id " ];
10 }
11 }

 
Note that:Parameter names are case sensitive.That is,/product /? Id = 123 is not the same as/product/id = 123! (This is different from Asp.net)

Finally, let's take a look at the title and observe the XAML code automatically generated on the page in Silverlight:

1 < Navigation: Page X: Class = "Slnav. Views. Link"  
2 Xmlns = "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
3 Xmlns: x = "Http://schemas.microsoft.com/winfx/2006/xaml"  
4 Xmlns: d = "Http://schemas.microsoft.com/expression/blend/2008"
5 Xmlns: MC = "Http://schemas.openxmlformats.org/markup-compatibility/2006"
6 MC: ignorable = "D"
7 Xmlns: navigation = "CLR-namespace: system. Windows. controls; Assembly = system. Windows. Controls. Navigation"
8 D: designwidth = "640" D: designheight = "480"
9 Title = "Links" >

That's right. It's the title attribute!

How does Silverlight automatically set the title in XAML to the title of the HTML/aspx webpage during runtime?

In fact, I don't know the Internal principles either! However, after multiple tests, I found that the HTML code of the test page automatically generated by vs.net is

< Div ID = "Silverlightcontrolhost" >
< Object Data = "Data: Application/x-silverlight-2 ," Type = "Application/x-silverlight-2" Width = "100%" Height = "100%" >
< Param Name = "Source" Value = "Clientbin/slnav. xap" />
< Param Name = "Onerror" Value = "Onsilverlighterror"   />
< Param Name = "Background" Value = "White"   />
< Param Name = "Minruntimeversion" Value = "3.0.40624.0"   />
< Param Name = "Autoupgrade" Value = "True"   />
< 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" ALT = "Get Microsoft Silverlight" Style = "Border-style: none" />
</ A >
</ Object > < IFRAME ID = "_ Sl_historyframe" Style = "Visibility: hidden; Height: 0px; width: 0px; Border: 0px" > </ IFRAME > </ Div >

There is always a row <IFRAME ID= "_ Sl_historyframe"Style = "visibility: hidden; Height: 0px; width: 0px; Border: 0px"> </iframe>, however, Silverlight cannot automatically set the webpage title.The iframe id cannot be changed.It is estimated that Silverlight is fixed internally.

For more details, please add.

Reprinted, please indicate Yang Guo from the bodhi tree