右键网站 选择添加ftp站点,原江苏省建设厅网站,只做乡村旅游的网站,iis7 新建网站关于服务端推送技术#xff0c;大家比较熟悉的可能就是轮询#xff0c;但是轮询只能是由客户端先发起http请求。在HTTP1.1中的keep-alive方式建立的http连接#xff0c;但是一个Request只能对应一个Response#xff0c;而且这个Response是被动的#xff0c;不能主动发起。… 关于服务端推送技术大家比较熟悉的可能就是轮询但是轮询只能是由客户端先发起http请求。在HTTP1.1中的keep-alive方式建立的http连接但是一个Request只能对应一个Response而且这个Response是被动的不能主动发起。 为了在IM、股票等场景下真正解决服务端实时向客户端推送数据的问题出现了基于TCP的长连接通讯协议websocket。 websocket协议本身需要注意的一共有两点 1.为了兼容现有浏览器的握手规范而借用了HTTP的协议来完成一部分握手。 2.websocket是纯事件驱动的一旦连接建立通过监听事件可以处理到来的数据和改变的连接状态数据都以帧序列的形式传输。服务端发送数据后消息和事件会异步到达。websocket编程遵循一个异步编程模型只需要对websocket对象增加回调函数就可以监听事件。 下面来具体介绍一下websocket的这两点特征先介绍基于回调函数的事件编程异步编程模型如果大家想切身体验一下websocket可以自己下载现成demo。地址https://github.com/sockjs/sockjs-node/tree/v0.3.19(注意请通过download下载文件的方式下载代码不要直接clone不然代码版本不一样)。不过为了更好地实现浏览器兼容性demo中是通过sockjs-node库来实现websocket协议的底层协议。更多的sockjs的api请进一步参考git网页中sockjs-node的文档。 本次用来演示的是example文件夹中的koa项目在代码中大家可以着重理解上面提到的websocket需要注意的第二点在代码中主要是通过事件回调函数的方式来实现对消息的处理的。 在服务器代码中首先为sockjs_echo变量赋值了一个websocket连接实例定义接收到消息后的回调函数即把接收到的message进行回写。然后启动了一个koa服务器当被访问的时候返回一个index.html文件作为webSocket的客户端。最后通过installHandlers方法在访问路由/echo的时候为koa服务器增加websocket连接的回调处理。var koa require(koa);var sockjs require(sockjs);var http require(http);var fs require(fs);var path require(path);// 1. Echo sockjs servervar sockjs_opts {sockjs_url: http://cdn.jsdelivr.net/sockjs/1.0.1/sockjs.min.js};var sockjs_echo sockjs.createServer(sockjs_opts);sockjs_echo.on(connection, function(conn) { conn.on(data, function(message) { conn.write(message); });});// 2. koa servervar app new koa();app.use(function *() { var filePath __dirname /index.html; this.type path.extname(filePath); this.body fs.createReadStream(filePath);});var server http.createServer(app.callback());sockjs_echo.installHandlers(server, {prefix:/echo});server.listen(9999, 0.0.0.0);console.log( [*] Listening on 0.0.0.0:9999 ); 而在客户端实现如下通过sockjs库实例化websocket连接实例后通过onopen、onmessage、onclose这些回调函数来实现消息的发送、接收、连接关闭处理var sockjs_url /echo;var sockjs new SockJS(sockjs_url);sockjs.onopen function() {print([*] open, sockjs.protocol);};sockjs.onmessage function(e) {print([.] message, e.data);};sockjs.onclose function() {print([*] close);};form.submit(function() { print([ ] sending, inp.val()); sockjs.send(inp.val()); inp.val(); return false;});借用HTTP协议完成握手 启动koa服务后我们访问http://0.0.0.0:9999/打开页面可以在浏览器network选项卡中观察到连接的建立过程。在request的header中通过ConnectionUpgrade;Upgrade:websocket字段表示浏览器通知服务器如果可以就升级到websocket协议。response中同样通过ConnectionUpgrade;Upgrade:websocket来通知浏览器服务端已经成功切换协议返回状态码为101。 我们此时可以试着在网页中输入一些内容来通过websocket来发送还是在浏览器的Network选项卡中可以看到我们发送的消息和服务端回写回来的消息 目前我们已经看到了一个简单的websocket实现但是在websocket中传输的内容是不是还可以更加丰富一些比如像http协议一样添加上各种header字段来让我们实现出一些更加规范的语义协议可以的。stomp协议就是这样的一个语义协议可以在websocket的基础之上通过stomp协议来更加规范地传输消息。官方文档http://jmesnil.net/stomp-websocket/doc/翻译文档https://blog.csdn.net/quanyuejie/article/details/53896140 使用了stomp协议在websocket基础上传输消息的效果如下我们可以看到在websocket的消息中一个消息可以看作一个frame每个frame中有自己的command和headers、body。比如在连接帧中发送了CONNECT的命令,后面accept-version作为headers来定义版本号heart-beat来定义心跳等等这些功能都可以看作是通过stomp协议来实现的参考JS 服务器推送技术 WebSocket 入门指北 公众号前端下午茶
