.Net Framework4.5中Asp.net mvc使用Singal R轮训实现导入进度条功能

我的项目需求是:在.net4.5中用mvc5实现上传xml文件,后台实时导入数据库时传到前台进度,进度条实现动态在走。

网上看了很多实现此需求的方法(服务器轮训向客户端发送消息)ajax、webscoket、singal等。

之前的代码是前段用定时器ajax去访问后台的进度数据。然后给进度条赋值。发现有时候ajax请求总出现pending的状态。

之前的缓存实现代码:

var cc=true;

window.setTimeout(function () {
$.ajax({
url: "/Import/GetImportRate",
dataType: "json",
type: "post",
async: true,
success: function (data) {
if (data == null || data.rate == null) {

}
else if (data.rate != "100" || data.rate != 100) {

$('#p').progressbar('setValue', parseInt(data.rate));
$("#ppp").text("正在导入--" + data.currentname);
}
else {
}
}
});
if (cc) {
setTimeout(arguments.callee, 2000);
}
}, 2000);

 public JsonResult GetImportRate(){var rate = HttpRuntime.Cache.Get("Progress");var cutname = HttpRuntime.Cache.Get("CurrentName");if (rate == null){rate = "0";}if (cutname == null){cutname = "";}return Json(new{rate = rate,currentname = cutname,});}

将数据保存在Cache中,每次ajax获取数据。

下面使用singal:

1.首先需要在setup中注册singalr

2.创建一个Hubs文件夹,其中创建ChatHub类,继承Hub

using System;
using System.Web;
using Microsoft.AspNet.SignalR;
namespace SignalRChat
{public class ChatHub : Hub{public void Send(string name, string message){
            Clients.All.addNewMessageToPage(name, message);}}
}

3.前段代码:

在需要用到的页面引用js

<script src="~/Scripts/jquery.signalR-2.0.3.min.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="~/signalr/hubs"></script>
<!--SignalR script to update the chat page and send messages.-->

然后js代码

    $(function () {var chat = $.connection.chatHub;     chat.client.addNewMessageToPage = function (name, message) {//此方法对应着ChatHub类中的send方法,在此处理服务器
//传到客户端的信息。
            };          $.connection.hub.start().done(function () {               });});

4.在其他的Controller中使用Send方法去实现服务器消息传到客户端。

var context = GlobalHost.ConnectionManager.GetHubContext<ChatHub>();

context.Clients.All.addNewMessageToPage(name, message);

5.我项目中最后实现的实时显示进度条进度和相关代码:

 1  var chat = $.connection.chatHub;
 2         chat.client.addNewMessageToPage = function (name, rate) {
 3             if (rate != "100" || rate != 100) {
 4                 $('#p').progressbar('setValue', parseInt(rate));
 5                 $("#ppp").text("正在导入--" + name);
 6             }
 7         };
 8         $.connection.hub.start().done(function () { });
 9
10
11         $("#btnSave").click(function () {
12             if (filenamelist == "" || filenamelist == null) {
13                 return;
14             }
15             else {
16                 $.ajax({
17                     url: "/Import/ImportSingleFiles?allfilename=" + escape(filenamelist),
18                     dataType: "json",
19                     type: "post",
20                     success: function (data) {
21
22                         if (data.result == true) {
23                             parent.layer.msg("全部导入成功!");
24
25                             $('#p').progressbar('setValue', parseInt(100));
26
27                         }
28                         else {
29                             parent.layer.msg("导入出错!请从新选择文件!");
30                             $("#ppp").text("导入出错!请从新选择文件!");
31                             $("#ppp").css("color", "red");
32                             $("#tip").hide();
33                             alert(data.message);
34
35                             $("#btnBack").show();
36                         }
37                     }
38                 })
39             }
40         });

6.实现结果

转载于:https://www.cnblogs.com/melodygkx/p/11498489.html

