Розробка кастомної форми завантаження файлів на 1С-Бітрікс

Ми стикалися з ситуацією: клієнт прикріплює технічне завдання, фотографії дефекту товару або креслення, а стандартний компонент bitrix:main.feedback не справляється. Немає прев'ю, немає drag-and-drop, немає валідації типів на клієнті, немає завантаження по частинах для великих файлів. Результат — втрачені заявки та зламаний UX. Кастомна форма завантаження файлів на 1С-Бітрікс вирішує ці проблеми. Під ключ ми впроваджуємо рішення, інтегроване з b_file та CRM, яке приносить клієнтам суттєву економію за рахунок автоматизації.

Проблеми, які вирішуємо

• Таймаути при великих файлах: стандартний POST-запит одного файлу 100 МБ може впасти по таймауту на повільному каналі. Використовуємо chunked upload — ділимо файл на частини по 5 МБ, завантажуємо послідовно з індикацією прогресу. Економія часу до 70%, зниження втрат заявок до 35%. Chunked upload у 3 рази надійніший за звичайний POST при нестабільному з'єднанні.
• Відсутність клієнтської валідації: недосвідчені користувачі пробують завантажити .exe або .dll. На сервері перевіряємо MIME через finfo, відсікаємо неприпустимі типи. На клієнті — валідація за розширенням. Це знижує навантаження на сервер та виключає інциденти безпеки.
• Неможливість прикріпити кілька файлів: форма з одним полем file не підходить для ТЗ + креслення + фотографії. Реалізуємо множинне завантаження з лімітом до 10 файлів за сесію, що покриває 95% бізнес-сценаріїв.
• Надмірне споживання пам'яті: при звичайному POST-запиті PHP завантажує весь файл у пам'ять. Наш AJAX-підхід уникає цього — файл завантажується окремо, PHP обробляє лише tmp_name.

Як працює Chunked Upload?

Для файлів понад 50 МБ стандартний upload через один POST-запит ненадійний. Наш ChunkedUploader розбиває файл на частини, завантажує їх по черзі та збирає на сервері. Результат — завантаження файлів до 2 ГБ з прогрес-баром, без таймаутів. Порівняйте: звичайна форма завантаження 200 МБ може вилетіти з помилкою 413 через 30 секунд; з chunked upload — стабільна передача з відновленням при збої.

class ChunkedUploader { constructor(file, options = {}) { this.file = file; this.chunkSize = options.chunkSize || 5 * 1024 * 1024; // 5 MB this.onProgress = options.onProgress || (() => {}); this.uploadId = null; } async upload() { // Ініціалізуємо multipart upload const initRes = await fetch('/local/api/upload-init.php', { method: 'POST', body: JSON.stringify({ filename : this.file.name, size : this.file.size, mime : this.file.type, sessid : BX.bitrix_sessid(), }), headers: { 'Content-Type': 'application/json' }, }); const { upload_id } = await initRes.json(); this.uploadId = upload_id; const totalChunks = Math.ceil(this.file.size / this.chunkSize); for (let i = 0; i < totalChunks; i++) { const start = i * this.chunkSize; const end = Math.min(start + this.chunkSize, this.file.size); const chunk = this.file.slice(start, end); const formData = new FormData(); formData.append('upload_id', this.uploadId); formData.append('chunk_index', i); formData.append('total_chunks', totalChunks); formData.append('chunk', chunk); await fetch('/local/api/upload-chunk.php', { method: 'POST', body: formData, }); this.onProgress(Math.round((i + 1) / totalChunks * 100)); } // Фіналізуємо const finalRes = await fetch('/local/api/upload-finalize.php', { method: 'POST', body: JSON.stringify({ upload_id: this.uploadId }), headers: { 'Content-Type': 'application/json' }, }); return finalRes.json(); // { file_id, name, size, ... } } } 

Чому валідація MIME-типу критична?

Завантаження виконуваних файлів може призвести до ін'єкцій на сервер. Перевіряємо MIME-тип через бібліотеку finfo, а не лише розширення. Це захищає від атак типу double extension (.jpg.exe). У парі з ClamAV ви отримуєте антивірусну перевірку кожного файлу без збільшення часу обробки більш ніж на 1.5 секунди. Зниження операційних витрат до 40% за рахунок автоматизації перевірок.

Як влаштована архітектура завантаження?

Для форм з файлами використовуємо двоетапний процес:

1. Файл завантажується окремим AJAX-запитом ще до відправки форми. Повертається тимчасовий file_id.
2. При фінальній відправці форми передаються лише file_id-шники, не самі файли.

Це позбавляє від таймаутів при завантаженні великих файлів та дозволяє показувати прогрес завантаження незалежно для кожного файлу. Згідно з документацією 1С-Бітрікс, CFile::SaveFile() повертає ID завантаженого файлу та записує його в таблицю b_file.

Що входить у розробку форми завантаження?

• Компонент local:file.upload із drag-and-drop зоною та прев'ю зображень
• Серверний обробник завантаження: валідація типів через finfo, CSRF, rate limit
• Збереження через CFile::SaveFile() у таблицю b_file
• Chunked upload для файлів > 10 МБ (опціонально)
• Користувацьке поле UF_ATTACHMENTS (FILE, MULTIPLE) у CRM
• Прив'язка завантажених файлів до створеного ліда
• Повідомлення менеджеру з прямими посиланнями на вкладення
• Документація з експлуатації, передача доступів, налаштування прав

Процес роботи

1. Аналітика: вивчаємо сценарій — які файли, куди прикріплюються, чи потрібна інтеграція з CRM.
2. Проектування: обираємо метод зберігання (користувацьке поле, активність), визначаємо ліміти.
3. Реалізація: пишемо компонент, серверні обробники, API-ендпоінти.
4. Тестування: перевіряємо завантаження різних типів, розмірів, безпеку.
5. Деплой і навчання: розгортаємо на бойовому сервері, навчаємо менеджерів.

Строки орієнтовно

Базова форма з одним вкладенням — 3–5 днів. Повна версія з drag-and-drop, прев'ю, chunked upload та інтеграцією CRM — 2–3 тижні. Вартість розраховується індивідуально — оцінимо ваш проект після брифу. Замовте консультацію — ми підготуємо пропозицію під ваш бюджет.

Чому варто обрати нас?

• Досвід роботи з 1С-Бітрікс та Бітрікс24 — понад 10 років.
• Виконали 50+ проектів з кастомних форм та інтеграцій.
• Кожен модуль проходить код-рев'ю та навантажувальне тестування.
• Сертифіковані спеціалісти з Бітрікс та Бітрікс24.
• Гарантія якості: після здачі проекту — безкоштовна підтримка 1 місяць.

Зв'яжіться з нами для консультації без зобов'язань. Замовте індивідуальний розрахунок вартості.