Docs ModUploadProgress » History » Revision 20
« Previous |
Revision 20/22
(diff)
| Next »
gaborca, 2018-08-20 14:32
Module mod_uploadprogress¶
- Table of contents
- Module mod_uploadprogress
Options¶
upload-progress.progress-url¶
string, empty by default; use "/progress" (or something else) to enable the module
Config Example¶
upload-progress.progress-url = "/progress"
Warning¶
This module will not work if you are using more than one worker ("server.max-worker":Server.max-workerDetails)
Description¶
As of version 1.4.42 this module can be used to track the progress of a current upload.
If you want to track the progress of a file upload, you have to call
your upload processing url with an extra parameter called X-Progress-ID
with a 32 byte length unique string.
https://www.my-domain.com/uploadfile.php?X-Progress-ID=abcdefghabcdefghabcdefghabcdefgh
While uploading you can ping your upload progress url with the above
parameter using the GET method.
If you are not using GET method or the parameter length is not 32,
you will get a 404 response.
https://www.my-domain.com/progress?X-Progress-ID=abcdefghabcdefghabcdefghabcdefgh
If there is no upload progress with that identifier then you get
the following response without the quotes: "not in progress".
How to use it¶
Generate a progress-id (32 hex digits - just use a md5 hash); send this progress-id in the upload request and in all progress requests, either as "X-Progress-ID" header or as "X-Progress-ID" query string parameter.
XML Response¶
The returned XML will look like this:
<?xml version="1.0" encoding="iso-8859-1"?><upload><size>14953670</size><received>391182</received></upload>
Example 1¶
Three html-files are appended as example, based on Jan's work mentioned
at the link above. You need to add the tracking_id (an example how this is
done with a single page upload and javascript is also provided at Jan's blog).
In the iframe version, you can generate the tracking_id via php or other
server-side scripting.
Warning, the files are not working out of the box, you have to change things!
Downloads:- index.html - main page
index.html
- status.html - page containing progress
status.html
- upload.html - page posting the file
upload.html
Example 2¶
This example was created with maximum compatibility in mind, it even works in Internet Explorer 5.0.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>File upload progress</title> </head> <body> <form action="?X-Progress-ID=a2345678901234567890123456789012" method="POST" enctype="multipart/form-data" id="upload" target="upload_frame"> <input type="file" name="file"> <input type="submit"> </form> <iframe width="0" height="0" frameborder="0" scrolling="no" name="upload_frame" id="upload_frame"></iframe> <p id="state"></p> <script> function get_state() { var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); function handle_request() { if (xhr.readyState != 4) { return; } var v = xhr.responseText; if (v === 'not in progress') { state.innerHTML = 'done'; clearInterval(timer); return; } var arr = reg.exec(v); state.innerHTML = Math.floor(100 * arr[2] / arr[1]) + '%'; } xhr.open('GET', '/progress?t=' + new Date().getTime(), true); xhr.setRequestHeader('X-Progress-ID', 'a2345678901234567890123456789012'); xhr.onreadystatechange = handle_request; xhr.send(); } function start_interval() { timer = setInterval(get_state, 1000); } var upload = document.getElementById('upload'), state = document.getElementById('state'), upload_frame = document.getElementById('upload_frame'), f = upload_frame.contentWindow, reg = new RegExp('size>([0-9]+)</size><received>([0-9]+)</rec'), timer; upload.onsubmit = start_interval; </script> </body> </html>
Updated by gaborca about 6 years ago · 20 revisions