.Net Framework4.5中Asp.net mvc使用Singal R轮训实现导入进度条功能相关推荐

  1. android qq语音按钮,科技教程:如何在手机QQ中使用新版QQ语音进度条功能?

    如今越来越多的小伙伴对于如何在手机QQ中使用新版QQ语音进度条功能?这方面的问题开始感兴趣,看似平静的每一天,在每个人身上都在发生着各种各样的故事,因为大家现在都是想要了解到此类的信息,那么既然现在大 ...

  2. ASP.NET MVC 学习6、学习使用Code First Migrations功能,把Model的更新同步到DB中

     参考:http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-new-field-to-th ...

  3. Android中通过SeekBar手动控制ProgressBar与模拟下载自动更新进度条

    场景 进度条的常用场景: 通过SeekBar拖动进而更新ProgressBar进度条,比如调整音量效果等. 模拟下载实现自动更新进度条. 注: 博客: https://blog.csdn.net/ba ...

  4. pcmcia oracle vm vitualbox 虚拟机,virtualbox中调整虚拟机的硬盘大小 与 CentOS卡在进度条启动缓慢进不去解决办法...

    由于经常需要在Linux虚拟机下测试一些环境,安装的东西比较多,导致之前分配给Linux虚拟机中的某个分区的空间不够用了,但是又不想重装系统,想直接给空间不足的那个分区调整空间.用的是Centos系统 ...

  5. java进度条_Java实现命令行中的进度条功能

    前言 最近在写一个命令行中的下载工具,既然是下载文件用的,那么实时显示下载进度是非常有必要的.因此,就有了这里对进度条的实现尝试. 预览图 还是先预览下效果图吧. 这里是cmd里面的效果,总体看着还行 ...

  6. 敏捷开发中asp.net MVC的开发次序感受(先开发View?先开发Model?先开发Controller!)...

    各种思路和顺序都试过. 最开始时先编写Model,毕竟Model是所有一切的基础,再说没有Model,Controller里边用到该怎么办. 后来改成先编写View,View才是用户能看到的东西啊,不 ...

  7. WinForm中 事件 委托 多线程的应用【以一个下载进度条为例】

    第一步:首先我们创建一个winfor的项目 第二步:我们建一个窗体 在一个窗体里面 打开一个另外的窗体 另外的窗体有一个按钮 点击后就开始下载 下载完成后 在注册窗体上面 显示下载完成(达到在一个窗体 ...

  8. python中莱布尼茨计算圆周率_python圆周率盘算(带进度条)

    一.要求: 1.盘算到圆周率后面越多位越好. 2.用进度条显示盘算的进度. 3.要求给出圆周率Π的详细盘算方法和注释. 二.算法: 1.拉马努金公式: 2.高斯-勒让德公式: 设置初始值: 频频执行以 ...

  9. 在html中怎么用圆形渐变,css怎么实现圆形渐变进度条效果

    css怎么实现圆形渐变进度条效果 发布时间:2021-03-17 10:29:57 来源:亿速云 阅读:129 作者:小新 这篇文章给大家分享的是有关css怎么实现圆形渐变进度条效果的内容.小编觉得挺 ...

最新文章

  1. 第二个冲刺期的第七天
  2. Python脚本完美解决Linux环境解压.zip文件乱码问题
  3. android应用兼容报告,手机资讯导报:华为发布国内首份Android7.0应用兼容报告
  4. 成功解决xlrd.biffh.XLRDError: Unsupported format, or corrupt file: Expected BOF record; found b‘Debug is
  5. 前端学习(3096):vue+element今日头条管理-回顾
  6. 计算Python运行时间
  7. 呼伦贝尔学院计算机宿舍,2020年呼伦贝尔学院新生宿舍环境条件,大一新生男生女生宿舍内部图片【多图】...
  8. Gesture APIs-Furthering Windows Mobile 6.5 Touch Gesture Framework
  9. Partition List -- LeetCode
  10. Atitit 数据融合merge功能v3新特性.docx
  11. python:DataFrame连续取前23列数据,或者连续取前2行数据,或者取某行某列数据
  12. diff 比较文件异同命令
  13. java 回调函数实现_Java实现的回调函数
  14. 安装前端插件 FeHelper
  15. 2021Android高级面试题总结,挥泪整理面经
  16. verilog学习笔记:简单的数据选择器modelsim仿真
  17. 大数据工程师、BI工程师、数据库工程师什么区别?
  18. 利用cesium模拟台风移动路径——以利奇马台风为例
  19. 解决TinyMCE富文本编辑器上传视频后在编辑区域内不能预览视频,被替换成img标签的问题
  20. 通达OA二次开发手册

热门文章

  1. python 学习手册重点
  2. python包的管理(添加的3种方式 删除包)
  3. Ext中namespace的作用
  4. Asp.NET生成静态页面并分页
  5. [概率论]如何通俗地理解“最大似然估计法”?
  6. python存储数据丢失的存储器是_数据缺失值的4种处理方法
  7. leetcode —— 面试题36. 二叉搜索树与双向链表
  8. 逻辑回归、线性回归直观感受
  9. 牛客网刷题 --- 输入输出数据处理
  10. 深度学习篇-Keras(初级)