资讯专栏INFORMATION COLUMN

html5 服务端推送

DevTTL / 376人阅读

摘要:部分获得服务器更新断开支持跨域携带抱歉,您的浏览器不支持事件断开链接服务器端部分,为例只有包含的数据行后面有空行时才触发事件的值为注意换行符

html部分




获得服务器更新

服务器端部分,nodejs为例

var http = require("http");
// var sys = require("sys");
var fs = require("fs");

http.createServer(function(req, res) {
  // debugHeaders(req);

  if (req.headers.accept && req.headers.accept == "text/event-stream") {
    if (req.url == "/events") {
      sendSSE(req, res);
    } else {
      res.writeHead(404);
      res.end();
    }
  } else {
    res.writeHead(200, {"Content-Type": "text/html"});
    // res.write(fs.readFileSync(__dirname + "/sse-node.html"));
    res.write(fs.readFileSync(__dirname + "/sse.html"));
    res.end();
  }
}).listen(8000);


function sendSSE(req, res) {
  res.writeHead(200, {
    "Content-Type": "text/event-stream",
    "Cache-Control": "no-cache",
    "Connection": "keep-alive"
  });

  var id = (new Date()).toLocaleTimeString();

  setInterval(function() {
    constructSSE(res, id, (new Date()).toLocaleTimeString());
  }, 5000);

  constructSSE(res, id, (new Date()).toLocaleTimeString());
  //res.end();
}

//只有包含data:的数据行后面有空行时才触发message事件
//data:foo
//data:bar
//的event.data值为 "for/nbar" 注意换行符
function constructSSE(res, id, data) {
  res.write("id: " + id + "
");
  res.write("data: " + data + "

");
}

// function debugHeaders(req) {
//   sys.puts("URL: " + req.url);
//   for (var key in req.headers) {
//     sys.puts(key + ": " + req.headers[key]);
//   }
//   sys.puts("

");
// }

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81137.html

相关文章

  • H5数据推送

    摘要:本文则试着和读者一起对这个数据推送的需求进行技术方案的探究。数据推送有两种替代方案无更新方案和数据拉取方案。数据拉取和数据推送的功能目标是一致的让用户看到最新的数据。但数据推送有一些优势,即更低的延迟。 前言 众所周知,AJAX的出现是前端快速发展的一个标志,同时也是前后端得以分离的重要基础。作为一个C/S网络的web系统,网络通信在发挥着举足轻重的作用。大部分的场景下,我们是主动触发...

    刘德刚 评论0 收藏0
  • H5数据推送

    摘要:本文则试着和读者一起对这个数据推送的需求进行技术方案的探究。数据推送有两种替代方案无更新方案和数据拉取方案。数据拉取和数据推送的功能目标是一致的让用户看到最新的数据。但数据推送有一些优势,即更低的延迟。 前言 众所周知,AJAX的出现是前端快速发展的一个标志,同时也是前后端得以分离的重要基础。作为一个C/S网络的web系统,网络通信在发挥着举足轻重的作用。大部分的场景下,我们是主动触发...

    nidaye 评论0 收藏0

发表评论

0条评论

DevTTL

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<