javascript - jQuery/ASP - 使用 cookies 上传进度

Question

我想知道我的接收上传进度指示的解决方案是否有效，如果可能，我的处理方式是否正确？它不必非常准确，我只需要一个旋转的动画图标。

1) 在上传表单页面////////

Submit upload form & files to processing page.

2) 在处理页面/////////

For Each file In myFileArray Then
   ' Save the file
   ' Add 1 to a cookie called progressReport
Next

3) 在上传表单页面///////

checkTimer = window.setInterval(function () {
    var cookieContents = $.cookie('progressReport');
    if (cookieContents != "")
    $('#uploadProgress').html(cookieContents + ' files uploaded');
}, 2000);

---- 更新 ----

由于下面的答案，我无法完成此操作，因为在页面完成处理之前不会写入 cookie - 这意味着用户在处理完成之前不会得到任何反馈。没用!

我改变了计划。这适合我的应用程序，但可能不适合某些应用程序。

1) 对服务器页面进行 AJAX 调用，创建唯一 ID 和名为“唯一 ID”的文件夹。完成后，将 ID 作为响应发回，将唯一 ID 添加到上传表单中的隐藏输入。

2) 用户提交文件，检查隐藏输入中是否存在 ID，然后发布到隐藏的 iFrame。提交后，每 1-5 秒对另一个服务器页面进行一次 AJAX 调用，检查该文件夹中有多少文件，将数量作为响应发回，更新进度面板。

Answer 1

它不会工作，因为:

For Each file In myFileArray Then
   ' Save the file
   ' Add 1 to a cookie called progressReport
Next

在所有文件完成之前不会将 cookie 写入浏览器。

您需要设计一种方法来开始从客户端逐个上传这些文件。您的处理页面仅收到一个文件；增加 cookie 中的值并完成响应。换句话说，您的处理页面最终会被 n 个文件调用 n 次。您的 JavaScript 代码每 2 秒读取一次 Cookie，并显示上次响应更新的值。