jQuery-File-upload and nginx

ypeskin nginx-forum at nginx.us
Mon Aug 27 21:42:36 UTC 2012


I have a problem setting up jQuery-File-Upload plugin and nginx. I've
downloaded and installed nginx 1.2.3, and upload module 2.2.0 from source,
here's my config file (names have been changed to protect the innocent):
upstream web_backend {
        server 4dc1.domain.com:8080 weight=10 max_fails=3;
        server 4dc1.domain.com:8081 weight=10 max_fails=3;
        server 4dc2.domain.com:8080 weight=10 max_fails=3;
        server 4dc2.domain.com:8081 weight=10 max_fails=3;
}

server {
        listen 80;
        listen 8080;
        server_name     domain.com www.domain.com;
        error_log      
/var/www/vhosts/domain.com/statistics/logs/error_log.nginx warn;
        access_log     
/var/www/vhosts/domain.com/statistics/logs/access_log.nginx main
buffer=32k;
        root    /var/www/vhosts/domain.com/httpdocs/website;
#       auth_basic      "Restricted";
#       auth_basic_user_file .htpasswd;
        index   index.html;

        location / {
                expires 7d;
        }

        error_page 404  /404.html;

        error_page 500 502 503 504 /50x.html;

        location = /50x.html {
                root /var/www/vhosts/domain.com/httpdocs/website;
        }

        location = /404.html {
                root /var/www/vhosts/domain.com/httpdocs/website;
        }

        location /img/ {
#               auth_basic off;
                expires 10m;
        }

        location ~*
^.+\.(jpg|jpeg|gif|png|css|zip|tgz|gz|rar|bz2|doc|xls|exe|pdf|ppt|txt|tar|wav|bmp|rtf|js|ico|swf|mov)$
{
                expires 7d;
        }

        location /jsonrpc/ {
                proxy_pass http://web_backend$request_uri;
                include /etc/nginx/proxy.conf;
        }

        location /upload/ {
                upload_pass @test;

                upload_store /path/to/file/store/ 1;
                upload_store_access user:rw group:rw;

                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$";
                upload_cleanup 400 404 499 500-505;
        }

       location @test {
               proxy_pass   http://localhost:8080;
       }
}  

The html file contains a form with method set to "POST", hence the upload
module. Here's the relevant bits of the html file:
    <form id="fileupload" action="server/php/index.php" method="POST"
enctype="multipart/form-data">
        <!-- The fileupload-buttonbar contains buttons to add/delete files
and start/cancel the upload -->
        <div class="row fileupload-buttonbar">
            <div class="span7">
                <!-- The fileinput-button span is used to style the file
input field as button -->
                <span class="btn btn-success fileinput-button">
                    <i class="icon-plus icon-white"></i>
                    <span>Add files...</span>
                    <input type="file" name="files[]" multiple>
                </span>
                <button type="submit" class="btn btn-primary start">
                    <i class="icon-upload icon-white"></i>
                    <span>Start upload</span>
                </button>
                <button type="reset" class="btn btn-warning cancel">
                    <i class="icon-ban-circle icon-white"></i>
                    <span>Cancel upload</span>
                </button>
                <button type="button" class="btn btn-danger delete">
                    <i class="icon-trash icon-white"></i>
                    <span>Delete</span>
                </button>
                <input type="checkbox" class="toggle">
            </div>
            <!-- The global progress information -->
            <div class="span5 fileupload-progress fade">
                <!-- The global progress bar -->
                <div class="progress progress-success progress-striped
active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
                    <div class="bar" style="width:0%;"></div>
                </div>
                <!-- The extended global progress information -->
                <div class="progress-extended"> </div>
            </div>
        </div>
        <!-- The loading indicator is shown during file processing -->
        <div class="fileupload-loading"></div>
        <br>
        <!-- The table listing the files available for upload/download -->
        <table role="presentation" class="table table-striped"><tbody
class="files" data-toggle="modal-gallery"
data-target="#modal-gallery"></tbody></table>
    </form>

I keep getting 405 Not allowed error.
How can I get jQuery-File-Upload and nginx to work together?
Thanks.

Posted at Nginx Forum: http://forum.nginx.org/read.php?2,230157,230157#msg-230157



More information about the nginx mailing list