基于服务器端推送事件的Coment技术
定义了一个EventSource对象
服务器端的推送事件的方式为客户端在创建一个EventSource对象时会建立一个到服务器的连接，服务器会保持这个连接处于打开的状态，当发生一个事件的时候，服务器端在连接中写入几行文本，然后达到推送的目的

是使用的是长连接的方式，达到消息推送的目的

一个栗子，实现一个简易的聊天客户端

<!DOCTYPE html>
<html>
<head><title></title>
</head>
<body>
<script>// 一个使用EventSource的简易的聊天客户端var nick = prompt('用户昵称');  // 将会使用对话框获取用户昵称var input = document.getElementById('input');   // 找出input元素input.focus();  // 确保网页一加载就获得焦点// 通过EventSource注册新消息的通知var chat = new EventSource('/chat');    // 确定长连接的url,从而建立一个长连接，下方为接收的chat.onmessage = (event) => {   // 接收事件的时候，将会调用该接口的属性,直接捕获一条消息var msg = event.data;   // 从事件对象中取得文本数据var node = document.createTextNode(msg);    // 将消息放入一个文本节点中var div = document.createElement('div');    // 创建一个div节点div.appendChild(node);  // 将消息作为div的子节点document.body.insertBefore(div, input); // 将div插入到input之前input.scrollIntoView(); // 当消息很长的时候，确保依旧在视窗内};// 使用XMLHttpRequest将用户的消息发送给服务器，下方为发送的input.onchange = () => {    // 绑定onchange事件，即，当用户的鼠标离开文本框的时候var msg = nick + ":" + input.value; // 组合输入的内容var xhr = new XMLHttpRequest(); // 创建一个新的XMLxhr.open('post', '/chat');  // 将消息发送到chatxhr.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');   // 确定头部信息为消息xhr.send(msg);  // 将消息发送input.value = "";   // 清空消息}
</script>
<input id="input" style="width:100%">
</body>
</html>

这个微软不兼容，这个直接用node.js接收客户端发送的post消息即可。
了解，下面jquery

浏览器推送 comet相关推荐

浏览器推送 comet技术
基于服务器端推送事件的Coment技术定义了一个EventSource对象服务器端的推送事件的方式为客户端在创建一个EventSource对象时会建立一个到服务器的连接,服务器会保持这个连接处于打 ...
前端ajax数据提交到服务器_详解前端如何让服务器主动向浏览器推送数据
前言前面我们已经聊了ajax,它的特点是浏览器必须先发起请求,服务器才能给出对应的响应,想一想能不能让服务器主动向浏览器推送数据呢?那么这篇文章我们来聊一聊服务器推送功能. 轮询假设你现在需要去做 ...
2345浏览器如何显示浏览器推送内容
2345浏览器是一款非常便捷好用的浏览服务软件,用户可以在这里获取最便捷的浏览方式,超多的内容都可以一键掌握,浏览器在使用的时候会显示推送内容,用户可以在这里获取最新的新闻资讯等等内容,那么在需要的时 ...
go gorilla_使用gorilla websocket构建浏览器推送通知服务的低级设计
go gorilla Singhania AdityaSinghania Aditya Follow跟随 Aug 31 8月31 gopher leaving everyone awestruck w ...
java服务器推送浏览器_前端如何让服务器主动向浏览器推送数据
前言前面我们已经聊了ajax,它的特点是浏览器必须先发起请求,服务器才能给出对应的响应,想一想能不能让服务器主动向浏览器推送数据呢?那么这篇文章我们来聊一聊服务器推送功能. 轮询假设你现在需要去做 ...
从手机App通过WebSocket向浏览器推送数据
启动Orchestra,WebSocket server for KOI 和WebShop,共计3台服务器. 启动一个KOI App模拟器,两个WebShop模拟器. 两个webshop模拟器上分别点 ...
除了 Websocket ，服务端还有什么办法能向浏览器主动推送信息？
除了 Websocket ,服务端还有什么办法能向浏览器主动推送信息? 前言端倪 Server-Sent Events 是什么? Server-Sent Events 与 Websocket 对比 ...
sql server无法绑定由多个部分组成的标识符_HTML5服务器推送事件（Server-sent-event）...
在前端开发中,实现界面推送的方式,这里大概总结下三种方式轮询(ajax),比较耗费服务器资源.COMET方式(COMET 技术并不是 HTML 5 ) websocket 双向数据推送,灵活,功能强 ...
HTML5支持服务器发送事件(Server-Sent Events)-单向消息传递数据推送（C#示例）
传统的WEB应用程序通信时的简单时序图: 现在Web App中,大都有Ajax,是这样子: HTML5有一个Server-Sent Events(SSE)功能,允许服务端推送数据到客户端.(通常叫数据 ...

浏览器推送 comet

一个栗子，实现一个简易的聊天客户端

浏览器推送 comet相关推荐

最新文章

热门文章