I am using jQuery-File-Upload and trying to limit the maximum image uploads to 1 (single image upload).
I am using example php file from the demo version itself which is located in server/php/
as UploadHandler.php
As of now I have blocked the multiple image uploads on drag and drop in JS but as its just on the client side and which can't be trusted as a full proof solution, I want to know how can I limit the maximum no. of uploads per request
Till now I have done:
<input class="photo file" id="fileupload" name="images" type="file">
And on JS part:
$('#fileupload').fileupload({
url: url,
dataType: 'json',
autoUpload: true,
dropZone: $('#fileupload'),
singleFileUploads: false,
}).on('fileuploadadd', function (e, data) {
//Hides error
$('.error').hide().children().text('');
var maxFileUploadAllowed = 1;
var fileCount = data.files.length;
if (fileCount > maxFileUploadAllowed) {
$('.error').fadeIn().children().text("You are allowed to upload only 1 file");
return false;
}
and that works properly, but limiting 1 file on backend is also necessary
On some digging I found that there's a parameter in options
as 'max_number_of_files' => null,
I tried changing it to 1
but then on each file upload even on single file upload it started giving error as Maximum File limit exceeded
And after further digging I found that checks in this if
statement is somehow true and causing error.
if (is_int($this->options['max_number_of_files']) &&
($this->count_file_objects() >= $this->options['max_number_of_files']) &&
// Ignore additional chunks of existing files:
!is_file($this->get_upload_path($file->name))) {
$file->error = $this->get_error_message('max_number_of_files');
return false;
}
I did echo $this->count_file_objects()
and found that it's actually returning the maximum files allowed in the uploads directory.
So there's no handler in demo code which can limit no. of file uploads on the backend.
Just wanted to know if there's a way I can restrict the no. of file uploads in the backend?
There will be issues when user will fiddle the following:
<input class="photo file" id="fileupload" name="images[]" type="file">
<input class="photo file" id="fileupload" name="images[]" type="file" multiple>
code below:
var maxFileUploadAllowed = 1;
var fileCount = data.files.length;
if (fileCount > maxFileUploadAllowed) {
$('.error').fadeIn().children().text("You are allowed to upload only 1 file");
return false;
}
As there's no check in the backend.
After digging deeper into the PHP code in the demo within server/php/UploadHandler.php
I found that upload process is working on POST
and thus $this->post($this->options['print_response']);
method is called for handling uploads:
And before this process there were some initial validations in validate()
:
protected function validate($uploaded_file, $file, $error, $index) {
if ($error) {
$file->error = $this->get_error_message($error);
return false;
}
$content_length = $this->fix_integer_overflow(
(int)$this->get_server_var('CONTENT_LENGTH')
);
$post_max_size = $this->get_config_bytes(ini_get('post_max_size'));
if ($post_max_size && ($content_length > $post_max_size)) {
$file->error = $this->get_error_message('post_max_size');
return false;
}
...
return true;
}
So it's clear that validate()
is responsible for initial checks.
Initially, in Options, I added a parameter called max_files_upload_allowed: 1
and then I added a error message in the $error_messages
as 'max_files_upload_allowed' => 'You are not allowed to upload multiple files at once'
then I created my method getUploadFilesCount()
to check the no. of files user added to upload queue:
protected function getUploadFilesCount() {
$file_upload_count = $this->get_upload_data($this->options['param_name']);
return count($file_upload_count['name']);
}
And after that added following check in validate()
//Check max_files_upload_allowed here
if (is_int($this->options['max_files_upload_allowed']) && (
$this->getUploadFilesCount() > $this->options['max_files_upload_allowed'] &&
$this->options['max_files_upload_allowed'] > 0)
) {
$file->error = $this->get_error_message('max_files_upload_allowed');
return false;
}
And voila! If user adds more files than listed in max_files_upload_allowed: 1
then (s)he will receive the error.
And that solves the purpose, prevents malicious attempts and adds more reliability to the file upload process used.