zoukankan      html  css  js  c++  java

  • Windows Phone开发（44）：推送通知第二集——磁贴通知

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

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

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

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

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

    [html] view plaincopyprint?
    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就行了。

    [html] view plaincopyprint?
    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>  


     

    还是别少了后台代码。

    [csharp] view plaincopyprint?
    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文档。

    [html] view plaincopyprint?
    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文档不用改，因为我们不需要界面设计了，直打开后台代码吧。

    [csharp] view plaincopyprint?
    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，随便用画图工具搞两下就行了，只是为了测试，把图片加到项目后，设置以下属性就行了。
  • 相关阅读:
    CSS换行和省略号
    html+canvas实现很真实的下雨雨落
    CSS取消鼠标点击事件
    js某时间与当前时间差
    uniapp微信小程序canvas隐藏
    canvas生成圆图和微信小程序canvas圆图
    uniapp微信小程序canvas绘图插入网络图片不显示
    uniapp微信小程序分享（朋友圈分享）
    关于sure 等同根词的演化
    Stress and rhythm in English pronunciation
  • 原文地址：https://www.cnblogs.com/songtzu/p/2607088.html
Copyright © 2011-2022 走看看