WebSocket前后台交互

其实对于前后台交互有很多种方法（只列举我知道的，嘻嘻）：

　　1:from 表单：

　　　　使用场景——小信息量提交给后台

　　2:ajax（跨域的话用jsonp):

　　　　可以进行多量的前后台信心传递；

　　　　但实时性不高，不适合要求实时性的场景；例如qq聊天

　　3：webscoket:

　　　　可以进行大量的前后台信息传递，

　　　　实时性也十分良好；主要应用场景为聊天场景；

一：websocket：

　　1:创建一个websocket实例：

　　　　　var socket = new WebSocket(socketUrl); socketUrl代表的是请求的地址，类似于ajax的url

 

　　2：链接服务器进行前后台交互以及事件处理：

　　　　　socket.onopen = function(event) { 

　　　　　　 //想要验证是否连接成功可以给后台发一个消息
  　　　　　　socket.send('我已经连接成功了么'); 

　　　　　　// 这个事件监听，可以监听后台返回来给你的消息，即str就是
 　　　　 　　socket.onmessage = function(str) { 
    　　　　　　　console.log(str); 
 　　　　　　 }; 

　　　　　　// 监听Socket的关闭
 　　　　　　 socket.onclose = function(str) { 
   　　　　　　　　 console.log(str); 
 　　　　　　 };

　　　　　　// 关闭Socket.... （需要的时候把注释去掉）
 　　　　　　//socket.close() ;

　　　　};

其实websocket用起来特别的容易，但是有一个缺点就是ie不兼容，那怎么办呢，还有一个办法就是socket.io.js，它看起来非常像客户端API，建立客户端Socket.IO；

二：带Socket.IO的WebSocket：

　　Socket.IO可以从GitHub下载，可以把socket.io.js文件包含到页面中：

　　<script src="js/socket.io.js"></script>

　　此时，Socket.IO在此页面上是有效的，是时候创建Socket了：

　　1://创建Socket.IO实例，建立连接

　　var socket = new io.Socke(bollmskn);//bollmskn代表的是请求地址，类似ajax的url

　　socket.connect();

　　2:// 连接监听

　　socket.on('connect',function() { 
  　　console.log('服务器已连接！'); // 这里可以做一些事件的处理啊，什么的比如做一个提示啊什么的;
　　});

　　3：//建立一个事件监听，监听后台返回来的数据

　　socket.on('message',function(data) { 
 　　 console.log('这是后台返回来的消息',data); 
　　});

　　4：// 通过Socket发送一条消息到服务器

　　function sendMessageToServer(message) { 
 　　 socket.send(message); 
　　}

　　5// 添加一个关闭连接的监听器

　　socket.on('disconnect',function() { 
 　　 console.log('链接已关闭!'); 
　　});

Socket.IO还提供了由本地WebSocket API提供的普通连接、断开连接、消息事件。Socket还提供了封装每个事件类型的方法。如果你们后台封装了特定的事件方法就按照你们的自己来，这个你们前后台自己商量着来；

拜拜，周末愉快！！！