前后端如何互联?---websocket

Posted 空间机器

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前后端如何互联?---websocket相关的知识,希望对你有一定的参考价值。

1. pc端的应用,一般会采用前端定时请求后台;

2. app定时去访问后台的话,对用户来说并不友好,会消耗大量的流量,移动端最好的方式就是后台主动向app推送信息;

3. H5提供了一种比较好的方式是websocket,打开app后,向后台发出请求,后台响应后,就可以实时向前端推送信息了,而无需app再次去访问;

4.websocket的前端实现方法:

websocket = null;  
url="127.xxxxxxx/xxx"  
var websocketAddress = ‘ws://‘+ url  ;
//判断当前浏览器是否支持WebSocket  
if(‘WebSocket‘ in window){  
    websocket new WebSocket(websocketAddress);  
}  
else{  
    alert(‘当前浏览器不支持WebSocket‘)  
}  
//连接发生错误的回调方法  
websocket.onerror = function(){  
    //notificationReminder("错误");  
};  
  
//连接成功时的回调方法  
websocket.onopen = function(event){  
    console.log(event);  
}  
  
//接收到消息的回调方法  
websocket.onmessage = function(event){  
    $scope.notificationReminder(event.data);  
}  
  
//连接关闭的回调方法  
websocket.onclose = function(){  
    //notificationReminder("关闭");  
}  
//监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。  
window.onbeforeunload = function(){  
    websocket.close();  
}  
  
//发送消息  
$scope.send = function(){  
    websocket.send(localStorageService.get(‘UserID‘));  
}  
$scope.closeWebSocket function(){  
    websocket.close();  
}  

 

以上是关于前后端如何互联?---websocket的主要内容,如果未能解决你的问题,请参考以下文章

前后端使用利用WebSocket进行通信

webSocket实现数据的实时推送(附:前后端代码)

pbootcms对接微信扫码登录代码核心片段和步骤(前后端)

websocket前后端交互通讯

从零玩转Websocket实时通讯服务之前后端分离版本-websocket

websocket前后端交互通讯