multiple uploads via XMLHttpRequest

[Destramic]

hey guys i've made a upload script for my site but i'm getting a server internal error 500 when selecting 3+ files at once, but works fine when uploading singular files.

 

when the user browses and selects a image to upload it's send to my send_image() function which will send the image file, where its added to the server via php in my uploaded script...each file has its own request.

 

here is the function

	function send_image(method, selector, filename, file, cover){
		  var data    = new FormData(),
		      xhr     = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"),
		      message = 'Uploading ' + filename;
		 
		  if (method !== 'upload'){
			  file = JSON.stringify(file);
		  }
		  
		  if (method === 'crop'){
			 message = 'Editing ' + filename;
		  }
		  else if (method === 'restore'){
			  message = 'Retoring ' + filename;
		  }
		  else if (method === 'remove'){
			  message = 'Removing ' + filename;
		  }
		  else if (method === 'change_cover_image' ||
				  method === 'set_cover_image'){
			  message = 'Changing cover image';
		  }
		  
		 loader.display(message);
		  
		 if (method === 'upload'){
			 data.append('cover', cover);
		 }
		 
		  data.append('method', method);
		  data.append('file', file);
		  xhr.open('POST', 'http://bisi.bid/ajax/image', true);
		  
		  xhr.upload.onprogress = function(e) {
		    if (e.lengthComputable) {
		    	var percentage = Math.round((e.loaded * 100) / e.total);

		    	progress.display(message, percentage);
		    	
		    	if (percentage === 100){
		    		loader.stop(message);
		    	}
		    }
		  }
		  
		  xhr.onerror = function () { 
			  upload_status('Image failed to upload.'); 
		  };
		  
		  xhr.onreadystatechange = function(){ 
			  if (xhr.readyState == 4) {  
			      if (xhr.status == 200) {
				      if (method.match(/^(upload|crop|restore)$/)){
				    	  var src = this.responseText;
					      selector.attr('src', src + '?time=' + new Date());
					      selector.data('uploaded', true);
					      $('#images-uploaded').text($("li[id^='image-'] img").length);
				      }
			      } else { 
			    	  upload_status('Image failed to upload.');
			      } 
			  } 
			  
			  console.log(xhr.responseText);
			  console.log(xhr.readyState);
			  console.log(xhr.status);
			  console.log(xhr.statusText);
		  }; 

		  xhr.send(data);
		  
		  return xhr;
	 }

i believe the error i'm getting is because of the server configuration i'm getting these errors so i made changes to my server config files

 

 

nginx.config

 

keepalive_timeout  125;proxy_read_timeout 125;proxy_connect_timeout 125;fastcgi_read_timeout 125;

 

php.ini

upload_max_filesize = 40M
post_max_size       = 40M

after i made changes i tried to upload 5 images at once but the server comes back with internal error 500.

 

images I'm uploading altogether are about 8mb.

 

has someone come across this before?...any help on this matter would be appropriated...if you require further details/code please let me know.

 

 

thank you

 

 

[Jacques1]

What does the error log of your server say?

[Destramic]

What does the error log of your server say?

 

oh yeah that would of helped...i'm getting these two errors still:

 

mod_fcgid: read data timeout in 45 seconds, referer: http://bisi.bid/list-item

End of script output before headers: index.php, referer: http://bisi.bid/list-item

 

thank you