服务器推送之SSE简单使用

最新推荐文章于 2024-04-19 10:23:47 发布
最新推荐文章于 2024-04-19 10:23:47 发布
阅读量476 收藏 1
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/q22200p/article/details/105526111
版权

前端

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <h1>获得服务器更新</h1>
    <div id="result"></div>
    <script>
        if (typeof (EventSource) !== "undefined") {
            var source = new EventSource("/HTML5/tt");
            source.onmessage = function (event) {
                document.getElementById("result").innerHTML += event.data + "<br />";
            };
        }
        else {
            document.getElementById("result").innerHTML = "抱歉，您的浏览器不支持 server-sent 事件 ...";
        }
    </script>
</body>
</html>

后端

public class HTML5Controller : Controller
    {
        //
        // GET: /HTML5/

        public ActionResult Index()
        {
            return View();
        }

        public void tt()
        {
            Response.ContentType = "text/event-stream";
            Response.Expires = -1;
            Response.Write("data: " + DateTime.Now.ToString() + "\n\n");//注意结束要两个\n
            Response.Flush();
        }
    }

 

vvull
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue-sse:一个Vue插件，用于使用服务器发送的事件（EventSource）
04-27
VueSSE VueSSE通过为基础提供高级接口，可以轻松使用。 安装 # npm npm install --save vue-sse # OR yarn yarn add vue-sse // in main.js import VueSSE from 'vue-sse' ; // using defaults Vue . use ( VueSSE ) ; // OR specify custom defaults (described below) Vue . use ( VueSSE , { format : 'json' , polyfill : true , url : '/my-events-server' withCredentials : true , } ) ; 快速开始 this . $sse . create ( '/my-events-serv
在vue2中使用SSE（服务器发送事件）
热门推荐
weixin_50163731的博客
02-07 1万+
在vue2中使用SSE（服务器发送事件）
nginx 反代Server-Sent Events （sse）出现数据截断问题解决
路过君的博客
04-19 514
使用Nginx配置反向代理处理SSE请求时，偶尔会发生消息内容被截断，客户端无法正确接收消息的情况。
SpringBoot / Vue 对SSE的基本使用（简单上手）
Jokers_lin的博客
09-07 6777
SSE技术是基于单工通信模式，只是单纯的客户端向服务端发送请求，服务端不会主动发送给客户端。服务端采取的策略是抓住这个请求不放，等数据更新的时候才返回给客户端，当客户端接收到消息后，再向服务端发送请求，周而复始。注意：因为EventSource对象是SSE的客户端，可能会有浏览器对其不支持。是 HTML5 遵循 W3C 标准提出的客户端和服务端之间进行实时通信的协议。浏览器建立的连接中会看到服务器推送到客户端的消息内容及ID等基础信息。是 HTML5 的一部分，提供了一种双向通信的机制。
前端实现消息推送、即时通信、SSE、WebSocket、http简介
violetta521的博客
06-15 4310
场景。
前端SSE技术及简单应用
ShenqQiu的博客
11-17 655
前端SSE技术介绍及应用
Go-Plasma:通用服务器推送中间件使用gRPC流和服务器发送事件SSE
08-13
Plasma: 通用服务器推送中间件使用gRPC流和服务器发送事件（SSE）
SSE(服务器推送事件)的案例，使用Java封装了请求发送，异常处理，拦截等基于sse的公共能力
最新发布
04-22
SSE 与 WebSocket 作用相似，都是建立浏览器与服务器之间的通信渠道，然后服务器向浏览器推送信息。 总体来说，WebSocket 更强大和灵活。因为它是全双工通道，可以双向通信；SSE 是单向通道，只能服务器向浏览器...
浅谈html5之sse服务器发送事件EventSource介绍
09-27
本篇文章主要介绍了浅谈html5之sse服务器发送事件EventSource介绍，具有一定的参考价值，有兴趣的可以了解一下
python_sse：使用FastAPI实现服务器发送的事件
02-16
python_sse：使用FastAPI实现服务器发送的事件
php-sse:一个简单高效的库通过PHP实现HTML5的服务器发送的事件，用于将事件从服务器实时推送到客户端，比Websocket更容易，而不是AJAX请求
05-07
一个简单高效的库通过PHP实现了HTML5的服务器发送的事件，用于将事件从服务器实时推送到客户端，并且比Websocket更容易，而不是AJAX请求。 要求 PHP 5.4或更高版本 通过Composer（ ）安装 composer require " hhxsv5...
使用sse技术构建chatgpt应用
qq_33211006的博客
05-27 1644
前端用的是vue, 由于源生sse并不支持post的方式请求，因此使用fetch-event-source包进行post的请求。后端用的是langchain+fastapi，用到了starlette的一个插件包，sse_starlette返回。最近流行的ChatGPT,好奇他的流文字是怎么传输，所以去研究了，并复现了一下。
sse服务器推送性能,SSE 服务端向客户端推送
weixin_36073654的博客
08-10 1807
传统的ajax都是由客户端主动去请求，服务端才可以返回数据而sse是建立一个通道，并且在断线后自动重连，由服务端去推送，不需要客户端去主动请求，只需要建立通道websocket是双向通信 客户端可以利用通道推送数据给服务端 服务端也可以推送数据给客户端在有些场景，例如用户端调起支付，没有返回支付通知，需要向后端请求，获取这笔订单的支付结果例如微信公众号内使用支付宝支付，是调不起来的，只能引导用户浏...
SSE实现消息实时推送，前端渐进式学习、实践，真香
qq_41885295的博客
01-31 3145
基于大模型开发的会话体验流式输出的的经验总结，实现类似gpt的打字机输出效果。主要应用技术是event-source、fetch-event-source
Springboot之整合SSE实现消息推送
qq_43842093的博客
06-24 3942
SSE技术是基于单工通信模式，只是单纯的客户端向服务端发送请求，服务端不会主动发送给客户端。服务端采取的策略是抓住这个请求不放，等数据更新的时候才返回给客户端，当客户端接收到消息后，再向服务端发送请求，周而复始。 2.服务端整合 Controller： ServiceImpl 3. Nginx配置 如果项目中使用nginx对后端服务做了代理，nginx代理转发后，默认会在1min的时候断掉长链接，SSE需要设置自己的长链接时间，则需要在nginx中进行配置； 在反向代理的location块中加入如下配置 4
01 Vue+axios+SSE组件功能简绍
归根结底不优秀的博客
07-30 7424
Vue前端框架： 在前端开发中，经常要通过js代码来进行一些逻辑操作，最终还要把这些逻辑操作的结果展现在页面中，这需要我们通过操作DOM来完成。而Vue这种MVVM模式的框架，通过viewmodel实现数据双向绑定，让数据自动地双向同步，从而避免了操作DOM的过程。 第一个vue程序： 1. 导入开发版本的Vue.js 2. 创建Vue实例对象，设置 el 属性和 data 属性 3. 使用模板语法把数据data渲染到页面 el 挂载点： el是用来设置Vue实例挂载的元素 Vu.
后端主动向前端推送消息--SSE
weixin_44690156的博客
02-16 6296
最新项目中需要用到消息的及时推送，在页面的实时展示，之前用过WebSocket这种及时通讯方式，但是WebSocket这种方式对于后端来说相对复杂。所以这次考虑通过其他的方式来实现，于是有了SSE。 SSE本质 严格说，HTTP 协议无法做到服务器主动推送消息。但是，有一种变通方法，就是服务器向客户端声明，接下来要发送的是流消息（streaming）。 也就是说，发送的不是一次性的数据包，而是一个数据流，会连续不断地发送过来。这时，客户端不会关闭连接，会一直等着服务器发送新的数据流，视频播放就是这样的例子。
Android端消息推送总结：实现原理、心跳保活、遇到的问题等
lyj1005353553的专栏
05-09 9802
前言 最近研究Android推送的实现, 研究了两天一夜, 有了一点收获, 写下来既为了分享, 也为了吐槽. 需要说明的是有些东西偏底层硬件和通信行业, 我对这些一窍不通, 只能说说自己的理解. 为什么要研究Android推送技术? 主要还是毕业设计要做一个即时通信app, 我是不喜欢做什么社交app的, 也就象牙塔里的人想得出来, 说实话有这功夫还不如钻研一个小技术点, 把一个点研究
sse java8_HTTP 服务器消息推送之SSE
06-10
SSE 是一种基于 HTTP 的服务器推送技术，通过在服务器和客户端之间建立一个持久化的 HTTP 连接，服务器可以向客户端发送事件消息。SSE 是一种轻量级的推送技术，适用于需要实时通知用户的 Web 应用程序，例如实时...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值