Клиенты не могут подписать договор сразу — вы теряете сделки. Подписание документов прямо в браузере сокращает цикл сделки в 3–4 раза и исключает потерю документов. В отличие от готовых сервисов, наше решение полностью кастомизируется под ваш workflow. Оно интегрируется с существующей инфраструктурой и обеспечивает нужный уровень юридической значимости. При этом кастомное решение в 3 раза дешевле при 1000 подписей в месяц — никаких ежемесячных подписок за каждого пользователя. Типовые сервисы часто не учитывают сложные workflow: цепочки согласований, параллельное подписание, интеграцию с 1С. Мы решаем эти задачи, опираясь на 10+ лет опыта в разработке документооборота. Свяжитесь с нами — оценим ваш проект за один рабочий день.
Почему подписание в браузере выгоднее готовых сервисов?
Готовые сервисы (DocuSign и др.) предлагают стандартный функционал, но уступают кастомному решению по трём ключевым параметрам: стоимость, кастомизация и юридическое соответствие.
| Критерий | Готовый сервис | Наше кастомное решение |
|---|---|---|
| Стоимость | Ежемесячная подписка за каждого пользователя | Единоразовая разработка, без привязки к числу пользователей |
| Кастомизация дизайна | Ограниченная (брендирование, но не полный 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% по сравнению с КЭП.
// Генерация и отправка кода
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 часа. При необходимости добавляем параллельное подписание или уведомления через 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 месяца. Получите консультацию — мы подберём оптимальную архитектуру для вашего проекта. Закажите внедрение подписания документов уже сегодня.