如何解决WebSocket的兼容性
我们知道WebSocket是⼀种在服务器与客户端双向通讯的技术,使⽤原⽣的WebSocket可以最⼩化 服务器资源的使⽤并且为两者提供了⼀种统⼀的通信⽅式。随着HTML5的普及,现代浏览器(IE10+)基本上都已经原⽣⽀持WebSocket了,下⾯是⽀持WebSocket协议的浏览器:
Internet Explorer 10
Firefox 6
Chrome 14
Safari 6.0
Opera 12.1
iOS Safari 6.0
Chrome for Android 27.0 但是对于旧的浏览器该如何实现WebSocket的功能呢?下⾯就介绍⼀下⼏种常见的解决⽅案:
1.
SockJS是⼀个JavaScript库,它为浏览器提供了⼀个类似WebSocket的对象。⾸先,它会优先使⽤原⽣的WebSocket;如果不⽀持,则使⽤streaming;如果streaming也不⽀持,则使⽤轮询(polling)。下⾯是⽀持的浏览器概览:
既然模拟WebSocket双向通信,那么使⽤SockJS时,也要配合使⽤相应的服务器端的库,下⾯可以使⽤的服务器端库:
SockJS-node
SockJS-erlang
SockJS-tornado
SockJS-twisted
SockJS-ruby
SockJS-netty
SockJS-gevent (SockJS-gevent fork)
SockJS-go
客户端的使⽤
⾸先加载SockJS库
<script src="cdn.jsdelivr/npm/sockjs-client@1/dist/sockjs.min.js"></script>
复制代码
库加载完后, 就可与SockJS服务器建⽴连接了
var sock = new SockJS('mydomain/my_prefix');
console.log('open');
sock.send('test');
};
console.log('message', e.data);
sock.close();
};
console.log('close');
websocket和socket};
复制代码
服务器端的使⽤(NodeJS)
⾸先,安装sockjs-node:
npm install sockjs
复制代码
接着就可以通过监听事件来与客户端进⾏类似WebSocket的通信了
var http = require('http');
var sockjs = require('sockjs');
var echo = ateServer({ sockjs_url: 'cdn.jsdelivr/sockjs/1.0.1/sockjs.min.js' });
<('connection', function(conn) {
<('data', function(message) {
conn.write(message);
});
<('close', function() {});
});
var server = ateServer();
echo.installHandlers(server, {prefix:'/echo'});
server.listen(9999, '0.0.0.0');
复制代码
2.
Socket.IO能够启⽤基于事件的双向通信,使⽤它同样也需要搭建相应的服务端;⾸先它也会⾸选WebSocket,如果不⽀持则会使⽤下⾯的替代⽅案:
Adobe Flash Socket(缺点:需要在服务器上打开⼀个额外的端⼝,默认为10843)
Ajax long polling
Ajax multipart streaming
Forever iframe
JSONP polling
浏览器兼容性
客户端
//加载Socket.IO库
<script src="localhost:8181/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('localhost:8181');
console.log('a user connected');
<('disconnect', function(){
console.log('user disconnected');
});
</script>
复制代码
服务端
安装socket.io
npm install socket.io --save
复制代码
配置服务器
var server = require('http').createServer(); var io = require('socket.io')(server);
<('connection', function(socket){
<('event', function(data){});
<('disconnect', function(){}); });
server.listen(3000);
复制代码
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论