如何在ASP.NET中使用Windows Live Web Bar

前言

Messenger Platform 团队将在 Mix 09 上推出新的 Windows Live Messenger Web Toolkit 和 Web Bar 控件,其中Web Bar控件包含完整的 Messenger 体验,功能包括:
    联系人列表 — 管理、搜索、发起对话,还支持 Favorites 联系人;
    对话列表 — 用户切换、管理活动对话;
    用户区 — 显示用户状态,并允许用户更新信息,;
    跨页导航 — 能在站内切换页面的同时,保持 Windows Live Messenger 的登录状态
   Web Bar Control 将会显示在网站的底部,从各个方面来看很类似 Facebook Chat 功能。

若网站已经整合 Web Bar 控件,访客即可通过 Windows Live Messenger 用户熟悉的界面发起对话。同时,所有访问该站点的访客都可通过该控件进行交互,甚至不必加入对方好友列表就可聊天,还能通过客户端。

网站管理员可以将 Web Bar 作为独立的控件使用,也可对 Web Toolkit 扩展开发,当然,也可以通过 CSS 定制自己的应用样式,以及提供大量的设置项。目前为止,微软官方已经大量使用了 Messenger Library,就已推出的 Windows Live Messenger Web Toolkit 和 Web Bar 意味着什么?就目前的信息来看,这两款新控件所做的就是帮助站长增强网站的交互性,提高网站黏度,毕竟即时聊天的优势还是不容轻视的。

w1

本文将介绍如何容易的将Web Bar整合到自己的网站中。

 

首先,下载Windows Live™ Messenger Web Toolkit SDK

可以在这个网站中下载应用程序的所有示例代码:http://messenger.mslivelabs.com/

只需下载sample code即可:http://messenger.mslivelabs.com/Samples.zip

sshot-1

 

其次,在Windows Azure development portal中获取application ID 和 secret Key

 

    首先,使用Windows Live帐号登录到Azure,

      
    当你登录到Azure后,你需要新建一个项目,在IE 左上角可以看到一个“新建项目的(New Project )”超链接。

      
    点击链接进去后,你可以看到4种不同类型的项目,这里我们选择最下面的“Live Services: Existing APIs”申请注册。

      
    在注册表单中请填写项目名称,以及在网络有效的域名,请注意,这里的填写的域名必须在网络上真实存在。返回的地址是登录成功后Windows Live返回的地址,。

填写完后,点击创建按钮。如果创建成功,我们将得到Azure提供的application ID 和 secret Key。

 

 

最后,整合到您的ASP.NET网站

首先用Visual Studio2008或者2005创建一个Asp.Net网站,如果你没有下载Windows Live™ Messenger Web Toolkit SDK的示例,那么你需要有一个Privacy.htm页面和一个Channel.htm页面,这里我们可以按照我们下载好的Windows Live™ Messenger Web Toolkit SDK教程中完全相同的代码来做,教程的示例在?:\\?\Samples\WebToolkit\GettingStarted\CSharp里面。

第一步是打开Web.config文件,在AppSettings节中配置我们获取的application ID( 应用程序ID) 和 secret Key(密钥 )。

sshot-6

再打开Default.aspx,

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="DefaultPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:msgr="http://messenger.live.com/2009/ui-tags">
<head>
    <title>Get Started with the Windows Live Messenger Web Toolkit</title>
    <script type="text/javascript" src="http://www.wlmessenger.net/api/3.0/loader.js"></script>
    <script type="text/javascript">
        Microsoft.Live.Core.Loader.load(['Messenger.UI', 'Messenger.UI.Styles.Core'], null);
    </script>
    <style type="text/css">html, body{font-family: Verdana, Arial, Tahoma;margin: 0px;   } .content { margin-left: 10px;}</style>
</head>
<body>
    <!-- Initialize the application -->
    <msgr:app 
        id="appTag" 
        application-verifier-token="<%= ApplicationVerifier %>"         
        privacy-url="Privacy.html"
        channel-url="Channel.html"
        token-url="RefreshMessengerToken.aspx">
    </msgr:app> </body>
