首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

SSE技术详解:一种全新的HTML5服务器推送事件技术

相对于与之类似的 COMET 和 WebSocket 技术来说,服务器推送事件的使用更简单,对服务器端的改动也比较小。对于某些类型的应用来说,服务器推送事件是最佳的选择。...基本介绍 在介绍 HTML 5 服务器推送事件(SSE技术)之前,首先介绍一些上面提到的几种服务器端数据推送技术。 第一种是 WebSocket。...对于简单的服务器数据推送的场景,使用服务器推送(SSE技术)事件就足够了。 在浏览器支持方面,服务器推送事件(SSE技术)已经在除 IE 外的大部分桌面和移动浏览器上得到了支持。...在介绍完服务器推送事件的规范内容之后,下面介绍服务器端的实现。 SSE实战示例:服务器端和浏览器端实现 从上一节中对通讯协议的描述可以看出,服务器推送事件是一个比较简单的协议。...如果只是需要从服务器推送数据,服务器推送事件的规范更加简单,实现起来更容易。本文对服务器推送事件的规范内容、服务器端和浏览器端的实现都进行了详细的介绍,对如何支持 IE 浏览器也进行了具体的分析。

3.9K51

服务器推送技术

比如: 股价展示页面实时的获取股价更新 赛事的文字直播,实时更新赛况 通过页面启动一个任务,前端想知道任务后台的实时运行状态 HTML5推广之后,服务端主动推送数据,浏览器接受数据的方式来解决 全双工通信...本质上是一个额外的TCP连接,建立和关闭时握手使用HTTP协议,其他数据传输不使用HTTP协议 HTTP协议适用于复杂双向实时数据通讯场景 在Web网页上的客服、聊天室一般使用WebSocket开发 服务端主动推送...: SSE(Server Send Event) HTML5新标准,用来从服务端实时推送数据到浏览器端,直接建立在当前HTTP连接上 本质上是保持一个HTTP长连接、轻量协议。...建立连接 服务端 -> 浏览器(连接保持) 关闭连接 SSE一大特色: 重复利用1个连接来接受服务器发送的消息(event),从而避免不断轮询请求建立连接,造成服务资源紧张。...事件名称 事件触发说明 事件处理方法 open 当服务器向浏览器第一次发送数据时产生 onopen message 当收到服务器发送的消息时产生 onmessage error 当出现异常时产生 onerror

