Windows Phone开发(44):推送通知第二集——磁贴通知

前面我们说了第一个类型——Toast通知,这玩意儿不知大家是不是觉得很新鲜,以前玩.NET编程应该没接触过吧?

其实这东西绝对不复杂,只是刚接触的时候会有点莫名罢了,Toast通知和今天要说的磁贴通知,都有一个共同点,那就是格式都规定死了D。

本质就是向特定的URI地址POST一个XML文档罢了,相信很多人都会,如果你还不会,真的,要补一补基础课了。

 多说无益,还是快点切入主题,开门见水吧。

首先,我们要知道我们在服务器端要POST什么样的XML文档,来,一起来看看。

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <wp:Notification xmlns:wp="WPNotification">  
  3.   <wp:Tile ID="导航URI">  
  4.     <wp:BackgroundImage>正面背景图片</wp:BackgroundImage>  
  5.     <wp:Count>计数器</wp:Count>  
  6.     <wp:Title>正面标题</wp:Title>  
  7.     <wp:BackBackgroundImage>背面背景图片</wp:BackBackgroundImage>  
  8.     <wp:BackTitle>背面标题</wp:BackTitle>  
  9.     <wp:BackContent>背面内容</wp:BackContent>  
  10.   </wp:Tile>  
  11. </wp:Notification>  


前面关于磁贴的内容,大家有印象吧?

磁帖者,有正面的标题、背景图、计数器;背面有标题、背景图和正文。有印象就好,不用我打水口枪。

来吧,我们通过一个现场演练来体会体会吧。

先做服务器端,这回我选择用ASP.NET,不要告诉我你不会。

启动VS,建一个ASP.NET网站,然后,把default.aspx改造一下,如果你嫌生成的代码不好看,可以把文件删除,然后新建一个页面。

好了,页面布局嘛,我贴一下HTML就行了。

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  2.   
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4.   
  5. <html xmlns="http://www.w3.org/1999/xhtml">  
  6. <head runat="server">  
  7.     <title></title>  
  8. </head>  
  9. <body>  
  10.     <form id="form1" runat="server">  
  11.     <div>  
  12.         <div>  
  13.             目标URI:  
  14.             <asp:TextBox ID="txtURI" runat="server" Width="911px"></asp:TextBox>  
  15.         </div>  
  16.         <div>  
  17.             <table border="0">  
  18.                 <tr>  
  19.                     <td>正面背景:</td>  
  20.                     <td>  
  21.                         <asp:TextBox ID="txtBackImg" runat="server" Width="316px"></asp:TextBox></td>  
  22.                 </tr>  
  23.                 <tr>  
  24.                     <td>正面标题:</td>  
  25.                     <td>  
  26.                         <asp:TextBox ID="txtTitle" runat="server" Width="316px"></asp:TextBox>  
  27.                     </td>  
  28.                 </tr>  
  29.                 <tr>  
  30.                     <td>计数:</td>  
  31.                     <td>  
  32.                         <asp:TextBox ID="txtCount" runat="server" Width="313px"></asp:TextBox>  
  33.                     </td>  
  34.                 </tr>  
  35.                 <tr>  
  36.                     <td>背面背景:</td>  
  37.                     <td>  
  38.                         <asp:TextBox ID="txtBackBackImg" runat="server" Width="316px"></asp:TextBox>  
  39.                     </td>  
  40.                 </tr>  
  41.                 <tr>  
  42.                     <td>背面标题:</td>  
  43.                     <td>  
  44.                         <asp:TextBox ID="txtBackTitle" runat="server" Width="321px"></asp:TextBox>  
  45.                     </td>  
  46.                 </tr>  
  47.                 <tr>  
  48.                     <td>背面正文:</td>  
  49.                     <td>  
  50.                         <asp:TextBox ID="txtBackContent" runat="server" Width="309px"></asp:TextBox>  
  51.                     </td>  
  52.                 </tr>  
  53.             </table>  
  54.             <div style="margin-left:20px; margin-top:10px;">  
  55.                 <asp:Button ID="btnSend" runat="server" Text="发送" onclick="btnSend_Click" /></div>  
  56.         </div>  
  57.         <div style=" margin-top:20px;">  
  58.             <asp:TextBox ID="txtRes" runat="server" Height="155px" TextMode="MultiLine"   
  59.                 Width="729px"></asp:TextBox>  
  60.         </div>  
  61.     </div>  
  62.     </form>  
  63. </body>  
  64. </html>  


 

