往BS架构本身存在的问题就是，服务器一直采用的是一问一答的机制。这就意味着如果客户端不主动地向服务器发送消息，服务器就无法得知如何给客户端推送消息。
随着HTML、浏览器等各项技术、标准的发展，依次生成了不同的手段与方法能够实现服务端主动推送消息，它们分别是：AJAX，Comet，ServerSent以及WebSocket。
本篇文章将对上述提及到的各种技术手段进行直白化的解释。
AJAX
正常的一个页面在浏览器中是这样工作的：
用户向给予浏览器一个需要访问的地址
浏览器根据这个地址访问服务器，并与服务器之间创建一个TCP连接（HTTP请求）
服务器根据这个地址和一些其它数据，组建一段HTML文本，将写入TCP连接，然后关闭连接
浏览器得到了来自服务器的HTML文本，解析并呈现了浏览器上给用户浏览
此时，用户点击了网站上任何一个<a>或触发任何一个<form>提交时：
浏览器根据form的参数或者a的参数，作为访问的地址
与服务器创建TCP连接
服务器组建HTML文本，然后关闭连接
浏览器将当前显示的页面摧毁，并按照新的HTML文本呈现一个新的页面给用户
我们不难发现的是整个过程中间，一旦建立了一个连接，页面就无法再维护住了。整个过程看上去有点强买强卖，也许我只要一杯新的可乐，但你非要给我一整个套餐组合。
此时我们可以了解一下XmlHttpRequest组件，这个组件提供我们手动创建一个HTTP请求，发送我们想要的数据，服务器也可以只返回我们想要的结果，最大的好处是，当我们收到服务器的响应时，原来的页面没有被摧毁。这就好比，我喊一句"我的咖啡喝完了，我要续杯"，然后服务员就拿了一杯咖啡过来，而不是会把我没吃完的套餐全部倒掉。
当我们利用AJAX实现服务器推送时，其实质是客户端不停地向服务器询问"有没有给我的消息呀？"，然后服务器回答"有"或"没有"来达到的实现效果。它的实现方法也很简单，利用jQuery框架封装好的AJAX调用也很方便：
function getMessage(fn) {
$.ajax({
url: "Handler.ashx", //一个能够提供消息的页面
dataType: "text", //响应类型，可以是JSON，XML等其它类型
type: "get", //HTTP请求类型，还可以是post
success: function (d, s) {
fn(d); //得到了正常的响应时，利用回调函数通知外部 },
complete: function (x, s) {
setTimeout(function () {
getMessage(fn);
}, 5000); //无论响应成功或失败，在若干秒后再询问一次服务器 }
});
}通过上面的代码，可以每隔5秒询问一次服务器是否有需要处理的消息，通过这种方式可以达到推送的效果，但是会存在一个问题：
间隔时间越快，推送的及时性越好，服务器的消费越大；
间隔时间越慢，推送的及时性越低，服务器的消费越小。
而且严格地来说，这种实际方式，并不是真正意义上的服务器主动推送消息，但由于早期技术手段缺乏，所以AJAX轮循成为了一种很普遍的手段。
下面对服务器推送事件的规范进行具体的说明。
规范
Server-sent Events 规范是 HTML 5 规范的一个组成部分，具体的规范文档见参考资源。该规范比较简单，主要由两个部分组成：第一个部分是服务器端与浏览器端之间的通讯协议，第二部分则是在浏览器端可供 JavaScript 使用的 EventSource 对象。通讯协议是基于纯文本的简单协议。服务器端的响应的内容类型是“text/event-stream”。响应文本的内容可以看成是一个事件流，由不同的事件所组成。每个事件由类型和数据两部分组成，同时每个事件可以有一个可选的标识符。不同事件的内容之间通过仅包含回车符和换行符的空行（“\r\n”）来分隔。每个事件的数据可能由多行组成。代码清单 1 给出了服务器端响应的示例。
服务器端响应的示例
data: first event data: second event id: 100 event: myevent data: third event id: 101 : this is a comment data: fourth event data: fourth event continue
如代码清单 1 所示，每个事件之间通过空行来分隔。对于每一行来说，冒号（“:”）前面表示的是该行的类型，冒号后面则是对应的值。可能的类型包括：
类型为空白，表示该行是注释，会在处理时被忽略。
类型为 data，表示该行包含的是数据。以 data 开头的行可以出现多次。所有这些行都是该事件的数据。
类型为 event，表示该行用来声明事件的类型。浏览器在收到数据时，会产生对应类型的事件。
类型为 id，表示该行用来声明事件的标识符。
类型为 retry，表示该行用来声明浏览器在连接断开之后进行再次连接之前的等待时间。
在上面代码中，第一个事件只包含数据“first event”，会产生默认的事件；第二个事件的标识符是 100，数据为“second event”；第三个事件会产生类型为“myevent”的事件；最后一个事件的数据为“fourth event\nfourth event continue”。当有多行数据时，实际的数据由每行数据以换行符连接而成。
如果服务器端返回的数据中包含了事件的标识符，浏览器会记录最近一次接收到的事件的标识符。如果与服务器端的连接中断，当浏览器端再次进行连接时，会通过 HTTP 头“Last-Event-ID”来声明最后一次接收到的事件的标识符。服务器端可以通过浏览器端发送的事件标识符来确定从哪个事件开始来继续连接。
对于服务器端返回的响应，浏览器端需要在 JavaScript 中使用 EventSource 对象来进行处理。EventSource 使用的是标准的事件监听器方式，只需要在对象上添加相应的事件处理方法即可。EventSource 提供了三个标准事件，如表 1 所示。
表 1. EventSource 对象提供的标准事件
名称 | 说明 | 事件处理方法 |
open | 当成功与服务器建立连接时产生 | onopen |
message | 当收到服务器发送的事件时产生 | onmessage |
error | 当出现错误时产生 | onerror |
如之前所述，服务器端可以返回自定义类型的事件。对于这些事件，可以使用 addEventListener 方法来添加相应的事件处理方法。代码清单 2 给出了 EventSource 对象的使用示例。
EventSource 对象的使用示例
var es = new EventSource('events');
es.onmessage = function(e) {
console.log(e.data);
};
es.addEventListener('myevent', function(e) {
console.log(e.data);
});如上所示，在指定 URL 创建出 EventSource 对象之后，可以通过 onmessage 和 addEventListener 方法来添加事件处理方法。当服务器端有新的事件产生，相应的事件处理方法会被调用。EventSource 对象的 onmessage 属性的作用类似于 addEventListener( ‘ message ’ )，不过 onmessage 属性只支持一个事件处理方法。在介绍完服务器推送事件的规范内容之后，下面介绍服务器端的实现。
服务器端和浏览器端实现
从上一节中对通讯协议的描述可以看出，服务器端推送事件是一个比较简单的协议。服务器端的实现也相对比较简单，只需要按照协议规定的格式，返回响应内容即可。在开源社区可以找到各种不同的服务器端技术相对应的实现。自己开发的难度也不大。本文使用 Java 作为服务器端的实现语言。相应的实现基于开源的 jetty-eventsource-servlet 项目，见参考资源。下面通过一个具体的示例来说明如何使用 jetty-eventsource-servlet 项目。示例用来模拟一个物体在某个限定空间中的随机移动。该物体从一个随机位置开始，然后从上、下、左和右四个方向中随机选择一个方向，并在该方向上移动随机的距离。服务器端不断改变该物体的位置，并把位置信息推送给浏览器，由浏览器来显示。
服务器端实现
服务器端的实现由两部分组成：一部分是用来产生数据的 org.eclipse.jetty.servlets.EventSource 接口的实现，另一部分是作为浏览器访问端点的继承自 org.eclipse.jetty.servlets.EventSourceServlet 类的 servlet 实现。下面代码给出了 EventSource 接口的实现类。
EventSource 接口的实现类 MovementEventSource
public class MovementEventSource implements EventSource {
private int width = 800;
private int height = 600;
private int stepMax = 5;
private int x = 0;
private int y = 0;
private Random random = new Random();
private Logger logger = Logger.getLogger(getClass().getName());
public MovementEventSource(int width, int height, int stepMax) {
this.width = width;
this.height = height;