让前端与后端异步起来

有时,后台处理批量数据,需要一定的时间,如果处理一部分往前台送一部分,用户体验要好一些,这样就用到这个知识点了。

后台代码中下:

[HttpGet("/getents")]public async IAsyncEnumerable<Entity> GetEntitys(){           for (var i = 0; i < 20; i++){_logger.LogInformation(i.ToString());await Task.Delay(RandomNumberGenerator.GetInt32(100, 500));yield return new Entity { ID = i, Time = DateTime.Now };}}

前端代码,从后台取到数据后,展现在前端(我这里是拼接,用vue也可以),因为数据没有取完,所以不是一个完整的json字符串,需要在最后加上“]”

@{ViewData["Title"] = "Home Page";
}
<div class="text-center"><h1 class="display-4">实时加载</h1><div id="divmessage" class="alert alert-warning" role="alert"><span id="message"></span></div><ul id="data" class="list-group"></ul>
</div>
@section Scripts{
<script>$(function() {var xhr=new $.ajaxSettings.xhr();  xhr.onreadystatechange=function(){if(xhr.readyState==3){var list=JSON.parse(xhr.responseText.replace(']','')+']');$("#message").html("加载中…… 【"+list.length+"】")var html=""$(list).each(function(index,item){html+='<li  class="list-group-item">'+item.id+"  "+item.time+"</li>"})$("#data").html(html)}else if(xhr.readyState==4){var list=JSON.parse(xhr.responseText.replace(']','')+']');$("#message").html("加载完成,共"+list.length+"条记录")$("#divmessage").removeClass("alert-warning")$("#divmessage").addClass("alert-success")}}xhr.open('GET', '/getents')xhr.send()});
</script>
}

效果是后台处理一块,就返回一块,前台展示一块,因为这里不能放视频和动图,所以可以自行运行结果看一下(.net6),或脑补一下效果。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/295381.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

六款小巧的HTTP Server[C语言] - 贵贵的博客 - 开发|架构|开源|共享

六款小巧的HTTP Server[C语言] - 贵贵的博客 - 开发|架构|开源|共享六款小巧的HTTP Server[C语言]keminar 发表于 2010-02-05 23:14:41. 发表在:开源软件1、micro_httpd - really small http server 特点&#xff1a; 支持安全的 .. 上级目录过滤 支持通用的MIME类型 …

那些年你追过的电影竟然登上顶刊封面! 盘点思路新奇的顶刊论文

全世界只有3.14 % 的人关注了爆炸吧知识来源 | 募格课堂科研&#xff0c;是一项严肃且要求一丝不苟的研究工作。但你可曾想过&#xff0c;那些年自己追过的像葫芦娃、孙悟空等充满中国风元素的影视作品&#xff0c;竟然被科研人作为idea&#xff0c;不仅有理有据地研究还发了顶…

【Linux学习009】脚本编程之变量、条件测试和条件判断

一、Bash环境变量bash中变量有四种种类型&#xff1a;环境变量、本地变量&#xff08;局部变量&#xff09;、位置变量、特殊变量。1.环境变量环境变量作用范围最广&#xff0c;所有子bash进程都能够访问环境变量中的值&#xff0c;定义环境变量的方法是使用export关键字。举例…

特定视图呈现时发生的事件顺序

特定视图呈现时发生的事件顺序&#xff1a; 动作方法返回的ViewResult执行 ViewResult 使用ViewEngineCollection查找视图 ViewEngineCollection给每个注册的IViewEngine解析该视图的机会。顺序由集合中视图引擎的顺序决定 ViewResult使用ControllerContext&#xff0c;视图名称…

java 学习思路_Java的学习思路

1 开发环境Java SDK 下载和安装2 jvm 虚拟机运行原理3 编程基础 标识符命名规范4 Java数据类型5 运算符6 分支语句(if,switch)7 循环语句(for,while)8 函数的定义方法9 面向对象基础 面向对象与面向过程语言之间的区别10 面向对象基本思想(封装)11 类的定义方法12 对象和类的关…

22504!Windows 11 新预览版发布

面向 Dev 频道的 Windows 预览体验成员&#xff0c;微软现已发布 Windows 11 预览版 Build 22504。Windows 11 Insider Preview Build 22504 主要变化如下&#xff1a;1.为了进一步个性化 Windows 11 的文本输入体验&#xff0c;微软为触摸键盘带来了 13 个全新主题&#xff0c…

Nginx指南和配置详解

Nginx指南 Nginx ("engine x") 是一个高性能的 HTTP 和 反向代理 服务器&#xff0c;也是一个 IMAP/POP3/SMTP 代理服务器。 Nginx 因它的稳定性、丰富的功能集、示例配置文件和低系统资源的消耗而闻名了。更多的请见官方wiki&#xff1a; http://wiki.nginx.org/Ma…

ERROR (ClientException): Unexpected API Error