还是别少了后台代码。

  1. /* 
  2.  <?xml version="1.0" encoding="utf-8" ?> 
  3. <wp:Notification xmlns:wp="WPNotification"> 
  4.   <wp:Tile ID="导航URI"> 
  5.     <wp:BackgroundImage>正面背景图片</wp:BackgroundImage> 
  6.     <wp:Count>计数器</wp:Count> 
  7.     <wp:Title>正面标题</wp:Title> 
  8.     <wp:BackBackgroundImage>背面背景图片</wp:BackBackgroundImage> 
  9.     <wp:BackTitle>背面标题</wp:BackTitle> 
  10.     <wp:BackContent>背面内容</wp:BackContent> 
  11.   </wp:Tile> 
  12. </wp:Notification> 
  13.  
  14.  * 清除磁贴的属性值 
  15.  <?xml version="1.0" encoding="utf-8" ?> 
  16. <wp:Notification xmlns:wp="WPNotification"> 
  17.   <wp:Tile ID="导航URI"> 
  18.     <wp:BackgroundImage></wp:BackgroundImage> 
  19.     <wp:Count Action="Clear"></wp:Count> 
  20.     <wp:Title Action="Clear"></wp:Title> 
  21.     <wp:BackBackgroundImage Action="Clear"></wp:BackBackgroundImage> 
  22.     <wp:BackTitle Action="Clear"></wp:BackTitle> 
  23.     <wp:BackContent Action="Clear"></wp:BackContent> 
  24.   </wp:Tile> 
  25. </wp:Notification> 
  26.  
  27.  * HTTP标头 
  28.  X-WindowsPhone-Target: token 
  29. X-NotificationClass:1 
  30. 1 立即发送 
  31. 11 450秒发送 
  32. 21  900秒发送 
  33.   
  34.  */  
  35.   
  36. using System;  
  37. using System.Collections.Generic;  
  38. using System.Linq;  
  39. using System.Web;  
  40. using System.Web.UI;  
  41. using System.Web.UI.WebControls;  
  42.   
  43. using System.Net;  
  44. using System.Net.Mime;  
  45. using System.IO;  
  46. using System.Text;  
  47.   
  48.   
  49. public partial class _Default : System.Web.UI.Page  
  50. {  
  51.     protected void Page_Load(object sender, EventArgs e)  
  52.     {  
  53.   
  54.     }  
  55.     protected void btnSend_Click(object sender, EventArgs e)  
  56.     {  
  57.         HttpWebRequest request = (HttpWebRequest)WebRequest.Create(txtURI.Text);  
  58.         request.Method = WebRequestMethods.Http.Post;  
  59.         // 加上HTTP标头  
  60.         request.Headers.Add("X-WindowsPhone-Target""token");  
  61.         request.Headers.Add("X-NotificationClass""1");  
  62.         // 拼接内容,XML文档  
  63.         string Msg = "<?xml version=\"1.0\" encoding=\"utf-8\" ?>" +  
  64.                      "<wp:Notification xmlns:wp=\"WPNotification\">" +  
  65.                         "<wp:Tile>" +  
  66.                             "<wp:BackgroundImage>" + txtBackImg.Text + "</wp:BackgroundImage>" +  
  67.                             "<wp:Count>" + txtCount.Text + "</wp:Count>" +  
  68.                             "<wp:Title>" + txtTitle.Text + "</wp:Title>" +  
  69.                             "<wp:BackBackgroundImage>" + txtBackBackImg.Text + "</wp:BackBackgroundImage>" +  
  70.                             "<wp:BackTitle>" + txtBackTitle.Text + "</wp:BackTitle>" +  
  71.                             "<wp:BackContent>" + txtBackContent.Text + "</wp:BackContent>" +  
  72.                         "</wp:Tile>" +  
  73.                       "</wp:Notification>";  
  74.         byte[] buffer = Encoding.UTF8.GetBytes(Msg);  
  75.         request.ContentType = MediaTypeNames.Text.Xml;  
  76.         // POST数据要记得设置内容长度  
  77.         request.ContentLength = buffer.Length;  
  78.         // 写入流  
  79.         using (Stream stream = request.GetRequestStream())  
  80.         {  
  81.             stream.Write(buffer, 0, buffer.Length);  
  82.         }  
  83.         // 接收回应  
  84.         HttpWebResponse response = (HttpWebResponse)request.GetResponse();  
  85.         // 读出响应的HTTP头  
  86.         string headers = "";  
  87.         foreach (string key in response.Headers.AllKeys)  
  88.         {  
  89.             headers += key + " : " + response.Headers.Get(key) + "\r\n";  
  90.         }  
  91.         txtRes.Text = headers;  
  92.     }  
  93. }  


 

补充一下,上面代码中,前面的注释我已经写上了,其实MSDN上都有,我想很多人不看,我说一下,如果你打算清除磁贴某些属性的值,如标题等,这可以用以下的XML文档。

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <wp:Notification xmlns:wp="WPNotification">  
  3.   <wp:Tile ID="导航URI">  
  4.     <wp:BackgroundImage></wp:BackgroundImage>  
  5.     <wp:Count Action="Clear"></wp:Count>  
  6.     <wp:Title Action="Clear"></wp:Title>  
  7.     <wp:BackBackgroundImage Action="Clear"></wp:BackBackgroundImage>  
  8.     <wp:BackTitle Action="Clear"></wp:BackTitle>  
  9.     <wp:BackContent Action="Clear"></wp:BackContent>  
  10.   </wp:Tile>  
  11. </wp:Notification>  