</html>
在上述HTML代码中,我们引用了最新的Windows Live 3.0的API ,并使用Load方法加载初始化,
    <script type="text/javascript" src="http://www.wlmessenger.net/api/3.0/loader.js"></script>
    <script type="text/javascript">
        Microsoft.Live.Core.Loader.load(['Messenger.UI', 'Messenger.UI.Styles.Core'], null);
    </script>
其次,在页面中还增加了一个XML架构链接,
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:msgr="http://messenger.live.com/2009/ui-tags">

这个架构可以使我们在页面中使用<msgr:>标签来显示即时通讯的用户界面,比如Web Messenger的<msgr:app>标记。

    <msgr:app 
        id="appTag" 
        application-verifier-token="<%= ApplicationVerifier %>"         
        privacy-url="Privacy.html"
        channel-url="Channel.html"
        token-url="RefreshMessengerToken.aspx">
    </msgr:app>   

在<msgr:app>的链接中,我们可以看到privacy-url属性链接到频道页面, channel-url属性链接到隐私页面,而token-url链接到应用程序的验证页面(RefreshMessengerToken.aspx),

RefreshMessengerToken.aspx页面将通过Windows Live服务验证您的Windows Azure development portal申请是否有效以及从本机删除COOKIE,以及登出等所有事情,具体代码如下:

   1: <%@ Page Language="C#" %>
   2: <%@ Import Namespace="WindowsLive" %>
   3:  
   4: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   5:  
   6: <!--
   7:      Copyright (c) Microsoft Corporation.  All rights reserved.
   8: -->
   9:  
  10: <script runat="server">
  11:     /*
  12:      * Configuration:
  13:      * The minimum requirement is to specify the application id and application secret in web.config
  14:      * Refer to the boolean constructor of the WindowsLiveLogin for additional configuration options.
  15:      */
  16:  
  17:     /// <summary>
  18:     /// The name of the consent token cookie
  19:     /// </summary>
  20:     private const string ConsentTokenCookieName = "msgr-consent-token";
  21:  
  22:     /// <summary>
  23:     /// The name of the delegation token cookie
  24:     /// </summary>    
  25:     private const string DelegationTokenCookieName = "msgr-delegation-token";
  26:  
  27:     /// <summary>
  28:     /// Current consent token that is stored in the conset cookie
  29:     /// </summary>
  30:     private string consentToken = null;
  31:  
  32:     /// <summary>
  33:     /// Provides token processing functionality
  34:     /// </summary>
  35:     private WindowsLiveLogin windowsLiveLogin;
  36:  
  37:     /// <summary>
  38:     /// Occurs when the page loads
  39:     /// </summary>
  40:     /// <param name="sender"></param>
  41:     /// <param name="e"></param>
  42:     
  43:     private void Page_Load(object sender, EventArgs e)
  44:     {               
  45:         try
  46:         {
  47:             if (IsConsentCookieAvailable())
  48:             {
  49:                 RefreshDelegatedAuthenticationCookie();
  50:             }
  51:         }
  52:         catch (Exception ex)
  53:         {
  54:             HandleException(ex);
  55:         }
  56:     }
  57:  
  58:     /// <summary>
  59:     /// Tests whether the consent token cookie is available
  60:     /// </summary>
  61:     /// <returns>'true' if the consent token cookie is available</returns>
  62:     private bool IsConsentCookieAvailable()
  63:     {
  64:         HttpCookie consentTokenCookie = Request.Cookies[ConsentTokenCookieName];
  65:         
  66:         if (consentTokenCookie == null)
  67:         {
  68:             return false;
  69:         }
  70:  
  71:         this.consentToken = consentTokenCookie.Value;
  72:  
  73:         return !string.IsNullOrEmpty(this.consentToken);
  74:     }
  75:  
  76:     /// <summary>
  77:     /// Refreshes the token
  78:     /// </summary>
  79:     private void RefreshDelegatedAuthenticationCookie()
  80:     {
  81:         this.windowsLiveLogin = new WindowsLiveLogin(true);        
  82:         WindowsLiveLogin.ConsentToken token =
  83:             this.windowsLiveLogin.ProcessConsentToken(this.consentToken);        
  84:         bool expireDelegationToken = false;
  85:  
  86:         if (token == null)        
  87:         {
  88:             expireDelegationToken = true;
  89:         }        
  90:         else
  91:         {
  92:             if (!token.IsValid())
  93:             {
  94:                 if (token.Refresh())
  95:                 {
  96:                     UpdateDelegatedAuthenticationCookie(token);
  97:                 }
  98:                 else
  99:                 {
 100:                     expireDelegationToken = true;
 101:                 }
 102:             }
 103:             else if (!IsDelegationTokenCookiePresent())
 104:             {
 105:                 UpdateDelegatedAuthenticationCookie(token);
 106:             }
 107:         }
 108:  
 109:         if (expireDelegationToken)
 110:         {
 111:             ExpireDelegatedAuthenticatonCookie();
 112:         }
 113:     }
 114:     
 115:     /// <summary>
 116:     /// Updates the cookies with a refreshed token
 117:     /// </summary>
 118:     /// <param name="token">The refreshed token</param>
 119:     private void UpdateDelegatedAuthenticationCookie(WindowsLiveLogin.ConsentToken token)
 120:     {
 121:         HttpCookie delAuthCookie = new HttpCookie(DelegationTokenCookieName);
 122:         delAuthCookie.Value = token.DelegationToken;
 123:         delAuthCookie.Path = "/";
 124:         Response.Cookies.Add(delAuthCookie);
 125:  
 126:         HttpCookie consentCookie = new HttpCookie(ConsentTokenCookieName);
 127:         consentCookie.Value = token.Token;
 128:         consentCookie.Path = "/";
 129:         Response.Cookies.Add(consentCookie);
 130:     }
 131:         
 132:     /// <summary>
 133:     /// Expires the delegation token cookie
 134:     /// </summary>
 135:     private void ExpireDelegatedAuthenticatonCookie()
 136:     {
 137:         ExpireCookie(DelegationTokenCookieName);
 138:     }
 139:     
 140:     /// <summary>
 141:     /// Expires a given cookie
 142:     /// </summary>
 143:     /// <param name="cookieName">The name of the cookie to expire</param>
 144:     private void ExpireCookie(string cookieName)
 145:     {
 146:         HttpCookie cookie = new HttpCookie(cookieName);
 147:         cookie.Expires = DateTime.Now.AddYears(-1);
 148:         cookie.Path = "/";
 149:         Response.Cookies.Add(cookie);
 150:     }
 151:  
 152:     /// <summary>
 153:     /// Checks if the delegation token cookie is present
 154:     /// </summary>
 155:     /// <returns>'true' is returned if the delegation cookie is present</returns>
 156:     private bool IsDelegationTokenCookiePresent()
 157:     {
 158:         HttpCookie cookie = Request.Cookies[DelegationTokenCookieName];
 159:         return cookie != null && !string.IsNullOrEmpty(cookie.Value);
 160:     }
 161:     
 162:     private void HandleException(Exception e)
 163:     {
 164:         // The application should log the exception as it may be caused due to a configuration issue
 165:     }
 166:     
 167: </script>
 168:  
 169: <html xmlns="http://www.w3.org/1999/xhtml">
 170: <head runat="server">
 171:     <title></title>
 172: </head>
 173: <body>
 174:     <form id="form1" runat="server">
 175:     <div>
 176:     
 177:     </div>
 178:     </form>
 179: </body>
 180: </html>

在Default.aspx中的最下面,还有一个<msgr:bar></msgr:bar>标记,这个标记将在我们的网页底部显示即时通讯的Messenger Web Bar。。最后,在Default.aspx的代码隐藏文件有一个服务端的变量,它将取出Web.config中的数据。此外,在App_Code文件夹中的WindowsLiveLogin.cs是网站的登录助手。

 

第一次登陆测试

第一次打开网站,我们可以看到在网页的下边

sshot-7

点击登录链接( “Sign in” )

 

sshot-9

 

完毕!

posted @ 2009-04-30 17:51  真见  阅读(2125)  评论(1编辑  收藏  举报