nginx 上传进度条

费劲周折，一晚上终于搞定了，nginx版本1.38
－－－－－－－－－－－－－－
[img]http://dl.iteye.com/upload/attachment/0075/9740/a04b1050-88c8-3a7e-8cf2-488c1c1a818e.png[/img]
－－－－－－－－－－－－－－－
测试php是否好使
cat index.php

<?php  phpinfo(); ?> 

nginx上传进度条

4部分
1.php的支持，自带的，就是建立一个fast-cgi跑php，提供一个test.php显示最终结果
2.nginx_upload_module 上传插件
http://www.grid.net.ru/nginx/download/nginx_upload_module-2.2.0.tar.gz
3.nginx_upload_progress_module，上传进度条插件
akostrikov-nginx-upload-progress-module-v0.8.2-1-g3d8e105.zip
http://wiki.nginx.org/HttpUploadProgressModule
下载
https://nodeload.github.com/akostrikov/nginx-upload-progress-module/zipball/master
4.https://github.com/drogus/jquery-upload-progress ,显示进度条的jquery插件

参考链接：
http://wiki.nginx.org/HttpUploadProgressModule
http://www.grid.net.ru/nginx/upload.en.html

nginx基础的包：
yum install openssl-devel zlib-devel prce-devel

./configure --prefix=/usr/local/nginx --add-module=/usr/local/app/nginx_upload_module-2.2.0 --add-module=/usr/local/app/masterzen-nginx-upload-progress-module-a788dea --with-debug

如果
/usr/local/app/nginx_upload_module-2.2.0/ngx_http_upload_module.c: 在函数‘ngx_http_upload_merge_ranges’中:
/usr/local/app/nginx_upload_module-2.2.0/ngx_http_upload_module.c:1682:22: 错误：变量‘result’被设定但未被使用 [-Werror=unused-but-set-variable]

出现这个错误
就把Makefile文件里的 -Werror去掉
在fedora17中遇到
在redhat6.3中没有


配置文件需要注意
注意，官方的配置文件不对
需要加个这个

location ~ (.*)/x-progress-id:(\w*) {
			rewrite ^(.*)/x-progress-id:(\w*)   $1?X-Progress-ID=$2;
		}

php的支持：
yum install spawn-fcgi
yum install php
yum install php-cgi
test.php
[code="java"]
# cat test.php
<?php
print_r($_POST);
?>
[/code]
启动fast-cgi支持php

groupadd www-data
useradd www-data -g www-data
/usr/bin/spawn-fcgi -a 127.0.0.1 -p 9001 -u www-data -g www-data -f /usr/bin/php-cgi -P /var/run/fastcgi-php.pid

配置文件问：
nginx.conf
[code="java"]
# cat nginx.conf
worker_processes 1;
events {
worker_connections 1024;
}
http {
autoindex on;
autoindex_exact_size off;
autoindex_localtime on;
default_type application/octet-stream;
sendfile on;
tcp_nopush on;
tcp_nodelay on;
keepalive_timeout 10;
gzip on;
gzip_min_length 1k;
gzip_buffers 4 8k;
gzip_http_version 1.1;
gzip_comp_level 3;
gzip_types text/css text/xml text/plain application/x-javascript application/xml application/pdf application/rtf application/x-perl application/x-tcl application/msword application/vnd.ms-excel application/vnd.ms-powerpoint application/vnd.wap.xhtml+xml image/x-ms-bmp;
gzip_vary on;
output_buffers 4 32k;
upload_progress_json_output;
upload_progress proxied 1m;
server {
listen 80;
server_name 192.168.76.138;
charset utf-8,gb2312;
client_max_body_size 2000m;
location /upload {
upload_pass @test;
upload_store /tmp 1;
upload_store_access user:r;
upload_set_form_field "${upload_field_name}_name" $upload_file_name;
upload_set_form_field "${upload_field_name}_content_type" $upload_content_type;
upload_set_form_field "${upload_field_name}_path" $upload_tmp_path;
upload_aggregate_form_field "${upload_field_name}_md5" $upload_file_md5;
upload_aggregate_form_field "${upload_field_name}_size" $upload_file_size;
upload_pass_form_field "^submit$|^description$";
track_uploads proxied 30s;
}
location @test {
rewrite ^(.*)$ /test.php last;
}

location / {
proxy_set_header Host $http_host;
root html;
index index.html index.htm index.php;
}

location ~ (.*)/x-progress-id:(\w*) {
rewrite ^(.*)/x-progress-id:(\w*) $1?X-Progress-ID=$2;
}
location ^~ /progress {
report_uploads proxied;
}
location ~ \.php$ {
fastcgi_pass 127.0.0.1:9001;
fastcgi_index index.php;
set $path_info "/";
set $real_script_name $fastcgi_script_name;
if ($fastcgi_script_name ~ "^(.+?\.php)(/.+)$") { set $real_script_name $1;
set $path_info $2;
}
}
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
root html;
access_log off;
expires 30d;
}
location ~ .*\.(js|css|ico)?$ {
root html;
access_log off;
expires 1h;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
fastcgi_param SCRIPT_FILENAME $document_root$real_script_name;
fastcgi_param script_name $real_script_name;
fastcgi_param path_info $path_info;
include /usr/local/nginx/conf/fastcgi_params;
}

}


[/code]
简单例子测试是否可以上传

<html>
<head>
<title>Test upload</title>
</head>
<body>
<h2>Select files to upload</h2>
<form enctype="multipart/form-data" action="/upload" method="post">
<input type="file" name="file1"><br>
<input type="file" name="file2"><br>
<input type="file" name="file3"><br>
<input type="file" name="file4"><br>
<input type="file" name="file5"><br>
<input type="file" name="file6"><br>
<input type="submit" name="submit" value="Upload">
<input type="hidden" name="test" value="value">
</form>
</body>
</html>

注意/tmp权限
mkdir /tmp/1 2 3 ...
chmod -R 777 /tmp

然后用jquery的插件的版本：

[code="html"]
# cat index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<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="../lib/jquery.js"></script>
<script src="../jquery.uploadProgress.js"></script>
<script type="text/javascript">
$(function() {
$('form').uploadProgress({
/* scripts locations for safari */
jqueryPath: "../lib/jquery.js",
uploadProgressPath: "../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="/upload" method="post"><!--注意这里改了-->
<input name="file" type="file"/>
<input type="submit" value="Upload"/>
</form>

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

[/code]
附件中有下好的安装包，不保函yum的