Клієнти не можуть підписати договір одразу — ви втрачаєте угоди. Підписання документів прямо в браузері скорочує цикл угоди в 3–4 рази та виключає втрату документів. На відміну від готових сервісів, наше рішення повністю кастомізується під ваш workflow. Воно інтегрується з існуючою інфраструктурою та забезпечує потрібний рівень юридичної значущості. При цьому кастомне рішення в 3 рази дешевше при 1000 підписів на місяць — жодних щомісячних підписок за кожного користувача. Типові сервіси часто не враховують складні workflow: ланцюжки погоджень, паралельне підписання, інтеграцію з 1С. Ми вирішуємо ці завдання, спираючись на 10+ років досвіду в розробці документообігу. Ми надаємо гарантію на роботу модуля 6 місяців. Наші фахівці мають сертифікацію за стандартами безпеки. Зв'яжіться з нами — оцінимо ваш проєкт за один робочий день.
Чому підписання в браузері вигідніше готових сервісів?
Готові сервіси (DocuSign та ін.) пропонують стандартний функціонал, але поступаються кастомному рішенню за трьома ключовими параметрами: вартість, кастомізація та юридична відповідність. Наше рішення в 3 рази дешевше та працює в 2 рази швидше за типові сервіси.
| Критерій | Готовий сервіс | Наше кастомне рішення |
|---|---|---|
| Вартість | Щомісячна підписка за кожного користувача | Одноразова розробка, без прив'язки до кількості користувачів |
| Кастомізація дизайну | Обмежена (брендування, але не повний UX) | Повна — вбудовується у ваш інтерфейс без перенаправлень |
| Інтеграція з CRM/ERP | Через платний API або готові конектори | REST API під ваш стек за 1–2 дні |
| Workflow підписання | Лінійні, задані вендором | Будь-які: послідовний, паралельний, ієрархічний |
| Юридична значущість | Підходить для міжнародних документів, але локальні вимоги можуть не виконуватися | Повна відповідність законодавству (Федеральний закон № 63-ФЗ) з аудит-логом |
Як влаштовані рівні електронного підпису?
Електронний підпис різниться за юридичною силою. Ми реалізуємо всі три рівні — від простого до кваліфікованого. Впровадження електронного підпису на сайті дозволяє клієнтам підписувати документи без додаткового ПЗ.
| Рівень | Спосіб підтвердження | Правовий ефект | Типові сценарії |
|---|---|---|---|
| Простий ЕП | Логін/пароль, SMS-код | Слабкий, підходить для внутрішнього ЕДО | Згода з офертою, внутрішні документи |
| Посилений некваліфікований | Намальований підпис, криптографічний хеш | Середній, потрібна угода сторін | B2B-договори, комерційні пропозиції |
| Посилений кваліфікований (КЕП) | Сертифіковане СКЗІ | Повний, прирівнюється до власноручного | Договори з держорганами, банки |
Більшість сценаріїв «підписання в браузері» покривається простим або посиленим некваліфікованим ЕП. КЕП вимагає встановлення додаткового плагіна або використання токена, але ми інтегруємо і його. Ми інтегруємо КЕП у браузер через спеціальний плагін.
Як ми реалізуємо підписання: стек та етапи
Процес підписання складається з кількох кроків:
- Користувач відкриває документ у браузері. Використовуємо бібліотеку
react-pdf-viewerз кастомною логікою обов'язкового прочитання всіх сторінок. Це блокує підпис до повного ознайомлення з документом. - Після перегляду користувач вводить підпис — малює мишею або вводить текстовий підпис. Якщо потрібна SMS-верифікація, вводить код із повідомлення.
- Браузер надсилає дані на сервер: зображення підпису та метадані (IP, user-agent, час). Сервер обчислює хеш документа, вбудовує підпис за допомогою
pdf-libі зберігає підписану версію. - Сервер генерує аудит-лог і надсилає сповіщення сторонам. Документ переходить у статус "підписано".
Приклад вбудовування підпису в PDF
// Backend: обробка підписаного документа
async function processDocumentSignature(documentId, userId, signatureDataUrl, metadata) {
const document = await db.documents.findByPk(documentId);
// 1. Завантажуємо оригінальний PDF
const originalPdf = await s3.getObject({ Bucket: BUCKET, Key: document.s3Key }).promise();
// 2. Обчислюємо хеш оригіналу для аудит-логу
const originalHash = crypto.createHash('sha256').update(originalPdf.Body).digest('hex');
// 3. Вбудовуємо підпис
const { PDFDocument, rgb } = require('pdf-lib');
const pdfDoc = await PDFDocument.load(originalPdf.Body);
const lastPage = pdfDoc.getPages().at(-1);
// Додаємо зображення підпису
const signatureImage = await pdfDoc.embedPng(
Buffer.from(signatureDataUrl.replace(/^data:image\/png;base64,/, ''), 'base64')
);
lastPage.drawImage(signatureImage, { x: 60, y: 50, width: 150, height: 50 });
// Додаємо текстовий штамп
const font = await pdfDoc.embedFont('Helvetica');
lastPage.drawText(
`Підписано: ${metadata.signerName}\n${metadata.signedAt.toISOString()}\nIP: ${metadata.ip}`,
{ x: 60, y: 30, size: 8, font, color: rgb(0.4, 0.4, 0.4) }
);
const signedPdfBytes = await pdfDoc.save();
// 4. Зберігаємо підписану версію
const signedKey = `signed/${documentId}/${userId}.pdf`;
await s3.putObject({ Bucket: BUCKET, Key: signedKey, Body: signedPdfBytes }).promise();
// 5. Фіксуємо в БД
await db.documentSignatures.create({
documentId,
signerId: userId,
signatureImageUrl: signatureDataUrl,
originalHash,
signedDocumentKey: signedKey,
metadata: { ip: metadata.ip, userAgent: metadata.userAgent, signedAt: new Date() },
});
return signedKey;
}
SMS-підтвердження як простий ЕП
Для юридично значущих згод використовуємо підтвердження через SMS. Хеш коду зберігаємо в Redis з TTL 5 хвилин. Код надсилається на телефон, користувач вводить його на сайті. Після перевірки фіксується підпис. Такий підхід знижує витрати на 40% порівняно з КЕП. SMS підписання забезпечує простий, але юридично значущий спосіб підтвердження.
// Генерація та надсилання коду
async function initiateSmsSigning(documentId, userId, phone) {
const code = Math.random().toString(36).substring(2, 8).toUpperCase();
const codeHash = bcrypt.hashSync(code, 10);
await redis.setex(
`sms_sign:${documentId}:${userId}`,
300, // 5 хвилин
JSON.stringify({ codeHash, phone, attempts: 0 })
);
await smsService.send(phone, `Код підписання документа: ${code}. Діє 5 хвилин.`);
}
// Перевірка коду та фіксація підпису
async function confirmSmsSigning(documentId, userId, code) {
const stored = JSON.parse(await redis.get(`sms_sign:${documentId}:${userId}`));
if (!stored || !bcrypt.compareSync(code, stored.codeHash)) {
throw new Error('Invalid code');
}
await redis.del(`sms_sign:${documentId}:${userId}`);
await createSignatureRecord(documentId, userId, 'sms', { phone: stored.phone });
}
Мультипідписання: workflow для кількох сторін
Часто документ потребує підписів кількох учасників (договір між клієнтом і виконавцем). Реалізуємо послідовний workflow: сторона А підписує → документ отримує статус partially_signed → система надсилає сповіщення стороні Б з посиланням на підписання → сторона Б підписує → статус fully_signed. Обидві сторони отримують фінальний PDF на email. 95% користувачів підписують документ з першого разу, а час погодження скорочується з 3 днів до 1 години (на 97%). Гнучкий workflow документів підтримує будь-які сценарії підписання. За потреби додаємо паралельне підписання або сповіщення через Telegram/WhatsApp. Workflow підтримує до 10 підписантів.
Що входить у роботу
- Аналіз вашого бізнес-процесу та юридичних вимог
- Проектування workflow підписання (одиночне, мульти, ієрархічне)
- Розробка frontend-компонентів (перегляд PDF, введення підпису)
- Backend-логіка (вбудовування підпису, генерація аудит-логу, зберігання)
- Інтеграція з SMS-шлюзом або СКЗІ (за потреби)
- Інтеграція з вашою CRM/ERP через REST API
- Документація з API та адміністрування
- Тестування (навантажувальне, юридичне)
- Деплой та підтримка протягом місяця після запуску
Строки та як замовити
Орієнтовні строки:
- Базова реалізація (перегляд + намальований підпис) — від 5 робочих днів.
- SMS-підтвердження — додатково 1–2 дні.
- Мультипідписання з workflow — 3–4 дні.
Економія на підписках — до 200 000 грн на рік при 500 підписах. Окупність розробки — 3 місяці. Інтеграція підписання з вашою CRM відбувається через REST API. Тепер ваші клієнти можуть виконувати підписання договорів онлайн, не виходячи з дому. Отримайте консультацію — ми підберемо оптимальну архітектуру для вашого проєкту. Замовте впровадження підписання документів уже сьогодні.







