(window.slotbydup=window.slotbydup || []).push({
id: '2014386',
container: s,
size: '234,60',
display: 'inlay-fix'
&&|&&0次下载&&|&&总10页&&|
您的计算机尚未安装Flash，点击安装&
阅读已结束，如需下载到电脑，请使用积分（）
下载：5积分
1人评价10页
0人评价10页
0人评价10页
0人评价42页
0人评价10页
所需积分：（友情提示：大部分文档均可免费预览！下载之前请务必先预览阅读，以免误下载造成积分浪费！）
（多个标签用逗号分隔）
文不对题，内容与标题介绍不符
广告内容或内容过于简单
文档乱码或无法正常显示
文档内容侵权
已存在相同文档
不属于经济管理类文档
源文档损坏或加密
若此文档涉嫌侵害了您的权利，请参照说明。
我要评价：
下载：5积分&&&&&&&&&&&&mui—让HTML5达到原生体验的高性能框架 崔红保
正在努力加载播放器，请稍等…
正在努力加载播放器
大小：750.86KB&&所需金币：50
&& & 金币不足怎么办?
下载量：-次 浏览量：245次
贡献时间： 11:24:05
文档标签：
已有-位用户参与评分
同类热门文档
你可能喜欢
看过这篇文档的还看过
阅读:10791&&下载:499
阅读:4074&&下载:196
阅读:7610&&下载:120
阅读:1446&&下载:95
阅读:1622&&下载:67
阅读:1208&&下载:47
阅读:1310&&下载:38
阅读:6621&&下载:31
阅读:1065&&下载:8
阅读:823&&下载:4
该用户的其他文档
所需财富值：
50文件大小：750.86KB
您当前剩余财富值：&&
举报该文档含有违规或不良信息。
反馈该文档无法正常浏览。
举报该文档为重复文档。
举报该文档侵犯版权。
例: /help.shtmlSignalR+HTML5实现消息推送及Android通知栏消息 - lordwish的专栏 - CSDN博客
SignalR+HTML5实现消息推送及Android通知栏消息
最近在研究使用SignalR实现跨平台的消息中心，WebAPI+SignalR作为数据接口和消息中心，客户端包含WPF桌面应用、Web应用和Android移动应用。这其中关键的功能点在于接收到实时消息后的通知提醒，桌面应用和Web应用实现相对简单，Android移动应用开发由于没有相关经验所以花费了一些时间。
Windows 10 proffesional
HBuilder8.8.0
Android4.2/7.0
服务端的开发有了前面的经验已经驾轻就熟了，包含三个简单方法：上线提醒、下线提醒、消息发送，代码如下：
public class MessageHub : Hub
public override Task OnConnected()
Clients.Others.listen("[" + DateTime.Now.ToString("yyyy/MM/dd hh:mm:ss") + "]:" + Context.ConnectionId + ",上线了！");
return base.OnConnected();
public override Task OnDisconnected(bool stopCalled)
Clients.Others.listen("[" + DateTime.Now.ToString("yyyy/MM/dd hh:mm:ss") + "]:" + Context.ConnectionId + ",下线了！");
return base.OnDisconnected(stopCalled);
public async Task Welcome(string name)
string message = "[" + Context.ConnectionId + "][" + System.DateTime.Now.ToString("yyyy/MM/dd HH:mm:ss") + "]:" +
await Clients.All.listen(message);
详细的代码可以参考以前的博文
Android客户端
Android客户端采用HTML5开发，一方面是考虑和Web端的通用性，另一方面是因为本人不会原生Android开发。Android客户端处理过程如下：与服务端建立连接，监听消息，接收消息，创建通知。
SignalR JS客户端发送/接收消息
SignalR的JavaScript客户端代码在网上很多，具体原理和配置不再啰嗦。由于编译器使用的是HBuilder（基于Eclipse开发），就使用了它自带的MUI框架，省去了界面设计的麻烦。
创建一个MUI框架的移动应用项目：
需要注意的是，MUI和JQuery的通配符存在冲突，这个问题必需解决。常用的方法是将&符号给JQuery使用，MUI的$全部使用mui代替。
引用SignalR的js类库：
src="js/mui.min.js"&&
type="text/javascript" src="js/jquery-1.6.4.min.js" &&
type="text/javascript" src="js/jquery.signalR-2.2.2.min.js" &&
type="text/javascript" src="js/common.js" &&
href="css/mui.min.css" rel="stylesheet"/&
HTML界面：
type="button" id="_start" value="打开连接" /&
type="button" id="_stop" value="断开连接" /&
type="button" id="_clear" value="清空记录" /&
id="_messageList"&&
class="mui-input-group"&
class="mui-input-row"&
type="text" id='_msg' placeholder="请输入"&
class="mui-button-row"&
type="button" id='_send' value="发送"/&
type="text/javascript" charset="utf-8"&
mui.init();
mui.plusReady(function () {
var startBtn = $('#_start');
var stopBtn = $('#_stop');
var listener = $.hubConnection('http://192.168.1.100/MessageBus',{ useDefaultPath: false });
var hub=listener.createHubProxy('MessageHub');
enable(stopBtn, false);
enable(startBtn, true);
startBtn.click(function () {
startConnection();
enable(stopBtn, true);
enable(startBtn, false);
stopBtn.click(function () {
stopConnection();
enable(startBtn, true);
enable(stopBtn, false);
$('#_clear').click(function () {
$('#_messageList').children().remove();
function startConnection() {
hub.on('listen',function (message) {
$('#_messageList').append('&li&' + message + '&/li&');
listener.start().fail(function () {
$('#_messageList').append('&li&打开连接失败!&/li&');
}).done(function () {
$('#_messageList').append('&li&连接已打开...&/li&');
function stopConnection() {
listener.stop();
$('#_messageList').append('&li&连接已断开...&/li&');
function enable(button,enabled) {
if (enabled) {
button.removeAttr("disabled");
button.attr("disabled", "disabled");
$('#_send').click(function(){
var msg=$('#_msg').val();
hub.invoke('Welcome',msg);
$('#_msg').val('');
实现效果：
使用Native.js创建Android通知栏消息
Native.js实际上是HTML5标准的一部分，并不是一门语言，能够将手机操作系统的原生对象转义，映射为JS对象，简单讲就是使用js操控手机操作系统。有了Native.js，对于像我这样的.NET程序员开发手机应用是再好不过了。
根据查找的资料编写了一段用来创建通知栏消息的代码：
function CreateNotification(m,n){
var NotifyID = n
var Context = plus.android.importClass("android.content.Context")
var main = plus.android.runtimeMainActivity()
var Noti = plus.android.importClass("android.app.Notification")
var NotificationManager = plus.android.importClass("android.app.NotificationManager")
var nm = main.getSystemService(Context.NOTIFICATION_SERVICE)
var Notification = plus.android.importClass("android.app.Notification")
var mNotification = new Notification.Builder(main)
var pending=plus.android.importClass("android.app.PendingIntent")
var intent=plus.android.importClass("android.content.Intent")
//mNotification.setOngoing(true)
mNotification.setContentTitle("您有一条未读消息")
mNotification.setContentText(m)
mNotification.setSmallIcon()
mNotification.setTicker("First Time")
mNotification.setNumber(5)
//var str = dateToStr(new Date())
//mNotification.setWhen(str)
//mNotification.setContentIntent()
mNotification.setDefaults(Noti.DEFAULT_VIBRATE)
mNotification.setPriority(Noti.PRIORITY_DEFAULT)
mNotification.flags=Notification.FLAG_ONLY_ALERT_ONCE
var mNb = mNotification.build()
nm.notify(NotifyID , mNb)
两个参数分别代表通知内容和通知编号，其他设置已经在代码注释中说明。结合上一部分的代码，在接收到实时消息后，创建通知栏消息，代码修改如下：
function startConnection() {
hub.on('listen',function (message) {
$('#_messageList').append('&li&' + message + '&/li&');
CreateNotification(message,i);
listener.start().fail(function () {
$('#_messageList').append('&li&打开连接失败!&/li&');
}).done(function () {
$('#_messageList').append('&li&连接已打开...&/li&');
实现效果如下：
测试时使用了两部手机、一台服务器，均位于同一局域网内。后将服务端部署到公网测试服务器上，同样可用。必须将SignalR服务端启用跨域访问，否则无法实现功能。
作为一个会一点点JS的.NET程序员，只是实现了最基本的需求，后期还要继续实现点击通知打开应用等功能。欢迎大家前来探讨，不吝赐教！
我的热门文章}