天天看點

Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋

前言:

最近幾天微軟Live Search公布了重新架構了的Live Search API(版本為2.0 Beta)

該API律屬于微軟的最新Live Search Service項目 – Silk Road(絲綢之路)

那麼如何在Silverlight中調用Live Search Service呢來進行網頁,圖檔,資訊等的搜尋呢?

本篇以及後面幾篇文章将帶大家走進Silverlight+Live Search的美妙世界

準備工作:

請到http://search.live.com/developers申請一個AppID,這個AppID是你通路Live Search的驗證資訊

Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋

用你的hotmail或者msn賬号登陸就可以申請了

(以前的Live Search API 1.1 的AppID申請也完成了他的使命,當然大家還可以繼續使用以前的AppID來通路1.1版本的Live Search Service啦)

另外大家可以下載下傳最新的SDK: Live Search SDK 2.0 Beta

該SDK包含了API以及示範例子的代碼(包括VB和C#版本)

Live Search 2.0共有三種通路協定:

  • JSON
  • XML
  • SOAP

在Live Search的這一系列文章中,我将一直使用SOAP協定來通路,因為其使用C#通路非常便捷

大家可以根據自己的項目的需要使用合适的協定

下面讓我們開始

  1. 建立一個Silverlight項目
  2. 添加一個Service Reference如下
Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋
Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋

其中Address中的位址格式如下:http://api.search.live.net/search.wsdl?AppID=你申請的AppID

點選Go,如果你輸入的位址正确而且有網絡連接配接,應該就能搜尋到和上圖一樣的LiveSearchService

填寫你希望的調用的Namespace并點選OK,等待數秒後會彈出如下視窗

Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋

不用管它,點OK就可以了

檢視下這個Service提供的對象接口

這裡面沒有LiveSearchService這個對象,也就是你下載下傳到的SDK中的通路LiveSearchService的方式以及不一樣了

(兩天前還有的,昨晚我再次嘗試的時候就沒有了,這樣做的原因相必是為了與WCF相容或者是已經采用WCF來提供Service接口了)

取而代之的是LiveSearchPortTypeClient,大家把它當成WebClient類似的東西就很容易領悟到它的調用方式了

也就是說最新的Document與最新提供的LiveSearchService的接口有些出入,不過我已經把這個問題解決

解決方案:

  • UI展示代碼如下:

Code

1     <UserControl.Resources>

2         <ControlTemplate x:Key="DefaultBtnTemplate" TargetType="Button">

3             <Border CornerRadius="8" x:Name="border">

4                 <Border.Background>

5                     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

6                         <GradientStop Color="#FFB2E09A"/>

7                         <GradientStop Color="#FF4E942F" Offset="0.7"/>

8                     </LinearGradientBrush>

9                 </Border.Background>

10                 <TextBlock Margin="{TemplateBinding Padding}" Foreground="White" Text="{TemplateBinding Content}" FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" HorizontalAlignment="Center" VerticalAlignment="Center"/>

11                 <vsm:VisualStateManager.VisualStateGroups>

12                     <vsm:VisualStateGroup x:Name="FocusStates">

13                         <vsm:VisualState x:Name="Focused"/>

14                         <vsm:VisualState x:Name="Unfocused"/>

15                     </vsm:VisualStateGroup>

16                     <vsm:VisualStateGroup x:Name="CommonStates">

17                         <vsm:VisualState x:Name="Normal"/>

18                         <vsm:VisualState x:Name="MouseOver">

19                         </vsm:VisualState>

20                         <vsm:VisualState x:Name="Pressed"/>

21                         <vsm:VisualState x:Name="Disabled"/>

22                     </vsm:VisualStateGroup>

23                 </vsm:VisualStateManager.VisualStateGroups>

24             </Border>

25         </ControlTemplate>

26     </UserControl.Resources>

27     <Grid x:Name="LayoutRoot" Background="#3c3c3c">

28         <Grid HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,10">

29             <Grid.RowDefinitions>

30                 <RowDefinition Height="Auto"/>

31                 <RowDefinition Height="Auto"/>

32                 <RowDefinition Height="Auto"/>

33             </Grid.RowDefinitions>

34             <Grid.ColumnDefinitions>

35                 <ColumnDefinition Width="Auto"/>

36                 <ColumnDefinition Width="Auto"/>

37             </Grid.ColumnDefinitions>

38             

39             <TextBox x:Name="KeywordsCtl" Width="400"/>

40             <Button x:Name="SearchBtnCtl" Content="Search" Padding="30,5" Margin="4,0,2,0" Template="{StaticResource DefaultBtnTemplate}" Grid.Column="1" Click="SearchBtnCtl_Click"/>

41             <TextBlock Foreground="White" Grid.Row="1" x:Name="WebNumCtl" Margin="2"/>

42             <ListBox x:Name="WebPanelCtl" Grid.Row="2" Grid.ColumnSpan="2" Margin="2,0" BorderThickness="0" Background="#3c3c3c" Height="500">

43                 <ListBox.ItemTemplate>

44                     <DataTemplate>

45                         <StackPanel Width="480">

46                             <HyperlinkButton Content="{Binding Title}" NavigateUri="{Binding OriginalUrl}" TargetName="_blank"/>

47                             <TextBlock TextWrapping="Wrap" Foreground="White" Text="{Binding Description}" Margin="0,2"/>

48                             <TextBlock Text="{Binding DisplayUrl}" Foreground="Green" FontSize="10"/>

49                         </StackPanel>

50                     </DataTemplate>

51                 </ListBox.ItemTemplate>

52             </ListBox>

53         </Grid>

54     </Grid>

KeywordsCtl用于搜尋詞的輸入

SearchBtnCtl為搜尋按鈕

WebNumCtl用來展示共搜尋到多少條新聞

WebPanelCtl用于展示得到的搜尋結果

其中WebPanelCtl用到了DataBinding(資料綁定)

  • 底層代碼:

Code

1 private void SearchBtnCtl_Click(object sender, RoutedEventArgs e)

2 {

3     LiveSearchPortTypeClient liveSearchClient = new LiveSearchPortTypeClient();

4     SearchRequest webRequest = new SearchRequest();

5     webRequest.AppId = "44980C5CFA65792B3CDFF33A5CBF2CFAD17E3349";

6     webRequest.Market = "zh-CN";

7     webRequest.Version = "2.0";

8     webRequest.Sources = new SourceType[] { SourceType.Web };

9     webRequest.Query = this.KeywordsCtl.Text.Trim();

10     webRequest.Options = new SearchOption[] { SearchOption.EnableHighlighting };

11     webRequest.Web= new LiveSearchServiceRef.WebRequest();

12     webRequest.Web.Count = 30;

13     webRequest.Web.CountSpecified = true;

14 

15     liveSearchClient.SearchAsync(webRequest);

16     liveSearchClient.SearchCompleted += new EventHandler<SearchCompletedEventArgs>(liveSearchClient_SearchCompleted);

17 }

18 

19 void liveSearchClient_SearchCompleted(object sender, SearchCompletedEventArgs e)

20 {

21     SearchResponse liveSearchResponse = e.Result;

22     LiveSearchServiceRef.WebResponse webResponse = liveSearchResponse.Web;

23     this.WebNumCtl.Text = String.Format("共{0}條搜尋結果",webResponse.Total);

24     List<WebInfo> m_webInfoList = new List<WebInfo>();

25     if (webResponse.Results.Length > 0)

26     {

27         foreach (WebResult webResult in webResponse.Results)

28         {

29             WebInfo webInfo = new WebInfo();

30             webInfo.Title = webResult.Title;

31             webInfo.Description = webResult.Description;

32             webInfo.PublishDateTime = webResult.DateTime;

33             webInfo.OriginalUrl = webResult.Url;

34             webInfo.DisplayUrl = webResult.DisplayUrl;

35             m_webInfoList.Add(webInfo);

36         }

37 

38         this.WebPanelCtl.ItemsSource = m_webInfoList;

39     }

40 }

SearchRequest用來定義AppID以及搜尋市場,使用的搜尋版本等

Query用于提供給LiveSearchService搜尋詞

Sources用來定義搜尋來源,目前共有

Image, InstantAnswer News PhoneBook RelatedSearch SpellCheck Web七種,美國市場還有AD

(注意:你在SearchRequest定義了哪幾種搜尋源,那麼SearchResponse的Response類型也就隻有那幾種)

代碼12,13行用于定義SearchResponse傳回多少條結果

LiveSearchPortTypeClient通過異步的方式調用初始化的SearchRequest

LiveSearchPortTypeClient将通過SearchCompleted這個事件回傳給用戶端查詢結果,也就是這裡的SearchResponse

38行将獲得的資料綁定給WebPanelCtl,這樣我們就得到了查詢的資訊了

其中WebInfo對象是用來存儲擷取的網頁資訊,其定義如下

WebInfo

1 namespace LiveSearchWeb4Silverlight

2 {

3     public class WebInfo

4     {

5         public string Title { get; set; }

6         public string Description { get; set; }

7         public string PublishDateTime { get; set; }

8         public string OriginalUrl { get; set; }

9         public string DisplayUrl { get; set; }

10     }

11 }

效果展示:

你可以在搜尋框中輸入些搜尋詞來得到結果

我的一些搜尋結果展示以及與Live Search的比較

Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋
Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋

源代碼下載下傳:

Silverlight專題(12) - 基于Silverlight的Live Search網頁搜尋