我一直在搜索和操纵一些xhr ajax的东西,但我仍然没有找到任何解决方案。
我所拥有的是在jQuery的AJAX中加载的内容。我要做的是显示一个百分比加载器。我已经设置了beforeSend
加载图标,但由于我有很多数据(文本),我的客户认为它卡住了…
我已经尝试过这个,这个,但它只显示百分比当一切都已经加载(所以它显示100%
),但这是因为客户端-服务器之间的通信不是持久的我猜。
是否有一种方法来做到这一点使用PHP和jQuery ?如果没有,我该怎么做呢?
下面是我的代码:
$.ajax({
url: ajax_var.url,
type: 'POST',
data: dataString,
beforeSend: function() {
$("#loader").html("<i class='loading icon'></i> Loading...");
},
success: function(data) {
$("#loaded_data").html(data);
},
error: function(e) {
console.log(e);
}
});
谢谢
简短的回答是:不。长的答案是——是的,但前提是你做了大量的工作,并且你了解幕后发生的事情。
AJAX在HTTP上工作,我们知道HTTP是无状态协议。这意味着一旦你要了什么,你就会得到它。不管它的大小。你不会以这样一种方式得到响应,你可以计算有多少数据(服务器必须告诉你content-length
是什么)。
换句话说,无论响应是1个字符还是1TB的数据,都是一样的。您请求它,直到它返回—您不能与数据交互。这就是为什么你不能显示任何形式的单个请求的进度条,这就是为什么它只在100%加载时才出现。你可以显示加载图标,并在所有东西到达后删除它,就是这样。
这个问题的解决方案在于执行多个请求。这个工作流的一个例子是:
- 向服务器询问内容的长度
- 分块内容。如果要传输的文本长度为10KB,则将内容分成10个块
- 向服务器请求每个数据块
- 每一块内容代表10%
- 当块到达时,以相同的百分比增加加载器
- 一旦数据到达,将其合并并显示给用户
(注意- 10KB的例子作为一个例子来解释这个原理,这绝不是任何形式的建议,将10KB的数据块分成10个请求,每个请求1kb)。
这种方法的缺点是,当然,你通过发出多个请求来强调服务器,并且你依赖于客户端将数据"组装"成有意义的东西。
还有其他的方法,但是如果你需要AJAX和普通的jQuery -你没有太多的选择。