ERROR (ClientException): Unexpected API Error ERROR (ClientException): Unexpected API Errorposted on 2016-02-03 11:12 秦瑞It行程实录 阅读(...) 评论(...) 编辑 收藏 转载于:https://www.cnblogs.com/ruiy/p/5179253.html

静态路由(一)

路由器的角色&#xff1a; 路由器是一种专门用途的计算机&#xff0c;在所有数据网络的运作中都扮演着极为重要的角色。路由器主要负责连接各个网络&#xff0c;它的功能有&#xff1a; l 确定发送数据包的最佳路径 l 将数据包转发到目的地 &#xff08;路由器是多个 IP 网络…

火了!女教授把自己P成女娲,登上学术期刊封面

全世界只有3.14 % 的人关注了爆炸吧知识2020年4月&#xff0c;江苏师范大学化学与材料科学学院副院长石枫教授在 Chinese Journal of Chemistry 上发表了题为 Axially Chiral Aryl-Alkene-Indole Framework: A Nascent Member of the Atropisomeric Family and Its Catalytic A…

Binding在WPF中的使用

闲来无事&#xff0c;不想打DOTA&#xff0c;在这里小小研究下wpf中关于Binding的东西。 咯咯 在我们印象中&#xff0c;Binding的意思是“绑定”&#xff0c;这个“绑”大概取自于Bind这个单词吧&#xff0c;这么理解的话就是以音译英了&#xff0c;没什么实际意义。 Bind这个…

WPF 模仿IconPacks库写图标按钮

先上原链接&#xff0c;一个很不错的wpf图标库 : https://github.com/MahApps/MahApps.Metro.IconPacks提供了大量的图标可以用&#xff0c;如下图&#xff1a;&#xff08;部分截图&#xff09;简单分析了一下代码&#xff0c;并模仿它写一个图标类和简单的使用示例&#xff1…

java线程死锁 cpu 100%_一文学会Java死锁和CPU 100% 问题的排查技巧

做一个积极的人编码、改bug、提升自己我有一个乐园&#xff0c;面向编程&#xff0c;春暖花开工欲善其事&#xff0c;必先利其器00 本文简介作为一名搞技术的程序猿或者是攻城狮&#xff0c;想必你应该是对下面这两个问题有所了解&#xff0c;说不定你在实际的工作或者面试就有…

3D版的TagView,效果很赞

在gitHub看到的&#xff0c;感觉效果不错。 看看效果&#xff1a; Demo&#xff1a;http://download.csdn.net/detail/u012808234/9426716

Nginx配置相关结构划分的技巧和禁止IP访问

Nginx配置相关结构划分的技巧原文来自&#xff1a;http://developer.51cto.com/art/201003/190953.htm Nginx配置需要一定的技巧&#xff0c;我们在不断的使用和维护中就会发现这些&#xff0c;接下来就向大家介绍下有关Nginx配置的相关技巧。我目前的Nginx配置是拆散的&#x…

5部高分学科纪录片,在家也能受益良多!

全世界只有3.14 % 的人关注了爆炸吧知识▌导读本文为同学们整理了5部高分经典学科纪录片&#xff0c;这不仅是课堂学习的补充与延伸&#xff0c;更是开拓视野、激发学习内驱力的绝佳利器。建议收藏&#xff01;&#xff08;关注视频号少年数学家&#xff0c;呈现最直观的数学&a…

ubuntun中文读书笔记

在Linux中&#xff0c;所有设备都是用文件名来表示的。Linux中只有文件和目录&#xff0c;所有的文件和目录都以倒树状结构挂载在”/”(根目录)目录下。在Linux中如果要执行以命令可以通过 # 命令名 [-选项] 参数。在命令名、选项或者参数之间都是至少要有一个空格&#xff0c;…

开发Android应用 提升性能的小技巧

前  言 2015年&#xff0c;Android OS 目前在手机操作系统的市场占有率已达59%&#xff0c;权威机构预计&#xff0c;Android市场占有率在2016年将达到63%&#xff0c;由于Android的开放性&#xff0c;未来占有率还将不断增加&#xff0c;Android的NDK支持C/C语言&#xff0c…

SQL Server 中使用 Try Catch 处理异常

1 CREATE TABLE ErrorLog(2 errNum INT,3 ErrSev NVARCHAR(1000),4 ErrState INT,5 ErrProc NVARCHAR(1000),6 ErrLine INT,7 ErrMsg NVARCHAR(2000)8 )9 10 CREATE PROCEDURE ProcErrorLog 11 AS 12 BEGIN 13 SELECT 14 ERROR_NUMBER() AS ErrNum,--返回导致运…

Hibernate 对象的三种状态

Hibernate 对象的三种状态 瞬时&#xff08;transient&#xff09;: 由new操作符创建&#xff0c;且尚未与Hibernate Session关联的对象被认定为瞬时&#xff08;Transient&#xff09;的。瞬时&#xff08;Transient&#xff09;对象不会被持久化到数据库中&#xff0c;也不会…