摘要:基于服务器端推送事件的技术定义了一个对象服务器端的推送事件的方式为客户端在创建一个对象时会建立一个到服务器的连接,服务器会保持这个连接处于打开的状态,当发生一个事件的时候,服务器端在连接中写入几行文本,然后达到推送的目的是使用的是长连接的方
基于服务器端推送事件的Coment技术
定义了一个EventSource对象
服务器端的推送事件的方式为客户端在创建一个EventSource对象时会建立一个到服务器的连接,服务器会保持这个连接处于打开的状态,当发生一个事件的时候,服务器端在连接中写入几行文本,然后达到推送的目的
是使用的是长连接的方式,达到消息推送的目的
一个栗子,实现一个简易的聊天客户端
- // 一个使用EventSource的简易的聊天客户端
- var nick = prompt("用户昵称"); // 将会使用对话框获取用户昵称
- var input = document.getElementById("input"); // 找出input元素
- input.focus(); // 确保网页一加载就获得焦点
- // 通过EventSource注册新消息的通知
- var chat = new EventSource("/chat"); // 确定长连接的url,从而建立一个长连接,下方为接收的
- chat.onmessage = (event) => { // 接收事件的时候,将会调用该接口的属性,直接捕获一条消息
- var msg = event.data; // 从事件对象中取得文本数据
- var node = document.createTextNode(msg); // 将消息放入一个文本节点中
- var div = document.createElement("div"); // 创建一个div节点
- div.appendChild(node); // 将消息作为div的子节点
- document.body.insertBefore(div, input); // 将div插入到input之前
- input.scrollIntoView(); // 当消息很长的时候,确保依旧在视窗内
- };
- // 使用XMLHttpRequest将用户的消息发送给服务器,下方为发送的
- input.onchange = () => { // 绑定onchange事件,即,当用户的鼠标离开文本框的时候
- var msg = nick + ":" + input.value; // 组合输入的内容
- var xhr = new XMLHttpRequest(); // 创建一个新的XML
- xhr.open("post", "/chat"); // 将消息发送到chat
- xhr.setRequestHeader("Content-Type", "text/plain;charset=UTF-8"); // 确定头部信息为消息
- xhr.send(msg); // 将消息发送
- input.value = ""; // 清空消息
- }
这个微软不兼容,这个直接用node.js接收客户端发送的post消息即可。
了解,下面jquery
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/108321.html
摘要:最近对服务器推送技术比较感兴趣,在网上也看了好些文章,由于每个人理解的不同,实现细节或者语言表达方式不同,本人被各种名词或者技术实现搞的头大,于是自己准备整理下。定时器就可以实现,每次请求如果服务器端有更新数据则响应到客户端。 最近对服务器推送技术比较感兴趣,在网上也看了好些文章,由于每个人理解的不同,实现细节或者语言表达方式不同,本人被各种名词或者技术实现搞的头大,于是自己准备整理下...
摘要:最近对服务器推送技术比较感兴趣,在网上也看了好些文章,由于每个人理解的不同,实现细节或者语言表达方式不同,本人被各种名词或者技术实现搞的头大,于是自己准备整理下。定时器就可以实现,每次请求如果服务器端有更新数据则响应到客户端。 最近对服务器推送技术比较感兴趣,在网上也看了好些文章,由于每个人理解的不同,实现细节或者语言表达方式不同,本人被各种名词或者技术实现搞的头大,于是自己准备整理下...
摘要:不得不说确实是一个好东西,由它的出现使得端新技术不断产生,就属于这么一个技术,这个技术有时叫做反向,有时叫做服务器推技术,嗯,不要被牛逼闪闪的名词吓倒,其实没那么难。 不得不说Ajax确实是一个好东西,由它的出现使得WEB端新技术不断产生,Comet就属于这么一个技术,这个技术有时叫做反向AJAX,有时叫做服务器推技术,嗯,不要被牛逼闪闪的名词吓倒,其实没那么难。 先看一下维基的解释:...
摘要:轮询通过轮询,浏览器定期发送请求并立即接收响应这项技术是浏览器首次尝试传递实时信息。该协议由两层组成记录协议和握手协议。安全套接层及其继任者传输层安全,是为网络通信提供安全及数据完整性的一种安全协议。移除了开销大幅度减轻了复杂度。 Web Sockets定义了一种在通过一个单一的 socket 在网络上进行全双工通讯的通道。它不仅仅是传统的 HTTP 通讯的一个增量的提高,尤其对于实时...
阅读 3304·2023-04-25 20:43
阅读 1869·2021-09-30 09:54
阅读 1734·2021-09-24 09:47
阅读 3043·2021-09-06 15:02
阅读 3652·2021-02-22 17:09
阅读 1397·2019-08-30 15:53
阅读 1585·2019-08-29 17:04
阅读 2111·2019-08-28 18:22
极致性价比!云服务器续费无忧!
Tesla A100/A800、Tesla V100S等多种GPU云主机特惠2折起,不限台数,续费同价。
NVIDIA RTX 40系,高性价比推理显卡,满足AI应用场景需要。
乌兰察布+上海青浦,满足东推西训AI场景需要