Welcome! Log In Create A New Profile

Advanced

Upload Progress Issue -- do not have "uploading" state

Yanxin Z.
April 20, 2011 09:32PM
Hello,
I am trying to use Nginx + Upload Module + Upload Progress Module, which
I follow the link
http://wiki.nginx.org/NginxHttpUploadProgressModule#Usage

I find some issue in initial config, like X-Progress-ID should be added
in upload_pass_form_field

Now I have the last problem is upload.state is not changing during file
transfer. When upload starts, the state is "Starting", when upload is
done, state becomes "done". But in the period, states never becomes
"uploading". This cause the status bar is not working.

Could anyone help me to solve this issue?
Thanks.

I post my config here:

//conf

246 location ~ /api/1.0/web/upload.php {
247 # limit_req zone=box; #set request limit for box
248 root html;
249 fastcgi_pass 127.0.0.1:9000;
250 fastcgi_param SCRIPT_FILENAME
/opt/nginx/html/script$fastcgi_script_name;
251 include fastcgi_params;
252
253 }

268 location ~ /api/1.0/web/upload_internal {
269 # Pass altered request body to this location
270
271 if ($request_method = POST) {
272 upload_pass @post_upload;
273 break;
274 }
275
276 #proxy to upstream server
277 proxy_pass http://127.0.0.1;
278 proxy_redirect default;
279
280 # Store files to this directory
281 upload_store /opt/nginx/html/upload_file;
282
283 # Allow uploaded files to be read only by user
284
285 upload_store_access user:rw group:rw all:rw;
286 upload_set_form_field $upload_field_name.name
"$upload_file_name";
287 upload_set_form_field $upload_field_name.content_type
"$upload_content_type";
288 upload_set_form_field $upload_field_name.path
"$upload_tmp_path";
289
290 # Inform backend about hash and size of a file
291 upload_aggregate_form_field "${upload_field_name}_md5"
$upload_file_md5;
292 upload_aggregate_form_field "${upload_field_name}_size"
$upload_file_size;
293
294 upload_pass_iform_field
"^X-Progress-ID$|^submit$|^email$";
295
296
297 # track uploads in the 'proxied' zone
298 # remember connections for 30s after they finished
299 track_uploads proxied 30s;
300
301 }

303 # Pass altered request body to a backend
304 location @post_upload {
305 rewrite /api/1.0/web/upload_internal
/api/1.0/web/upload.php last;
306 }
307
308 location ^~ /progress {
309 report_uploads proxied;
310 }


//form //

314 <form id="upload" method="POST" enctype="multipart/form-data"
action="/api/1.0/web/upload_internal" onsubmit="openProgressBar();
return true;">
315 Email:<input type="text" name="email" id="email"><br>
316 <input type="file" name="file"><br>
317 <input type="hidden" name="MAX_FILE_SIZE" value="30000000" />
318 <input type="submit" name="submit" value="Upload">
319 </form>
320
321 <div>
322 <div id="progress" style="width: 400px; border: 10px solid black">
323 <div id="progressbar" style="width: 10px; background-color: black;
border: 5px solid white"> </div>
324 </div>
325 <div id="tp">Upload Progress</div>
326 </div>
327


// javascript //

54 interval = null;
55
56 function openProgressBar() {
57 /* generate random progress-id */
58 uuid = "";
59 for (i = 0; i < 32; i++) {
60 uuid += Math.floor(Math.random() * 16).toString(16);
61 }
62 /* patch the form-action tag to include the progress-id */
63
//document.getElementById("upload").action="/upload.php?X-Progress-ID="
+ uuid;
64
document.getElementById("upload").action="/api/1.0/web/upload_internal/?X-Progress-ID="
+ uuid;
65
66 /* call the progress-updater every 1000ms */
67 interval = window.setInterval(
68 function () {
69 fetch(uuid);
70 },
71 100
72 );
73 }
74
75 function fetch(uuid) {
76 req = new XMLHttpRequest();
77 req.open("GET", "/progress", 1);
78 req.setRequestHeader("X-Progress-ID", uuid);
79 req.onreadystatechange = function () {
80 if (req.readyState == 4) {
81 if (req.status == 200) {
82 /* poor-man JSON parser */
83 var upload = eval(req.responseText);
84
85 document.getElementById('tp').innerHTML = upload.state;
86
87
88 /* change the width if the inner progress-bar */
89 if (upload.state == 'done' || upload.state == 'uploading') {
90 //if (upload.state == 'done' || upload.state == 'start') {
91 //alert(req.responseText);
92 bar = document.getElementById('progressbar');
93 w = 400 * upload.received / upload.size;
94 bar.style.width = w + 'px';
95 }
96 /* we are done, stop the interval */
97 if (upload.state == 'done') {
98 //alert("Hello");
99 //alert(req.responseText);
100 window.clearTimeout(interval);
101 }
102 }
103 }
104 }
105 req.send(null);
106 }

--
Posted via http://www.ruby-forum.com/.

_______________________________________________
nginx mailing list
nginx@nginx.org
http://nginx.org/mailman/listinfo/nginx
Subject Author Posted

Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 20, 2011 09:32PM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 20, 2011 09:34PM

Re: Upload Progress Issue -- do not have "uploading" state

Ensiferous April 20, 2011 10:37PM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 21, 2011 12:48AM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 21, 2011 02:26AM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 21, 2011 03:10AM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 21, 2011 03:24AM

Re: Upload Progress Issue -- do not have "uploading" state

Brice Figureau April 21, 2011 05:44AM

Re: Upload Progress Issue -- do not have "uploading" state

Yanxin Z. April 21, 2011 12:24PM



Sorry, only registered users may post in this forum.

Click here to login

Online Users

Guests: 239
Record Number of Users: 8 on April 13, 2023
Record Number of Guests: 421 on December 02, 2018
Powered by nginx      Powered by FreeBSD      PHP Powered      Powered by MariaDB      ipv6 ready