PHP AJAX File Upload Progress Meter Updates
Over the weekend my file upload progress meter code got lots of traffic. It seems it made it made it on the del.icio.us popular list as well as getting over a thousands diggs. To celebrate this i’ve updated the code.
The main new feature is giving you feedback without having to patch PHP. Now the patched version gives you more information such as upload speed and estimated time to completion. But we still provide some nice user feedback even without it now.
I also created some wiki pages to start the documentation process.
So here are the demo’s
With the patch and extension
Without the patch
To get upload speed you will need to download and install the PHP Upload Progress Patch and extension.
If you want to use the code you need to:
Install HTML_AJAX (pear install HTML_AJAX-alpha)
Download PAFUPMU and install it somewhere accessible.
Add the code to your page using demo.php as an example.
The basic way the code works is we take a form containing a file upload and submit it using a hidden iframe as a target. Doing this lets the upload happen in the background. Then we poll the server on a regular basis (say a 2 second interval) asking it for update status. If you have the patch+extension installed this gives you file upload speed etc. If you don’t have the extesion we stop making AJAX calls and just animate the status bar until the upload finishes in the iframe and tells us were done.
In demo.php we handle generating the current page and handling the upload in the same page. So we start by handling the update.
<?php
include 'UploadProgressMeter.class.php';
$fileWidget = new UploadProgressMeter();
if ($fileWidget->uploadComplete()) {
// output javascript to the iframe to send a final status to the main window
// this will catch error conditions
echo $fileWidget->finalStatus();
// move the file(s) where they need to go
exit;
}
?>
?>
This code only runs when your uploading so you’ll never see the output of it. This can make debugging problematic. One way around this is too hack the UploadProgressMeter to make the iframe non hidden.
Next you setup the JavaScript needed, first HTML_AJAX and then the uploaders JS.
<script type='text/javascript' src='demoserver.php?client=main,request,httpclient,dispatcher,json,util'></script>
<script type='text/javascript' src='demoserver.php?stub=UploadProgressMeterStatus'></script>
< ?php echo $fileWidget->renderIncludeJs(); ?>
demoserver.php is included in the source, you might want to name it something else if you actually use this code. Its just a page using HTML_AJAX_Server to register the UploadProgressMeterStatus class
You also need some CSS to style the progress bar. The only important thing is that .progressBar and .progressBar .bar are relatively positioned.
.progressBar {
position: relative;
padding: 2px;
width: 300px;
height: 40px;
font-size: 14px;
}
.progressBar .background {
border: solid 1px black;
width: 270px;
height: 20px;
}
.progressBar .bar {
position: relative;
background-color: blue;
width: 0px;
height: 20px;
}
Finally you finish things up by building a form. Note that you can include other elements in the form, but if they need to produce output you’ll have to manage calling back into the parent page from the iframes output.
<form action="demo.php" enctype="multipart/form-data" method="post" <?php echo $fileWidget->renderFormExtra(); ?>> < ?php echo $fileWidget->renderHidden(); ?> <label>Select File: </label> <div> < ?php echo $fileWidget->render(); ?> < ?php echo $fileWidget->renderProgressBar(); ?> </div> </form>
[...] Example of how to use the newest version is available in another post. Update There is a new version of this code that follows the same approach but uses HTML_AJAX instead of JPspan. You can view the new demo, and view the code in websvn. [...]
[...] There and Back again - AJAX File Upload Progress Meter The basic way the code works is we take a form containing a file upload and submit it using a hidden iframe as a target. Doing this lets the upload happen in the background. Then we poll the server on a regular basis (say a 2 second interval) asking it for update status. If you have the patch+extension installed this gives you file upload speed etc. If you don’t have the extesion we stop making AJAX calls and just animate the status bar until the upload finishes in the iframe and tells us were done. [...]
Thanks for great trick!
At http://tinyurl.com/s26tn you can see a way to do that without Ajax. A popup window will tell you the size upload updated to the second so you can have a better ”feeling’ that everything is going ok.
Is there a way to do this in reverse? Say I want to make sure a user checks out a file from my server. How do I ensure they actually got the file? How would you handle a partial download, disconnected or canceled, and force them to start over and make sure the file is still set as an in state until they actually download the entire file?
Im rather confused, what patch and extention are you talking about? Ive only managed to show an animated ststus bar…
Thanks
Micheal: sorry about that, i forgot to include the link to the extension, its added to the article now
Nice work!
How would we go about doing this for multiple files?
Ignore my last comment, I figured it out
Basically you need to create the $fileWidge->name field in a loop like:
renderFormExtra(); ?>>
Select File:
renderHidden();
for ($i=1;$iname=”upload_$i”;
print $fileWidget->render();
}
print ($fileWidget->renderProgressBar());
?>
and remove the bits in UploadProgressMeter.class.php that test if the id has already been set (so it is set again).
I also found a problem if $this->progressId was using $this->name the progress bar didnt complete, so I just set the progressID to a static name (like progress_bar) and then it worked.
That sorted it for me
Hmmm that seems to have stripped half the code I pasted… ah well
Oleh!
i’ve been looking for something like this for hours now,
and this is the first one that worked.
only trouble is, i don’t get how to set the output directory.
(where will the file be saved..).
can anyone help with this?
You handle dealing with the uploaded files below the comment:
// move the file(s) where they need to go
If you have any debugging output at this step you won’t see it, it happens in a hidden iframe.
If you want to see the iframe just call: $fileWidget->enableDebug(); at the top of the page
He, that script must be very impressive but i can’t get it work :o(
Thirst, the link demo without patch don’t work.
Second, my version of PHP on my server is 4.3.8, if i understand, i don’t need this patch because it say:
“Patch for php/sapi/apache2 (no longer needed since php-4.3.7 and php-5.0.0RC3)”
And when i launch test.php i have this error:
Fatal error: Call to undefined function: upload_progress_meter_get_info() in /home/httpd/vhosts/helpinfo.fr/subdomains/test/httpdocs/test.php on line 3
It seems that i need something. Please help, i don’t want to put some CGI on my server, this script is very good for me!
Ziplace: I’m pretty sure you need the patch, but even if you didn’t you would still need to compile the upload progress meter extension.
test.php is trying to run the extension code (what you really want to run is demo.php) getting that error means you don’t have the extension working correctly.
The link to the second demo is fixed now
Hi there.
Great script!
worked fine.. but somtimes the upload bar jumped to the end at the start. And when i tryed the script few days later. It only jumps to the end..so the bar doesn’t work anymore. Is it a common problem?
Thnx for the help
Michiel: Well if the extension isn’t working right on the server you won’t get real feedback and I did upgrade my server yesterday.
I’m not sure what your running into besides that.
I installed the patch and extension under debian.
Then i tested the demo with the extension en it worked.
Then i have tested you’re demo. It worked to. But suddenly after a few days it doesn’t work anymore.
It’s a weird problem. The error says that there is no file uploaded.
Im sure i have the file size set good.
maybe it doens’t work cause i first had the old version installed with the patch and extension? ( the download was al little bit blury )
Maybe its a good idee to reinstall the patch en extenstion? Good you give me a good link to the latest versions?
When the script worked before i liked it very much. So i wanna get it working again
thnx already!
Dear Joshua,
I found the problem. The uploadbar directory i created in /tmp was automatically deleted.( i guess by a running script) once i created the dir, the script worked. Now i’m gone see if i can config the tmp dir to some other dir.
i have a tip for multiple upload boxes. You kan place them with the function render() but the names will remain the same. If you change the function that you can give a name, like i did. render($name) an place that in the name AND submitname. Then the upload boxes can have different names. ofcourse let the function check if a default name is filled in in the global vars of the class.
Hi Josh,
First off, fantastic work. I came across your project when I was looking for this exact solution, and it’s very impressive. So I ran into a very interesting problem when attempting to use the bar recently (I’ve built a version into my own form and it works nicely on my personal server). While it works fine on my personal server, the problem came when I attempted to transport everything to an off-site server. The off site hosting company is not without its quirks. First off, it’s a shared server. Each homepage gets its own folder etc etc… I had to set up a local configuration for PEAR, then I installed HTML_AJAX. I then basically mirrored what I have on my personal server. Here’s where the problem comes. The page that uses the status bar misses something, and the bar never shows an “In Progress” status. It stays on the “Connecting” status, never animates, then shows a full bar when done. It’s strange because it must be including the file (no error), the PEAR modules work (I installed the HTTP module and did a redirect to test), so I was hoping you’d have an idea of where to go from here. Thanks.
Mark:
Are you using it on your local install without the patch. Also are you seeing any JavaScript errors when things fail on the server, also can you mail me the url so I can take a look.
Josh–
Both installs are without the patch. I e-mailed links to both the working and non-working sites. There aren’t any errors, but I’m guessing you can probably just look at it and tell me that it’s not getting something. I appreciate your help. Thanks.
I’ve got the demo working on my local apache webserver, but when I try to apply this ajax upload to my application, I get a blank screen that consists of:
array(0) { }
Has anyone else run into this problem? I’ve fixed all of the src paths and placed the correct PHP/JS code in the right spots, as far as I can tell…
Thanks
Oh, nevermind!
My problem was that my file upload was inside of a pre-existing . Whoops.
Argh, my previous post had some html tags in it. It should read:
My problem was that my file upload form was inside of a pre-existing form.
Hallo Joshua
i have installed
-extension v4.1
-pear 1.4.10
-HTML_AJAX 0.4.1
-my php ver. 4.4.0
hier is demo not working
http://flashup2.rr.nu/demo.php
line 203
HTML_AJAX is undefiniert and
can you help me?
thx
It works on my localhost, but there: http://mforum.ert.pl/trunk/demo.php
it doesn’t work. Why ? When I use apache - it works. When I use lighttpd - id doesn’t work.
Requirements: If you want to use the code you need to:
Install HTML_AJAX (pear install HTML_AJAX-alpha)
Download PAFUPMU and install it somewhere accessible.
Add the code to your page using demo.php as an example.
lighttpd must not be setting $_SERVER['REQUEST_METHOD'], maybe it sets something else.
UploadProgressMeter.class.php line 62. Let me know if you find a workaround, maybe just check for _POST having a count > 0
I can run the demo on your website on Opera. When I install it on my webserver I can only run it with IE but not Opera.
[Server_Error] Statement on line 853: Syntax error in call to eval: line 1 :
From where do I download the patch & extension? The link at http://pdoru.from.ro/ doesn’t work: http://pdoru.from.ro/upload-progress-meter/patch-php-sapi/.
Also, I’d like to clear up the confusion about whether or not the patch is required for newer versions of PHP.
Furthermore, do I need to alter the PHP code on my upload script when I upgrade to the patched version?
Thanks!!!
The patch is required on newer versions of PHP. It looks like the link too it got removed so im not sure what the next step is.
I’ll be looking for an altenate solution, hopefully one that isn’t a perl cgi script.
Feel free to email me, and i’ll dig around for a copy of the patch, im sure i have one on my server.
what’s the point of the patch ? why doesn’t the function which polls every 2 seconds just read the current filesize of the tmp_file and calculate based on that. if it’s a matter of passing data back to the app, have the submit button for the upload trigger a javascript function which, after a second or so delay, reads a .data file created by the upload receiving function with pertinent details.
Buddyrandom:
The patch gives you access to the status of the upload. Your polling so that you can show the current speed, and how much has been uploaded.
The point is too support big file uploads that take minutes not seconds.
Looks like patching PHP is not good idea. Better to use Perl for tracking upload progress, but actual upload script could be done using PHP. Anyway, that will require Perl. Here’s completely perl solution: http://www.sibsoft.net/xupload.html
Thanks
[...] http://blog.joshuaeichorn.com/archives/2006/03/14/php-ajax-file-upload-progress-meter-updates/ su respectivo demo: http://php5.bluga.net/UploadProgressMeter/demo.php [...]
[...] People have been whining for this for quite a while, and although there was a patch available, and Josh showed how to use it with html_ajax most people don’t feel comfortable patching and recompiling php. And if you’re like me and think compiling on windows is only for the insane, well, you’re outta luck. After a lot of complaining from people on the php.internals mailing list, the hooks for doing upload progress are in 5.2, but they need an extension to work. This is the first one that fits the bill (I think they need at least one upload progress meter extension in the core - even just a simple one) [...]
congrats!this is most needed script ever. unfortunatelly, I could not get it working. Could you post step by step instructions along with the links of resources. The site with patches does not seem working. How do I install the patch and does it work under iis win2003 server?
If you want things too work in windows your only option is the new stuff in php 5.2
http://blog.bitflux.ch/archive/2006/09/28/upload-progress-meter-extension-for-php-5-2.html
Joshua,
I want to use the script without the patch.
So with a animated upload bar.
But i’m getting this JS error.
UploadProgressMeterStatus not defined.
Could you tell me how to fix this?
Greetz,
Michiel
I fixed the above error.
But now i get the following JS error: “HTML_AJAX undefined”
What must i do to solve it?
Greetz,
Michiel
Hi, ive been tryin to get this progress meter working for a couple of days now (the basic one, without the HTML_AJAX stuff), i tried 3 different php versions (4.3.10, 4.3.7 and 4.4) - all with apache2
i even updated my 4.3.7 to 4.3.10 (applied the patch, reconfigured and recompiled php) as it looked to me like it would refuse to work… still i wasn’t able to get it working… the php_values which i set in the httpd.conf (tried it in the php.ini aswell, same result) are ignored, and the progress meter extension doesnt show up in the phpinfo.php, so it seems like it doesnt work -and well when i try to use the extension it gives me an error sayin: Fatal error: Call to undefined function: upload_progress_meter_get_info() in /srv/www/vhosts/ … /httpdocs/upload/live-demo/progress.php on line 14
extension dir is set to the the right value
all steps i went through as written down at the site,
all the steps went without any error/warning but it still refuse to work
help would be highly appreciated, if you have any hints for me, either post here or contact me campos AT gmx DOT at
(or msn storm_cam AT hotmail DOT com)
If anyone is having compile problems i would really recomend looking at php 5.2 it has a slightly different upgrade progress system built in.
Hello Joshua,
I would appreciate if you could anwser mij above post..
Thank you!
Michiel: i’m not sure post your talking about, send me an email (josh@bluga.net) if you have any specific questions.
Hi Joshua,
I have error: ‘UploadProgressMeterStatus’ is undefined
Could you show me how to fix it?
Thanks
Hi Joshua,
I can’t seem to figure out what “HTML_AJAX is undefined” means. Could you provide some assistnace?
Thanks!
Greg
Great script, I installed it on my website thanks a lot.
But I had few problems…
1. I spent hours while trying to install the patch… In the README file it’s written upload_progress_tracking.so, but the file is actually named
upload_progress_meter.so
(when you’re a noob like me it takes time to notice that…)
2. The JS errors
When uncompressing the “HTML_AJAX-0.2.5-dev.tgz” archive, it will create a directory named “HTML_AJAX-0.2.5″, you need to rename it to “HTML”.
Edit the file “HTML/AJAX/Server.php” at line 64 change
var $clientJsLocation = false;
to
var $clientJsLocation = “HTML/js/”;
3. I wanted to put all the files of the script into a subdirectory except “demo.php”. If you try this, you’ll need to change all the path of this file +
the path of the “UploadProgressMeter.js” in the “UploadProgressMeter.class.php” file.
And finally the script works (after hours and hours xD) ^^
ryoku: just install HTML_AJAX from pear, 0.5.0 should work fine for you
Also php 5.2 has upload progress tracking built in so the days of patching things are soon over
Hey Joshua,
Any advice on my problem with the “HTML_AJAX is undefined”?
Thanks,
Greg
To Joshua Eichorn.
I have tested the new upload features in PHP 5.2
This looks cool, but requires APC extension to work, AFAIK.
Do you know if it is possible to use the upload progress tracking in PHP 5.2 without the APC extension?
If you know, please describe how to do it.
Greg: You don’t have HTML_AJAX installed properly did you install it using pear.
Load up the url from the JavaScript include to see what the error is
Tore: Take a look at comment 38, the link there has a simple extension that doesn’t need apc for doing the tracking
Joshua:
I have looked at the comment 38 and read the link.
What I would like to be able to do in addition to
presenting an upload meter to the client on how the upload goes is this:
After the upload of the files has been done….
then the files are in the whatever temp dir used by php.
When the upload to tempdir is done then my server script can start
taking care of the uploaded files.
This could take some time, depending on the filesize and what one wants to do with it/them.
I would like to be able to fetch status messages from the server after the upload to temp dir has been done, but before the script has finished.
I would even like to be able to zero the progress meter and make it start all over again, but now my server script should take care of writing the proper status messages to whatever hooks that are used to update the client of the progress.
Example… at first the client could see:
Uploading file(s) to server…
+ the progress meter.
When the files has been uploaded (they are in temp dir on server), but script not finished…
Then I would like to present:
Copying files on server…
+ the progress meter (with status on the copying etc)
Uploading file(s) to server… Done
I have tested the Rasmus Lerdorf script which you can find here:
http://talks.php.net/show/torkey06/23
On the next page of that talk one can find an example source as well as an example upload page.
Have been fiddling around with it and it is cool but do not like that I must use APC to make it work.
But the way this worked made it easy for me to adjust it to my needs by keeping writing to the APC object created by the new upload stuff in PHP 5.2 after the files has been uploaded to the temp dir.
Here I could keep reading the values from the APC object while I was handling the files and updating the object as I finished each of the files to be uploaded (moving to another dir, updating DB etc).
That possibility is really nice to have.
But I would like to do that without using APC.
Tore: well you need something to do the storage, you could either extend something like that simple progress extension or use the extension + another communication mechanism.
You could use anything you want from files to memcached to a database. Its just a matter of making your status ajax call smart enough to check the second method after the file is complete.
Hi Joshua,
How would I go about installing HTML_AJAX on a windows environment?
Thanks,
Greg
Greg:
Pear works just fine on windows
So install PEAR and then use the pear command line manager to install HTML_AJAX
Hi ,
We are not able to find out the path where the file is uploading, we would like to change the of the uploading directory. Please do help to us, we would be grateful to you.
Thanks,
Pankaj Arora
Pankaji: thats standard php configuration check your php.ini file and the PHP manual for details
Hi ,
Thanks for your response Joshua, here could we specify our directory, to upload the files.
Thanks,
Pankaj Arora
I’d like to use this on my podcast page to wathc the uploads instead of an HTTP post just sitting there. But I need to be able to do mySQL functions. Is this possible (if so please a little more than ‘yes’)
Thanks and happy hunting.
Hmm, i get this everytime
array(1) { ["upload"]=> array(5) { ["name"]=> string(35) “UploadProgressMeterStatus.class.php” ["type"]=> string(24) “application/octet-stream” ["tmp_name"]=> string(14) “/tmp/phpjGIH2I” ["error"]=> int(0) ["size"]=> int(3174) } }
It took me about 5 hours straight coding, figuring out and whatnot to get this working perfectly and the exact way I wanted integrated into my site. You can have a look at http://www.filespin.net - I actually took the progress meter out as it did not fit in with the theme and left the percentage as the main feature. Thanks for this.
I get the following error in the apache error log when I try to load the extension:
/usr/sbin/apache2: relocation error: /usr/lib/php5/20060613/upload_progress_meter.so: undefined symbol: upload_progress_register_callback
I am running PHP 5.2 under Debian Linux. I have not installed the patch.
The extension only works with the patch, if your on 5.2 there is built in file upload tracking but its different then what the old extension used.
In 5.2 you want the extension from: http://blog.bitflux.ch/archive/2006/09/28/upload-progress-meter-extension-for-php-5-2.html
Hey,
great script.
Question - Is there a way to stop the ajax polling after file upload completed? When tracking HTTP requests with FireBug in FireFox I can see the AJAX requests still being sent after upload finished, and it’s a waste of bandwidth.
Oren: You should be able to cancel the timer pretty easily. For some reason I was thinking it already did that.
Joshua,
Thanks for the script.
But, I would like to know, can I customize the folder for uploading file?
If yes, what file do I have to customize?
thanks.
Uway:
The temporary upload location is handled by a setting in your PHP ini. You can use move_uploaded_file to put the uploaded file anywhere.
Regarding my timer question (comments 65-66), How exactly do I do that? I can’t seem to find examples on the HTML_AJAX homepage.
Or maybe I need to handle something through an onLoad event to stop polling?
this upload progress affair is one of the lamest things ever happend to the php people. since php is the benchmark web language it’s a shame how this feature is ignored by the devs. even in 5.2 the dependence on APC is ridigulous.
Robert:
I agree that its taken too long to get this feature into the language, but the code in 5.2 doesn’t depend on APC. The code in 5.2 is a set of hooks to get information from the file upload process. Any extension can use this to give you upload progress information. APC happens to support this but you can also use http://pecl.php.net/package/uploadprogress.
I’ve been working on an alternative method for some time now and it just finally made it to the point that it’s relatively useable. Details on my blog -> http://evilcode.net/sjg/blog/
I have all the necessary things installed, I believe, but am getting the error:
PHP Fatal error: main() [function.require]: Failed opening required ‘HTML/AJAX/Server.php’ (include_path=’.:’) in /demoserver.php on line 3 .
I have HTML_AJAX installed via PEAR. Any thoughts of how to fix this?
Ameno:
Pear isn’t in your include path, either update it in your php.ini or by using set_include_path at the top of your script.
I am using a commersial host, so obviously I have no controll over what’s installed or not.
Can I use the script, if not, any other suggestions what to do.
Tomas: You can use the script, it will do an animation during the upload process. But you won’t get a speed estimate without support from your hosting company.
There is some new file upload stuff in flash that I don’t think needs a server and should be a good solution for you.
tnx, it actually works.
How would I know that they support speed estimate
Got some problems, the bar does not update, until the upload is finished.
I got a file to large error as well, despite the file was much smaller than max_post, max_file and max_mem
Last one is sorted, found the variable in the scripts, still dont have any updates on the progress-bar, and is says “connecting” all the time.
Tomas:
You don’t get updates without the extension
Hi, great tool! I’ve got the demo working on my server, however, now I’d like to be able to access the contents of the iframe to display the uploaded file (image) back into the form. Essentially I’m trying to allow a user to upload an image into a form. How would I go about updating the original form to display the recently uploaded image?
[...] ?. Son mis primeros aportes al blog; traducciones amateurs textuales de AJAX File upload Progress y PHP AJAX File Upload Progress Meter Updates, en la que nos embarcamos para, en mi caso practicar inglés y obtener información que nos fuera [...]
hi, i’m having some problems, I’ve spent ours doing this and now seem to be going round in circles. I’ve got Php5.2.1 on my system, installed the Liip extension and done a pear install HTML_AJAX-beta (version 0.5.0). testing a the demo source provided earlier located in a trunk directory in my webroot, i just can’t get it to work. the file progress jumps from 0-100%, firebug on my windows machine displays some errors “missing ; before statement demoserver.php line 2″ and “HTML_AJAX is not defined UploadProgressMeter.js line 207″. Am i missing something? i’ve looked and HTML_AJAX seems to be installed ../php/lib/php/html . I’m sorry if this obvious but i jsut can’t see what i’m doing wrong. this looks like a great solution to my problem hence i’m spending so long on this.cheers in advance
Adrian: If your working on php 5.2.1 make sure to get the newest version from SVN.
Also if your getting an error message it could be because of include path problems. A good way to check is too load demoserver.php?client=all by hand and see what error messages your getting.
Could I have a pecent to it???
Does the newest version of php 5.2 support the extension, I can not install the ext and patch…
In 5.2 you don’t need the patch and there is a new extension.
http://pecl.php.net/package/uploadprogress
What’s the http server ? I have a similar code, for large file the whole file seems to go to the server and there is no status. I goes from 0 to 100% when the server get the whole file… I have the feeling is an apache2 setting but I can’t figure it out yet.
I’ve only used the upload progress code with php as a module, i doubt fastcgi would work, but i would think that a normal cgi script would.
I’ve used apache 2.0.x and 2.2.x
Does someone have an example html where 3 files are being uploaded from the same form, with 1 submit button?
Is There Any PEAR Pack?
Hello,
I have tried hard using the demo for multiple file upload, but no luck .
Can anyone help me please.
Thanks in advance.
Hello,
My problems is as followed:
1.Under last version of FireFox, sometimes the progress bar goes imediately to 100%, sometimes it says only connecting and sometimes it works fine. In all cases the file upload works but the demoserver.php returns :100% or []
Hi,
I am getting the folloowing error even though the upload works. Can anyone please tell me why?
object(Error) (3) { ["name"]=> string(5) “Error” ["description"]=> string(39) “Request Timed Out: time out was 20000ms” ["message"]=> string(39) “Request Timed Out: time out was 20000ms” }
Thanks
Rick
Rumen: I’m not sure whats going on, how big of files are you uploading.
Ric:
The ajax status request calls are timing out for some reason
Hi Joshua,
Do you have any idea why this would be as it only happens with big files.
Thanks for any help you can offer
Rick
Ric: the ajax status call happens outside of the upload so I don’t see why that would affect things. Maybe your server is low on memory or has a slow network connection?
Hi Joshua,
The server is a test server just running this script at the moment with dual processors, 2gb memory and on the Rackspace hosting environment. I have asked them to check it and the server is responding as it should. Is there anyway I can at least increase the timeout so that the message does not appear?
Thanks for your help
Rick
Ric doesn’t sound like you should be having any problems at all.
You might start by setting a longer interval so your not polling quite as often you do that by setting: UploadProgressMeter_interval to something higher then its default 2000 (UploadProgressMeter.js)
You can change the 20 second timeout to something longer by editing line 193 of that same file and inserting:
UploadProgressMeter_remote.dispatcher.timeout = 40000;
where have the files uploaded? I can’t find them
lin: Your still performing a normal upload, its just happening inside a hidden iframe.
So you handle the upload just like normal in PHP. There is a comment in the script with where to add the upload code, move_upload_file etc.
hi josh!
great script! but i have the same problems rumen had in comment 93.
in opera and internet explorer 7 sometimes i got a timeout, sometimes it goes immediately to 100% and sometimes there is just a “connecting”.
have you any ideas about that issues?
everythings working fine in firefox and safari.
a test script: http://www.sprtpc.de/app/includes/demo.php
thanks for your help
matt
Hallo joshua,
Lovely script, real good work!
I am getting the error: ‘UploadProgressMeterStatus’ is undefined.
U have any idea how to fix this?
Thanks for your help,
Kevin
Kevin:
Check the output from: demoserver.php?stub=UploadProgressMeterStatus
something isn’t working right
Dear Joshua,
I am unable to get the upload speed working. I am only getting the animated progress bar. Please help! I have HTML_AJAX, pear and the uploadprogress extension installed. I am running PHP 5.2.3. Is there a way to debug this myself? Any help or advice would be greatly appreciated. Thanks!
Dinesh make sure you have the most recent update progress code from svn.
Also for debugging i use the firebug firefox extension or the fiddler2 debugging proxy. Take a look at the ajax requests and see what is getting sent back.
My best guess would be taht the uploadprogress extension isn’t getting detected correctly
Wow! That simple eh? I had forgotten to load the extension in the php.ini file. I added the line extension=uploadprogress.so and restarted apache and Viola! It works now. Thank you very much for the tips/advice. This might sound like a stupid question, but is there a way to manipulate the way the uploaded bytes and uploaded percent looks on the browser/client? In other words, can I change the font and format? By the way, thank you for the excellent scripts and the time you put in to writing them and supporting them.
Dinesh: take a look at the css at the top of demo.php, you should be able to customize pretty much everything from there
Joshua,
Thank you! On a side note, I have noticed that a lot of the time the bar jumps from connecting to upload complete without showing any file progress. Am I doing something wrong or is this a bug? I am using IE 6. What can I do to fix this?
Dinesh: i’m not really sure what would be causing that problems. How long does the upload take in that case?
When it jumps from connecting to upload complete, it seems almost instant. Maybe a few seconds. When I look in the upload folder I see a partial upload and the file name is not what it is supposed to be. The file name looks like phpvNR1bM instead of winscp407.exe. There are other times when it uploads the complete file with the correct file name.
Sorry, I forgot to mention that during those “other” times the upload is not instant. It does take a normal amount of time to upload the file, but I just dont see the file progress. It just jumps from connecting to upload complete.
Still having problems with the bar jumping from 0 to 100% although it does upload the file. I can see that the browsers built-in status bar is working. Is this a cache issue? What could be causing this behavior. If I delete cookies and I delete browsers cache/files and reload the page it works. I have added the followig in the head tag, but it does not seem to help:
where will File uploaded? i tried it but nothing uploaded file ???
xbilgix: a normal php file upload is happening, there are comments in the code on where you need to add the file upload code. Checkout http://us2.php.net/move_uploaded_file
I found that after a download or two, my meter quit working. I think there is a race condition, where UploadProgressMeter could be decremented twice when a download finished, once in window.uploadComplete() and once in UploadProgressMeter_Update(). UploadProgressMeter_count would become negative, and subsequent upload attempts would have no meter. I changed both subtractions to the following. YMMV.
if (UploadProgressMeter_count > 0) {
UploadProgressMeter_count–;
}
For those finding the meter jumps from 0 t0 100% it may be the following issue which I had:
The hidden form field named APC_UPLOAD_PROGRESS needs to go before the file input field otherwise it is not received by the server until the file has been uploaded. Obvious in hindsight I guess but kept me busy for a while.
I try to use this demo.php but it gives the error as dbug:
Form Submision Iframe Target:
array(1) { ["upload"]=> array(5) { ["name"]=> string(14) “groups_bar.gif” ["type"]=> string(9) “image/gif” ["tmp_name"]=> string(23) “C:\WINNT\Temp\php9E.tmp” ["error"]=> int(0) ["size"]=> int(2200) } }
What is happning……..?????
Why nothing is uploading……..????
Avis: it uploaded just fine: see http://www.php.net/manual/en/features.file-upload.php
You need to replace the var_dump with a move_uploaded files call to put the file where you want it
Hello Joshua, I am have a problem with the HTML_AJAX 0.5.5 package. I have installed HTML_AJAX through the PEAR package manager, and completely tested it as well. I checked the include_path in the php.ini– all ok. I also run the HTML_TEMPLATE package on it already without a problem.
Yet, for some reason, when I used the example code from –”http://wiki.bluga.net/HTML_AJAX/start?#”, I get 2 errors on the javascript: “HTML_AJAX.replace is not defined” , and a syntax error on the “”, however I removed the DOCTYPE tag from all file. Yet, It’s still indicating a problem. I copied the files exactly from the example code, creating 3 file: the server.php, the page.html and output.php
Basic Setup:
Apache 2.0.53
HTML_AJAX 0.5.5
php5.2.5
PEAR 1.7.2
I would really “appreciate” any help you can give me.
jsalinas
Hello Joshua,
I was just wondering if you’ve given consideration to providing a view of the image after it is 100% uploaded, or did the demo above not work properly, and it should have shown a small image of the file that has been uploaded?
jsalinas:
sounds like the the js code isn’t being delivered properly and is throwing errors. Try viewing the js includes manually.
Rob c:
That sounds like a pretty reasonable thing to do but the current demo leaves what to do with the files after upload up to you.
Hi Joshua,
great job, it has worked for me first run.
Now the issue:
I need to reload the main page when upload ends: how should I accomplish that?
thank you
[...] functions and extension. Here are a couple of progress bars to add to the one hobolooter posted. Joshua Eichorn’s Blog Blog Archive PHP AJAX File Upload Progress Meter Updates SourceForge.net: Mega Upload Progress Bar Web Reflection: Upload progress bar with PHP5, APC and [...]