在 php 脚本准备下载文件时添加加载栏答案

【问题标题】：Adding a loading bar while php script is preparing a file for download在 php 脚本准备下载文件时添加加载栏
【发布时间】：2011-09-19 22:50:31
【问题描述】：

我是 php 的新手，但我设法创建了一个名为“welcome.php”的页面，该页面从表单中获取您的名字和姓氏，然后将它们放在一个简单的文本文件中并发回给您下载：

<?php 
if ($_POST) {

    header("Content-Type: application/txt");
    header('Content-Disposition: attachment; filename="welcome.txt"');
    echo "Welcome, ";
    echo $_POST['firstName']. " " . $_POST['lastName']; 

    // exit the script to make the form not appear in the downloaded file
    exit;
}

?>

<form action="" method="post">
First Name:  <input type="text" name="firstName" /><br />
Last Name: <input type="text" name="lastName" /><br />
<input type="submit" name="submit" value="Submit me!" />
</form>

我要做的是在生成此文本文件时添加一个进度条，当弹出“保存文件”对话框时达到100％。我知道在这种情况下加载时间非常短，但我稍后会对其进行修改以制作更大的文本文件。我想知道您是否可以为我指出正确的方向或提供几行代码来提供帮助，记住我只学习了 2 天的 php。我相信你可以使用一种叫做flush的东西，但我不确定如何将它集成到我的页面中。谢谢！

请注意，我的页面也有一个小故障，即文本文件还输出表单的 html，有人知道如何阻止这种情况发生吗？

【问题讨论】：

文本文件包含表单，因为在echo 调用之后，PHP 解析器从if 语句中出来，然后echos 出来了所有的HTML。您需要添加一个else 来说明如果$_POST 则发送文本文件，否则继续显示HTML 页面。
@Alex：我解决了这个小问题。
所以我想我已经通过像这样回显 html 来修复它？ 'else { echo "
";}
不，你不需要echo整个表格，你可以像this gist那样做。

标签： php progress-bar text-files

【解决方案1】：

其实 PHP 并没有提供这样的功能。

要显示进度条，您可以试试这个：

在执行长时间运行的文件生成过程时，在当前用户会话

完成百分比值

在显示下载表单的页面上，添加一个调用progress.php脚本的iFrame
progress.php脚本需要生成网页，需要自动神奇地重新加载
progress.php 脚本需要从 session 中读取当前的 progress-value 并绘制一个进度条图形，直观地表示进度。

虽然这是一个仅限 PHP 的解决方案，但您可以使用 JS / AJAX 准备另一个解决方案。

HTML 自动重新加载应该是这样的：

<meta http-equiv="refresh" content="1; URL=http://myServer.com/progress.php">

【讨论】：

感谢您的回复。我只是在找到“完成百分比”功能时遇到了一些麻烦。一旦我明白了，我是否认为这只是每隔 200 毫秒调用一次，然后将其值传递给像下面 Iony 建议的 jqueryui 进度条之类的东西？非常感谢您的贡献！
看看这里：db.org/demo/2003/02/17/progress-bar。对不起。目前没有其他可用的资源。
另外，PHP 的 GD 库是你的朋友：php.net/manual/en/image.examples-png.php
感谢您的示例，但是我想到的进度条旨在显示服务器处理文件的进度，而不是用户输入数据的进度。当我点击提交时，屏幕顶部的图标（在 Firefox 中）显示一个灰色的逆时针加载轮，直到弹出保存文件对话框。我认为百分比栏目前可能有点超出我的范围，那么有没有办法在浏览器中模仿这种风格？我有一个轮子gif，并且知道如何显示和隐藏它，我只需要在弹出对话框时知道如何隐藏它？
我的提示提出了一种显示服务器进度的方法。该脚本从会话中读取数据 - 在服务器上 - 然后准备图形。

【解决方案2】：

你可以使用http://jqueryui.com/demos/progressbar/，它是基于 JavaScript 的，你可以通过 AJAX 发送你的进度，就像 Stefan 说的那样。

【讨论】：

... 只要启用 JS。这些天应该可以在任何浏览器上使用。