Skip to content

Add file size validation. #983

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
balagan73 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Add file size validation. #983

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 28 additions & 0 deletions web/modules/custom/server_general/server_general.module
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
* Module file.
*/

use Drupal\Component\Utility\Bytes;
use Drupal\Core\Access\AccessResult;
use Drupal\Core\Entity\ContentEntityFormInterface;
use Drupal\Core\Entity\EntityInterface;
Expand Down Expand Up @@ -373,4 +374,31 @@ function server_general_page_attachments(array &$attachments) {
];
$attachments['#attached']['html_head'][] = [$noindex_tag, 'noindex_error_pages'];
}

// Attach file size validation library and settings for client-side
// validation of file uploads.
$attachments['#attached']['library'][] = 'server_theme/file-size-validation';
$attachments['#attached']['drupalSettings']['fileSizeValidation'] = [
'maxFileSize' => server_general_get_max_upload_size(),
];
}

/**
* Get the maximum file upload size in bytes.
*
* Returns the smaller of upload_max_filesize and post_max_size PHP settings.
*
* @return int
* Maximum upload size in bytes.
*/
function server_general_get_max_upload_size(): int {
$upload_max = Bytes::toNumber(ini_get('upload_max_filesize'));
$post_max = Bytes::toNumber(ini_get('post_max_size'));

// post_max_size of 0 means unlimited.
if ($post_max == 0) {
return (int) $upload_max;
}

return (int) min($upload_max, $post_max);
}
9 changes: 9 additions & 0 deletions web/themes/custom/server_theme/server_theme.libraries.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,3 +87,12 @@ expanding-text:
- core/drupal
- core/jquery
- core/once

file-size-validation:
js:
dist/js/file-size-validation.js: {}
dependencies:
- core/drupal
- core/drupalSettings
- core/jquery
- core/once
85 changes: 85 additions & 0 deletions web/themes/custom/server_theme/src/js/file-size-validation.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
/**
* @file
* Client-side file size validation to prevent upload errors.
*
* Validates file size before upload to show a user-friendly error message
* instead of cryptic AJAX errors when files exceed PHP limits.
*/
(function ($, Drupal, once) {

/**
* Validates file size before upload.
*
* @type {Drupal~behavior}
*/
Drupal.behaviors.fileSizeValidation = {
attach: function (context, settings) {
const maxFileSize = settings.fileSizeValidation?.maxFileSize;
if (!maxFileSize) {
return;
}

const $fileInputs = $(
once('file-size-validate', 'input[type="file"]', context)
);

if (!$fileInputs.length) {
return;
}

$fileInputs.on('change.fileSizeValidation', function (event) {
const input = this;
const files = input.files;

if (!files || !files.length) {
return;
}

// Remove any previous file size errors.
$(input)
.closest('div.js-form-managed-file, .form-item')
.find('.file-size-error')
.remove();

// Check each file's size.
for (let i = 0; i < files.length; i++) {
const file = files[i];
if (file.size > maxFileSize) {
const fileSizeMB = (file.size / (1024 * 1024)).toFixed(2);
const maxSizeMB = (maxFileSize / (1024 * 1024)).toFixed(0);

const error = Drupal.t(
'The file "@filename" (@filesize MB) exceeds the maximum upload size of @maxsize MB. Please choose a smaller file.',
{
'@filename': file.name,
'@filesize': fileSizeMB,
'@maxsize': maxSizeMB,
}
);

$(input)
.closest('div.js-form-managed-file, .form-item')
.prepend(
'<div class="messages messages--error file-size-error" aria-live="polite">' + error + '</div>'
);

// Clear the file input to prevent upload attempt.
input.value = '';

// Stop processing and prevent upload.
event.stopImmediatePropagation();
return;
}
}
});
},
detach: function (context, settings, trigger) {
if (trigger === 'unload') {
$(once.remove('file-size-validate', 'input[type="file"]', context)).off(
'.fileSizeValidation'
);
}
},
};

})(jQuery, Drupal, once);
Loading