请选择 进入手机版 | 继续访问电脑版

乐趣微盟

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 86|回复: 0

为什么我们需要HTML5的服务发送事件?

[复制链接]

331

主题

348

帖子

1321

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
1321
发表于 2018-11-23 18:04:04 | 显示全部楼层 |阅读模式
网络世界的普遍需求是从服务器更新。以一个股票应用为例,浏览器必须定期从服务器更新最新的股票值。
现在实现这类需求开发者通常写一些PULL的代码,到服务器同时抓取某些区间数据。现在PULL的解决方案是很好的,但是这使得网络健谈有很多的调用,同时增加了服务器的负担。
因此相比于PULL,如果我们能采用某种PUSH的解决方案那会是很棒的。简而言之,当服务器更新的时候,将会发送更新到浏览器客户端,那可以被接受通过使用”SERVER SENT EVENT”
因此首要的是浏览器需要连接将会发送更新的服务器资源,比方说我们有一个”stock.aspx”页面会发送股票更新,因此连接该页面,我们需要使用附加时间来源对象,如下所示:
var source = new EventSource("stock.aspx");
当我们将要接受服务器发送的更新信息时,我们需要附加功能。我们需要附加功能到”onmessage”事件就像以下显示的那样。
source.onmessage = function (event) {  document.getElementById("result").innerHTML += event.data + "<br>";};
现在来自服务端,我们需要去发送事件,下面是一些用命令需要从服务端发送的重要事件列表
Event
Command
发送数据到客户端
data : hello
告诉客户端10s内重试
retry : 10000
提出具体事件与数据
event : successdata : You are logged in.
因此,举例说明,如果你想下面的ASP.NET代码一样发送数据,请标记内容类型设置给文本/事件
Response.ContentType="text/event-stream";Response.Expires=-1;Response.Write("data: " + DateTime.Now.ToString());Response.Flush();
以下是设置10s后重试的命令
Response.Write("retry: 10000");
如果你想附加事件,我们需要使用“addEventListener”事件,如下代码所示:
source.addEventListener('message', function(e) {  console.log(e.data);}, false);
来自服务器端的以下信息将会触发Javascript的”message”方法
event: messagedata : hello
回复

使用道具 举报


QQ|Archiver|手机版|小黑屋|乐趣微盟 ( 青ICP备11000010号-2 )

GMT+8, 2018-12-15 05:12 , Processed in 0.128024 second(s), 24 queries .

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表