1.8K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    SSE 服务器推送

    服务器推送在某些场景下是非常重要且不可或缺的部分,比如看 NBA 总决赛的时候,各种比赛数据的实时更新等,而著名的 WebSocket 协议就可以很简单的实现服务器推送,当然我要讲的并不是 WebSocket...SSE ---- Server-sent event ( 简称 SSE ),顾名思义,服务器推送事件,在 web 的 HTML5 标准中已经得到实现。...而 SSE 其实与上面的场景类似,在响应上做文章,仍然由客户端发起请求,但是服务器接受到请求后保持此连接,一次一次慢慢的推送消息,这就形成了我们看到的服务器推送。...实战 ---- 1、先准备一个我们的服务器端,每秒钟推送数据: 很简单是不是,重点关注下红色框中的部分,保持连接、使用事件流的形式、不使用缓存,每秒钟推送一下当前的时间等,注释我都写了,你肯定可以看懂。...2、再写个前端页面负责展示: 代码很简单,打印下服务器推送的数据,看我的注释你就明白了。 3、最终的效果: 结语 ---- SSE 实现服务器推送更加轻量、实现更简单,某些时候是一种不错的选择。

    1.5K10

    HTML5 学习总结(五)——WebSocket与消息推送

    ,但不容易直接完成实时的消息推送功能,如聊天室、后台信息提示、实时更新数据等功能,但通过polling、Long polling、长连接、Flash Socket以及HTML5中定义的WebSocket...HTTP协议决定了服务器与客户端之间的连接方式,无法直接实现消息推送(F5已坏),一些变相的解决办法: 双向通信与消息推送 轮询:客户端定时向服务器发送Ajax请求,服务器接到请求后马上返回响应信息并关闭连接...Websocket: WebSocket是HTML5开始提供的一种浏览器与服务器间进行全双工通讯的网络技术。依靠这种技术可以实现客户端和服务器端的长连接,双向实时通信。...Flash实现推送消息的方法不建议使用,因为依赖插件且手机端支持不好。...在Web网页与服务器端间建立Socket连接,当WebSockets可用时(即浏览器支持Html5)SignalR使用WebSockets,当不支持时SignalR将使用长轮询来保证达到相同效果。

    2.8K80

    html5利用websocket完成的推送功能(tomcat)

    利用websocket和java完成的消息推送功能,服务器用的是tomcat7.0.42,一些东西是自己琢磨的,也不知道恰不恰当,不恰当处,还请各位见谅,并指出。...2.websocket的优点 以前我们实现推送技术,用的都是轮询,在特点的时间间隔有浏览器自动发出请求,将服务器的消息主动的拉回来,在这种情况下,我们需要不断的向服务器发送请求,然而HTTP request...会占用大量的带宽和服务器资源。 WebSocket API最伟大之处在于服务器和客户端可以在给定的时间范围内的任意时刻,相互推送信息。在建立连接之后,服务器可以主动传送数据给客户端。...此外,服务器与客户端之间交换的标头信息很小。...WebSocket并不限于以Ajax(或XHR)方式通信,因为Ajax技术需要客户端发起请求,而WebSocket服务器和客户端可以彼此相互推送信息; 关于ajax,comet,websocket的详细介绍

    1.4K60

    Web端服务器推送技术

    服务器能实时地将更新的信息传送到客户端,而无须客户端发出请求。...但HTTP属于无状态连接,即每次请求结束后与服务器的连接会立即释放,服务器不能主动推送消息到客户端,只能由客户端浏览器发起请求。...当客户端处理接收的数据、重新建立连接时,服务器端可能有新的数据到达;这些信息会被服务器端保存直到客户端重新建立连接,客户端会一次把当前服务器端所有的信息取回。 ?...是基于TCP的一种新的网络协议,它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端。...WebSocket是一种的新型的HTML5技术,当前浏览器的支持并不完善,可以与Flash XMLSocket结合,封装一套通用API,根据不同浏览器特性调用不同的实现,但无论是WebSocket还是Flash

    1.8K30

    Pushdeer:开源多协议推送服务器,定制化推送解决方案

    在当今快速发展的信息时代,实时的消息、通知和数据推送变得至关重要。Pushdeer 软件应运而生,作为一款开源的推送服务器软件,它支持多种推送协议,为用户提供了灵活且可定制的推送解决方案。...,无论是简单的消息推送、通知推送,还是更复杂的数据推送。...这为定制化推送服务提供了广阔的空间,满足了各种特定场景下的要求。 使用场景 消息推送 Pushdeer 可以被广泛应用于消息推送场景。...通知推送 系统通知、活动通知等信息可以通过 Pushdeer 进行推送,确保用户及时获取到相关通知,提高用户体验。 数据推送 在需要实时传递数据的场景下,Pushdeer 也能胜任。...-h localhost -t topic -m message 总结 Pushdeer 是一款功能强大的开源推送服务器软件,具备多协议支持、高可用性和强大的扩展性。

    1.2K10

    Comet——服务器推送解决方案

    本文作者:IMWeb devinran 原文出处:IMWeb社区 未经同意,禁止转载 浏览器需要资源时,发起请求向服务器“要”,这个很容易,地球人都知道。...类似这些消息,需要服务器即时地更新到浏览器,因为浏览器并不知道恒生指数有没有涨到三万两千点。这个问题的实现方案就是今天要记录的Comet。...服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗?...服务器桑:没有 浏览器君:恒指上三万了吗? 浏览器君走钢丝中...... 浏览器君碎大石中...... 浏览器君住院中...... 服务器桑:上了 浏览器君执行“赶紧卖”回调函数。...终极方案:WebSocket 这个名字大家都不陌生了,HTML5协议中的BS全双工通信解决方案,真正的高富帅,实力与智慧的结合,地位和财富的象征。

    1.2K21

    Comet——服务器推送解决方案

    浏览器需要资源时,发起请求向服务器“要”,这个很容易,地球人都知道。 服务器有资源更新,想向浏览器“推”,这个好像就有点麻烦了。...类似这些消息,需要服务器即时地更新到浏览器,因为浏览器并不知道恒生指数有没有涨到三万两千点。这个问题的实现方案就是今天要记录的Comet。...服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗? 服务器桑:没有 浏览器君:恒指上三万了吗?...服务器桑:没有 浏览器君:恒指上三万了吗? 浏览器君走钢丝中...... 浏览器君碎大石中...... 浏览器君住院中...... 服务器桑:上了 浏览器君执行“赶紧卖”回调函数。...终极方案:WebSocket 这个名字大家都不陌生了,HTML5协议中的BS全双工通信解决方案,真正的高富帅,实力与智慧的结合,地位和财富的象征。

    1.4K00

    JavaScript 服务器推送技术之 WebSocket

    点击上方“IT平头哥联盟”,选择“置顶或者星标” 一起进步~ 编者按:本文转载自 SHERlocked93 的掘金文章,跟着作者一起来学习一下吧 最近在工作中遇到了需要服务器推送消息的场景,这里总结一下收集整理...概述 1.1 服务器推送 WebSocket作为一种通信协议,属于服务器推送技术的一种,IE10+支持。...服务器推送技术不止一种,有短轮询、长轮询、WebSocket、Server-sent Events(SSE)等,他们各有优缺点: # 短轮询 长轮询 Websocket sse 通讯方式 http...占较多的内存资源与请求数 安全性差,占较多的内存资源与请求数 传输数据需要进行二次解析,增加开发成本及难度 只适用高级浏览器 适用范围 b/s服务 b/s服务 网络游戏、银行交互和支付 服务端到客户端单向推送...那么如果后端想往前端推送消息需要前端去轮询,不断查询后端是否有新消息,而轮询的效率低且浪费资源(必须不停 setInterval 或 setTimeout 去连接,或者 HTTP 连接始终打开),WebSocket

    1.5K30

    重学Springboot系列之服务器推送技术

    重学Springboot系列之服务器推送技术 主流服务器推送技术说明 需求与背景 服务端推送常用技术 全双工通信:WebSocket 服务端主动推送:SSE (Server Send Event) websocket...---- 服务端推送常用技术 在html5被广泛推广之后,我们可以使用服务端主动推送数据,浏览器接收数据的方式来解决上面提到的问题。...---- 服务端主动推送:SSE (Server Send Event) html5新标准,用来从服务端实时推送数据到浏览器端, 直接建立在当前http连接上,本质上是保持一个http长连接,轻量协议...模拟测试第4步 商户系统告知用户所在的浏览器,你支付成功了(服务器数据推送)。自动在浏览器上将“支付成功”的信息打印出来。...【SpringBoot WEB 系列】SSE 服务器发送事件详解 SSE技术详解:一种全新的HTML5服务器推送事件技术 ---- 双向实时通信websocket 整合websocket <!

    2.2K10

    自己动手搭建苹果推送Push服务器

    今天我们来说下怎么自己建一个Push推送服务器, 当然还是用的苹果的APNS 这里我们讲的的自己服务器端的实现 在做推送服务器之前我们要先做一些准备动作 #1....如果不是的话就点Edit设置并创建自己的证书, 具体怎么设置和创建证书大家可以看: http://www.fx114.net/qa-202-108331.aspx 按照上面做完后, 我们把自己的推送证书下载下来...,网上有,就简写了 telnet gateway.sandbox.push.apple.com 2195 (测试是否能连通苹果的推送测试服务器) Trying 17.172.232.226......gateway.sandbox.push.apple.com:2195 -cert public.pem -key private.pem   输完密码之后,要是输出一堆提示信息就算是ok了 下面我们开始准备写推送服务器...目前我们已经实现了推送一个alert, 剩下的我们下次再看看

    3.1K20

    HTTP2 服务器推送(Server Push)

    服务器推送(server push)是 HTTP/2 协议里面,唯一一个需要开发者自己配置的功能。其他功能都是服务器和浏览器自动实现,不需要开发者关心。 本文详细介绍服务器推送的原理和配置方法。 ?...三、服务器推送的概念 服务器推送(server push)指的是,还没有收到浏览器的请求,服务器就把各种资源推送给浏览器。...这显然很不方便,每次修改都要重启服务,而且应用与服务器的配置不应该混在一起。 服务器推送还有另一个实现方法,就是后端应用产生 HTTP 回应的头信息Link命令。...服务器发现有这个头信息,就会进行服务器推送。 Link: ; rel=preload; as=style 如果要推送多个资源,就写成下面这样。...七、缓存问题 服务器推送有一个很麻烦的问题。所要推送的资源文件,如果浏览器已经有缓存,推送就是浪费带宽。即使推送的文件版本更新,浏览器也会优先使用本地缓存。

    1.1K60
    领券