2011-05-05 109 views
1

我有服务器安装了upload_progress模块​​和nginx。但我无法让他们正常工作。前端在html + javascript上的实现已经完全取自官方网站,即不会有错误。描述加载过程:我打开一个页面,看到进度条是空的,选择一个文件,按“提交”,然后翻转到一个文本的页面:{“name”:“”“size”:0, “type”:null,“error”:null},尽管我想看到填充进度条。 我在做什么错?upload_progress模块​​为nginx不工作

--- nginx.conf

user www-data; 
worker_processes 1; 
error_log /var/log/nginx/error.log; 
pid /var/run/nginx.pid; 

events { 
worker_connections 1024; 
} 


http { 
include mime.types; 
default_type application/octet-stream; 
client_max_body_size 1024m; 
access_log logs/access.log; 

sendfile on; 

keepalive_timeout 65; 

gzip on; 
gzip_proxied any; 
gzip_min_length 1100; 
gzip_http_version 1.0; 
gzip_comp_level 9; 
gzip_types text/plain text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript; 

server { 
listen 80; 
server_name localhost; 
access_log logs/host.access.log; 

location/{ 
root /var/www/; 
proxy_pass http://localhost:8080; 
proxy_set_header Host $host; 
proxy_set_header X-Real-IP $remote_addr; 
proxy_connect_timeout 60; 
proxy_send_timeout 90; 
proxy_read_timeout 90; 
proxy_redirect default; 
index index.html index.htm; 
} 

location ~* \.(jpg|jpeg|gif|png|css|js|zip|tgz|gz|rar|bz2|doc|xls|exe|pdf|ppt|tar|wav|bmp|rtf|swf|ico|flv|txt|xml|docx|xlsx) 
{ 
root /var/www/socnetwork; 
index index.html index.php; 
access_log off; 
expires 30d; 
} 
} 

--- frontend.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <title>ajaxFileUpload</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <script src="./include/jquery/jquery-1.5.1.js"></script> 
     <script src="./include/jquery/jquery.uploadProgress.js"></script> 

     <script type="text/javascript"> 
      $(function() { 
       $('form').uploadProgress({ 

        jqueryPath: "./include/jquery/jquery-1.5.1.js", 
        uploadProgressPath: "./include/jquery/jquery.uploadProgress.js", 
        start:function(){}, 
        uploading: function(upload) {$('#percents').html(upload.percents+'%');}, 
        interval: 2000 
       }); 
      }); 
     </script> 
     <style type="text/css"> 
      .bar { 
       width: 300px; 
      } 

      #progress { 
       background: #eee; 
       border: 1px solid #222; 
       margin-top: 20px; 
      } 
      #progressbar { 
       width: 0px; 
       height: 24px; 
       background: #333; 
      } 
     </style> 
    </head> 

    <body> 
     <form id="upload" enctype="multipart/form-data" action="index.html" method="post"> 
     <input name="file" type="file"/> 
     <input type="submit" value="Upload"/> 
     </form> 


     <div id="uploading"> 
      <div id="progress" class="bar"> 
      <div id="progressbar">&nbsp;</div> 
      </div> 
     </div> 
     <div id="percents"></div> 
    </body> 
</html> 

回答

0

您需要在nginx.conf中设置upload_progress模块​​。看一个例子here。我在这里复制了关键元素:

http { 
    # reserve 1MB under the name 'proxied' to track uploads 
    upload_progress proxied 1m; 

    server { 
     .... 

     location/{ 
      ... 
      # track uploads in the 'proxied' zone 
      # remember connections for 30s after they finished 
      track_uploads proxied 30s; 
     } 

     location ^~ /progress { 
      # report uploads tracked in the 'proxied' zone 
      report_uploads proxied; 
     } 
    } } 

您可以对“/ progress”执行GET请求以获取信息。

的HTTP请求发送到该位置必须含有INPROGRESS 载的有效唯一标识符的X-进展-ID参数 或HTTP标头。

研究http://wiki.nginx.org/HttpUploadProgressModul欲了解更多信息。

0

我得到了同样的问题,在服务器端建立了uplaod进步的文件,但该地址是错的... afaik这是固定在一个较新的版本(我可以编译它我自己的,这是几个月前,sry)

0

你不dephaphasized textermine位置与进度条lacation

location = /upload/status { 
    report_uploads upload; 
} 

location/{ 
... 
    track_uploads upload 30s; 
} 
location (with you backend) {  
    track_uploads upload 1m; 
}