如何用网站模板,如何做自己的网站系统,网站建设以及推广销售客户怎么找,产品设计需要学的软件1. sse概述
概念#xff1a; H5支持使用JS脚本不间断的访问服务器(推送)轮询:
页面使用js的定时器#xff0c;定时发送请求查询最新数据
使用js将最新数据加载至页面
每发送一次数据#xff0c;需要建立新的连接
时间间隔由客户端决定
优点#xff1a;不需要刷新页面、实…1. sse概述
概念 H5支持使用JS脚本不间断的访问服务器(推送)轮询:
页面使用js的定时器定时发送请求查询最新数据
使用js将最新数据加载至页面
每发送一次数据需要建立新的连接
时间间隔由客户端决定
优点不需要刷新页面、实时更新
缺点定时器时间间隔间隔太长数据不及时间隔太短服务器压力太大SSE基于长轮询
建立一次连接即可
连接断开会自动重连需要保证客户端没关闭
只能从服务器发送数据到客户端
SSE实现比较简单
时间间隔由服务器决定SSE流程
客户端发送消息到服务器
服务器发送数据到客户端业务数据、间隔时间
存在阻塞接收到服务器发过来的数据才能开始下一次请求原理流
严格地说HTTP 协议无法做到服务器主动推送信息。
但是有一种变通方法就是服务器向客户端声明
接下来要发送的是流信息streaming。
也就是说发送的不是一次性的数据包而是一个数据流
会连续不断地发送过来。这时客户端不会关闭连接
会一直等着服务器发过来的新的数据流视频播放就是这样的例子。
本质上这种通信就是以流信息的方式完成一次用时很长的下载。
SSE 就是利用这种机制使用流信息向浏览器推送信息。
它基于 HTTP 协议目前除了 IE/Edge其他浏览器都支持2. sse代码实现
js script// 原生jsvar sourcenew EventSource(地址);source.onmessagefunction(e){//e参数就是事件参数// e.data 就表示服务器返回的数据};// jQuery$(source).on(message,function(e){//e参数是包装之后的事件参数//var data$(e).attr(data);var datae.data;});//open 连接打开之后//message 服务器返回之后//error 服务器访问失败之后//var elediv/div;//$(ele); //变成了一个对象/script服务器servlet为例
String datadata:数据内容\n\n; //返回给浏览器的数据String retryretry:毫秒数\n\n; //指定下次尝试的间隔时间//可选不写表示没有间隔response.setContentType(text/event-stream);response.setCharacterEncoding(utf-8);OutputStream outresponse.getOutputStream();out.write(data.getBytes(utf-8));out.write(retry.getBytes(utf-8));out.close();3. 总结
取代了计时器不断访问服务器由服务器控制访问的时间。
sse的取代品websocket。
