Question

在我的应用程序中，我有一个导入数据功能。目前，当有人上传CSV文件并提交页面时，他们会看到指示文件正在上传的微调器。大约一分钟左右，导入完成后页面将刷新。

我想通过添加导入的进度条使页面更友好一些。我的导入类遍历CSV中的每一行以导入数据，所以我添加了一些代码，以便在每几个循环之后，它会将百分比写入文件，目的是我可以使用AJAX请求来读取提交并显示百分比。

我到了想要阅读文件的地步，但是我提交表单后发送的任何AJAX请求都没有回复给我。似乎服务器知道该页面将被刷新，所以它甚至没有打扰。查看Chrome开发人员工具中“网络”标签中的请求会显示状态（待定），但这些请求都不会更改。

在提交表单后，有什么方法可以继续制作AJAX请求吗？作为旁注，应用程序需要支持IE9 +，因此使用File API通过AJAX提交文件不是一种选择。

Answer 1

如果您使用会话，则会发生以下情况：第一个请求阻止临时会话文件进行读取。后续请求必须等待锁定在服务器开始执行之前被释放。

这也意味着您无法使用会话进行进度显示。

另请注意，等待时间的一个重要部分是由于上传文件。根据您的治疗，上传时间可能比治疗时间更重要。因此，您的进度条不会给出您期望的结果。

Answer 2

假设您的页面被称为importdata.php，并且您正在该页面的脚本中执行类似的操作以开始监控进度：

importForm.onsubmit = monitorProgress;

您可以做的是托管iframe中的整个页面。创建一个新页面来托管iframe。如果您希望将网址保持不变，请将原始网页重命名为importdata_form.php并调用新网页importdata.php。在新页面中，包含一个脚本块和填充页面的iframe。将<title>从原始页面移动到新页面。将iframe的src设置为importdata_form.php。将monitorProgress函数移动到新页面中的脚本块。然后更改原始页面中的onsubmit处理程序以引用父窗口中的函数（请参阅window.parent）：

importForm.onsubmit = parent.monitorProgress;

您的新页面可能如下所示：

<!doctype html>
<html>
    <head>
        <title><!-- move title from original page to here --></title>
        <style>
            iframe {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                border: 0 none;
            }
        </style>
        <script>
            function monitorProgress() {
                // your ajax calls here
            }
        </script>
    </head>
    <body>
        <iframe src="importdata_form.php"></iframe>
    </body>
</html>

上传文件后，我怎么还能使用AJAX？

2 个答案: