Chunked file upload with angular-js and jquery-file-uplad, nginx and rails -


i trying chunked file upload angular-js , jquery-file-uplad (form github/blueimp). backend rails application running on nginx.

jquery file upload sending first chunk , stops on receiving 201 nginx server.

document here specifies nginx should return 201 created , not 200. can't seem figure out wrong here.

following relevant code sections

js

 (function () {     'use strict';         var url = 'jquploadhandle';      blueshiftapp.config([             '$httpprovider', 'fileuploadprovider',             function ($httpprovider, fileuploadprovider) {                 delete $httpprovider.defaults.headers.common['x-requested-with'];                 fileuploadprovider.defaults.redirect = window.location.href.replace(                     /\/[^\/]*$/,                     '/cors/result.html?%s'                 );             }         ])          .controller('demofileuploadcontroller', [             '$scope', '$http', '$filter', '$window',             function ($scope, $http) {                 $scope.options = {                     url: url,                     datattype: 'text',                     multipart: false,                     maxchunksize: 4000000, //bytes                     sequentialuploads: true,                 };                  $scope.loadingfiles = false;                 $('#fileupload').bind('fileuploadadd', function(e, data){                     if (data.headers === undefined) {                         data.headers = {};                     }                     data.headers['session-id'] = "0000000277"                    });             }         ])          .controller('filedestroycontroller', [             '$scope', '$http',             function ($scope, $http) {                 var file = $scope.file,                     state;                 if (file.url) {                     file.$state = function () {                         return state;                     };                     file.$destroy = function () {                         state = 'pending';                         return $http({                             url: file.deleteurl,                             method: file.deletetype                         }).then(                             function () {                                 state = 'resolved';                                 $scope.clear(file);                             },                             function () {                                 state = 'rejected';                             }                         );                     };                 } else if (!file.$cancel && !file._index) {                     file.$cancel = function () {                         $scope.clear(file);                     };                 }             }         ]);     }()); 

html markup

 <form id="fileupload" method="post" enctype="multipart/form-data" data-ng-controller="demofileuploadcontroller" data-file-upload="options" data-ng-class="{'fileupload-processing': processing() || loadingfiles}"> <!-- redirect browsers javascript disabled origin page --> <!-- fileupload-buttonbar contains buttons add/delete files , start/cancel upload --> <!-- fileinput-button span used style file input field button --> <div class="form-group col-md-offset-4">   <label class="form-inline control-label col-md-3">     upload file     <span class="required">* </span>   </label>   <input type="file" name="file" accept="text/csv, application/json" ng-required="true" ng-disabled="disabled">   <label> download sample      <a href='/crm_feeds.csv'> csv <i class='fa fa-share-square-o'></i> </a>   </label>   <p ng-show="invalid_file" class="help-block">crm data file required.</p> </div> <div class="form-group">   <div class="form-inline col-md-5" >      <button type="button" class="btn btn-default cancel" data-ng-click="cancel()">       <i class="glyphicon glyphicon-ban-circle"></i>       <span>cancel</span>     </button>     <button type="button" class="form-inline btn btn-primary start" data-ng-click="submit()">       <i class="glyphicon glyphicon-upload"></i>       <span>validate</span>     </button>   </div> </div> <div>   <!-- global file processing state -->   <span class="fileupload-process"></span> </div> <!-- global progress state --> <div class="col-lg-5 fade" data-ng-class="{in: active()}" style="margin-top:7px">   <!-- global progress bar -->   <div class="progress progress-striped active" data-file-upload-progress="progress()"><div class="progress-bar progress-bar-success" data-ng-style="{width: num + '%'}"></div></div>   <!-- extended global progress state -->   <div class="progress-extended">&nbsp;</div> </div> 

nginx config

user  nobody; worker_processes  1;  error_log  logs/error.log; error_log  logs/error.log  notice; error_log  logs/error.log  info;  #pid        logs/nginx.pid;   events { worker_connections  20; }   http { include       mime.types; default_type  application/octet-stream; upstream localapp {   server 127.0.0.1:3000; }  #access_log  logs/access.log  main;  sendfile        on; #tcp_nopush     on;  #keepalive_timeout  0; keepalive_timeout  65;  #gzip  on;  server {     client_max_body_size 4g;     client_body_buffer_size 1024k;     listen       80;     server_name  localhost:3000;       #charset koi8-r;      #access_log  logs/host.access.log  main;     location /jquploadhandle {       upload_max_file_size 0;       upload_pass /post_jquploadhandle.json;       upload_store /store;       upload_state_store /store/states;       upload_store_access user:rw group:rw all:r;       upload_resumable on;        upload_set_form_field file[name] "$upload_file_name";       upload_set_form_field file[content_type] "$upload_content_type";       upload_set_form_field file[filepath] "$upload_tmp_path";        upload_pass_form_field "^theme_id$|^blog_id$|^authenticity_token$|^format$";       upload_cleanup 400 404 499 500-505;     }      location / {         root   html;         index  index.html index.htm @app;         proxy_pass  http://localapp;       }      location @upload {       proxy_pass  http://localapp;     }      #error_page  404              /404.html;      # redirect server error pages static page /50x.html     #     error_page   500 502 503 504  /50x.html;     location = /50x.html {         root   html;     } } } 


Comments

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

javascript - Function overwritting -

php - Find a regex to take part of Email -