重点就是,Action="Clear",但要注意,磁贴正面的背景图不能清除。

好,再来新建一个WP应用,这回要做客户端。

直接新建即可,XAML文档不用改,因为我们不需要界面设计了,直打开后台代码吧。

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Net;  
  5. using System.Windows;  
  6. using System.Windows.Controls;  
  7. using System.Windows.Documents;  
  8. using System.Windows.Input;  
  9. using System.Windows.Media;  
  10. using System.Windows.Media.Animation;  
  11. using System.Windows.Shapes;  
  12. using Microsoft.Phone.Controls;  
  13.   
  14. using Microsoft.Phone.Notification;  
  15.   
  16. namespace WPClient  
  17. {  
  18.     public partial class MainPage : PhoneApplicationPage  
  19.     {  
  20.         // 构造函数  
  21.         public MainPage()  
  22.         {  
  23.             InitializeComponent();  
  24.             HttpNotificationChannel Channel = null;  
  25.             // 通道名,随便弄一个,不要与其它应用程序重复  
  26.             string Channel_Name = "TileNoftification";  
  27.             // 在现有的通道里面找找,看能不能找着?  
  28.             Channel = HttpNotificationChannel.Find(Channel_Name);  
  29.             if (Channel == null)  
  30.             {  
  31.                 // 找不到,那就新建一个呗  
  32.                 Channel = new HttpNotificationChannel(Channel_Name);  
  33.                 // 打开通道前要先注册事件处理,为什么?自己想一下吧  
  34.                 // 就是因为ChannelUriUpdated事件,如不这样,  
  35.                 // 当第一次获取URI时你就得不到更新通知  
  36.                 Channel.ChannelUriUpdated += new EventHandler<NotificationChannelUriEventArgs>(Channel_ChannelUriUpdated);  
  37.                 // 出事了,总得向上级汇报一下吧?  
  38.                 Channel.ErrorOccurred += new EventHandler<NotificationChannelErrorEventArgs>(Channel_ErrorOccurred);  
  39.                 // 登记注册完毕,着手办喜事  
  40.                 Channel.Open();  
  41.                 // 办喜事别忘记了发请帖啊,调用BindToShellTile  
  42.                 Channel.BindToShellTile();  
  43.             }  
  44.             else  
  45.             {  
  46.                 // 如果找到了通道,还是要注册一下事件  
  47.                 // 老夫妻也可以再拍一回婚纱照吧?  
  48.                 Channel.ChannelUriUpdated+=new EventHandler<NotificationChannelUriEventArgs>(Channel_ChannelUriUpdated);  
  49.                 Channel.ErrorOccurred+=new EventHandler<NotificationChannelErrorEventArgs>(Channel_ErrorOccurred);  
  50.                 // 把住址告诉人家,相册做好之后,数码冲印店送货上门  
  51.                 System.Diagnostics.Debug.WriteLine("URI: {0}", Channel.ChannelUri.ToString());  
  52.             }  
  53.         }  
  54.   
  55.         void Channel_ErrorOccurred(object sender, NotificationChannelErrorEventArgs e)  
  56.         {  
  57.             // 向上级汇报一下错误  
  58.             Dispatcher.BeginInvoke(() =>  
  59.                 {  
  60.                     MessageBox.Show(e.Message);  
  61.                 });  
  62.         }  
  63.   
  64.         void Channel_ChannelUriUpdated(object sender, NotificationChannelUriEventArgs e)  
  65.         {  
  66.             // 搬家了记得通知一下大家新住址  
  67.             Dispatcher.BeginInvoke(() =>  
  68.                 {  
  69.                     System.Diagnostics.Debug.WriteLine("URI: {0}", e.ChannelUri.ToString());  
  70.                 });  
  71.         }  
  72.     }  
  73. }  


 

先动行WP端,当然,同时运行两个都可以了。

在“输出”窗口中,把这个URI复制到服务器端的网页上。

接着,按模拟器的“开始”按钮,来到“开始”屏幕,向右滑动,看到应用程序列表,在本应用程序上长按,从弹出的菜单中选“固定到开始屏幕”.

然后,回到服务器端页面,填好所有参数,点击“发送”。看结果。

都看到效果了?

图片可以自己准备,png格式,173*173,随便用画图工具搞两下就行了,只是为了测试,把图片加到项目后,设置以下属性就行了。

原文地址:https://www.cnblogs.com/songtzu/p/2607088.html