Тимур Асадуллин: Предпросмотр документов в вебе. Эволюция сервиса.

Transcript

1. Просмотр документов в вебе Эволюция сервиса Асадуллин Тимур, Directum
2. Intro DirectumRX – ECM система: • бизнес-процессы • справочники • документы • веб-клиент 2
3. Зачем нужен предпросмотр? Чтобы просто просмотреть документ надо скачать файл. Делается прозрачно, в один клик, но: • долго • теоретически браузер может заблокировать • если локально нет приложения-редактора, то ничего не посмотришь (на мобильных устройствах, например) • предпросмотр – удобно 3
4. Как это выглядит 4
5. Исследование. Возможные пути • Всё переводить в PDF и пусть браузер открывает сам. - Куда попало на странице не встроишь (или колдовать с iframe) - мало контроля над содержимым, - куда девать Excel? 5
6. Исследование. Возможные пути Использовать онлайн-редактор. Ограничения по форматам. 6 - медленный - нагружает браузер - взаимодействие по протоколу WOPI - нужен домен - Windows only
7. Исследование. Возможные пути Конвертировать исходный документ (*.docx, например) во что-то более нативное для браузера (в *.html, например). 7 convert
8. Исследование. Конвертация • Есть Directum5 со своим веб-клиентом, в котором предпросмотр уже есть. • «Надо взять оттуда всё готовое и максимально быстро встроить». 8
9. Исследование. Конвертеры • Консультации от разработчиков предпросмотра в Directum5 • Изучение кода 9 Подготовка предпросмотра Выбор конвертера на основе типа документа Конвертация WordConverter IDocumentConverter png, css Исходный документ Предпросмотр
10. Конвертеры Конвертер Входной формат Выходной формат Примечание WordConverter doc, docx, rtf, odt Html одним файлом (картинки внутри как base64) Aspose.Words ExcelConverter xls, xlsx, xlsm, ods Html (frameset) Aspose.Cells PowerPointConverter ppt, pptx, odp Набор png Aspose.Slides Поддерживается постраничная конвертация. PdfConverter pdf Набор png Aspose.PDF Поддерживается постраничная конвертация. ImageDefaultConverter gif, jpeg, png gif, jpeg, png Сжатие картинки, если она превышает некоторый размер 10
11. Доработка конвертеров • Замена ссылок в полученных после конвертации HTML- документах (картинки, стили) • Обработка примечаний в Word (скрыть/показать) • Постраничную конвертацию (PDF, PPT) оставляем • Специальная обработка Excel (убрали frameset) 11
12. Исследование. Прототип • Изолировали конвертеры, запилили прототип (без DirectumRX). • Сняли метрики по CPU и RAM. 12
13. Время конвертации на прототипе файл длительность DOCX_15Мб.docx (276 pages pics) 0:44:804 DOC_300Кб.doc (266 pages text) 0:15:520 DOCX_3Мб.docx (266pages text) 0:18:913 DOCX_500Кб.docx (99 pages) 0:03:944 DOCX_50Кб.DOCX 0:00:085 DOC_20Мб.doc (21 pages pics) 0:02:843 DOC_500Кб.doc (5 pages) 0:00:084 DOC_50Кб.DOC 0:00:045 IMG_BMP_9Мб.bmp 0:00:050 PDF_250Кб.pdf 0:00:209 PDF_3Мб.PDF 0:00:940 PDF_40Мб.pdf 0:00:542 PPTX_10Мб.pptx 0:01:008 PPTX_2Мб.pptx 0:00:475 PPT_10Мб.ppt 0:00:882 PPT_3Мб.PPT 0:00:551 PPT_600Кб.pptx 0:00:165 PPT_750Кб.PPT 0:00:192 RTF_10Мб.rtf 0:00:397 RTF_500Кб.rtf 0:00:169 RTF_50Кб.RTF 0:00:043 файл длительность TIFF_500Кб.tiff 0:00:446 TIFF_50Кб.tiff 0:00:005 TIFF_5Мб.tiff 0:00:980 TIF_1.5Мб.tif 0:00:176 TIF_50Кб.tif 0:00:080 TIF_5Мб.tif 0:00:338 TXT_1.txt 0:00:002 TXT_2.txt 0:00:002 uncleBob.txt 0:00:002 XLSX_10Мб.xlsx 0:33:881 XLS_10Мб.xls 0:05:691 XLS_1Мб.xls 0:01:711 XLS_2Мб.xls 0:03:404 XLS_30Кб.XLS 0:00:015 XLSХ_250Кб.xlsx 0:01:663 Документ LibreOffice.odt 0:00:230 Документ OpenOffice.odt 0:00:164 Документ таблица OpenOffice.ods 0:00:037 Документ таблица исправленная OpenOffice2.ods 0:00:017 Презентация LibreOffice.odp 0:00:627 Электронная таблица LibreOffice.ods 0:00:012 Электронная таблица2 LibreOffice.ods 0:00:037 Тестовый стенд: intel core i5-6400 2.7GHz, 16Gb RAM, SSD. 13
14. CPU и RAM 14
15. Исследования • Конвертеры – нормас. Делаем. • Теперь надо продумать архитектуру вокруг конвертеров. 15
16. Архитектура. Требования • Кэшировать результаты конвертации. • Защититься от двойной конвертации. • Масштабировать нагрузку. • Безопасность. • Сделать отдельным сервисом, отделяемым (во всех смыслах) от основного приложения DirectumRX. 16
17. Архитектура 17 RequestPreview binDataId Проверка прав доступа Client web app Сервер приложения DirectumRX Storage service Preview service (конвертация) Preview Storage service (хранение) GetDocument Document body Convert() Get description Description Get file file content Тела документов Ensure preview Файловое хранилище превью Save preview files Get description Description
18. 18 Архитектура. С точки зрения frontent RequestPreview binDataId Проверка прав доступа Client web app Сервер приложения DirectumRX Get description Description Get file file content
19. 19 Архитектура RequestPreview binDataId Проверка прав доступа Client web app Сервер приложения DirectumRX Storage service Preview service (конвертация) Preview Storage service (хранение) GetDocument Document body Convert() Get description Description 5 6 7 Get file file content Тела документов 8 Ensure preview Файловое хранилище превью 2 Save preview files Get description Description 1 3 4
20. Скрытые проблемы • Двойное выкачивание документа • Двойная конвертация • Долгая конвертация • Падение сервиса 20
21. 21 Архитектура Client Сервер приложений Storage service Preview service (конвертация) Preview Storage service (хранение) Convert() Файловое хранилище превью Save preview files Set is started Set finish Get description Description
22. Отказоустойчивость • Обработка ошибок конвертации. • Вопрос падения сервисов как таковых (в т. ч. в результате внешних факторов – потеря сети, отключение электричества). • Ситуация, когда в PreviewService ушло задание на превью, а тот просто завершился. • Таймаут на формирование превью. • Сконвертированное ранее выживает после перезапуска. 22
23. На чём пишем? • PreviewStorage – сразу на .net core. • PreviewService – .NET Framework 4.6 из-за старой версии Aspose. • Фронтэнд – из желудей и спичек (JS, React). 23
24. Безопасность JSON Web Token (JWT), подписанный сертификатом сервера. 24 Токен • Кем выдан • Кому выдан • Какая операция (read/write) • ID объекта (исходного документа) • Информация о подписи • Срок годности Request preview readToken Проверка прав доступа и генерация токенов Client Сервер приложения Preview service Preview cache service Get description и т.д. writeToken. Convert() GetDescription / GetFile readToken EnsurePreview writeToken Проверка writeToken Проверка writeToken Проверка readToken
25. Масштабирование 25 Client Сервер приложения Storage service Preview service Preview Storage Convert() Preview service Convert() Preview service Convert() Balancer
26. 26 0 1000 2000 3000 4000 5000 6000 7000 8000 9000 10000 1 10 50 100 500 1000 Минимум по полю Elapsed (ms) Среднее по полю Elapsed (ms) Максимум по полю Elapsed (ms) Число одновременных пользователей Синтетические тесты. Типичная нагрузка
27. 27 Синтетические тесты. Ресурсы
28. 28 User 1 User 2 User 3 User 4 User N … File1.docx File2.docx File3.docx File3.docx File N.docx … 1 by 1 Синтетические тесты. DDOS
29. 29 0 5000 10000 15000 20000 25000 30000 35000 40000 1 10 20 30 50 100 Минимум по полю Elapsed (ms) Среднее по полю Elapsed (ms) Максимум по полю Elapsed (ms) 0 50 100 150 200 250 300 350 400 450 1 10 20 30 50 100 Всего запросов Запросы с истекшим таймаутом Синтетические тесты. DDOS
30. Синтетические тесты. DDOS. Масштабируем
31. Внутренний релиз • Фронтэнд так себе с точки зрения кода, но своё дело делает • Выкатываем на внутренний продакшен (для собственного использования внутри компании). • Решаем вскрывшиеся проблемы (в том числе напоролись на документы, которые Aspose не вывозит) 31
32. Развитие. Net Core • Купили новую версию Aspose • Переводим PreviewService на .net core • Отказываемся от IIS и переделываем сервисы на selfhost 32 Client web app Сервер приложения DirectumRX Preview service (конвертация) Preview Storage service (хранение) Convert() Файловое хранилище превью IIS NET. Framework 4.6 Selfhost .NET Core 2.2 Selfhost .NET Core 2.2 IIS .NET Framework JS, React
33. Готовим фичу для релиза • Другая команда переделывает фронтенд (TypeScript, React) • Они начинают чуть-чуть влезать в наш бэкэнд • Разбираемся, чего им не хватает 33
34. RabbitMQ Client Sungero server Storage service Preview service Preview Storage ConvertToPreview() Preview service ConvertToPreview() Preview service ConvertToPreview() 34
35. Рефакторинг • Рефакторим конвертеры, которые достались нам as is Упрощаем систему загрузки плагинов • Рефакторим сами сервисы Пока пилили поднакопилось техдолга по мелочи 35
36. Сервер приложения Preview service Preview Storage Сервер приложения Preview service Preview Storage ??? 36 • ARR – Application Request Routing • NLB – Network Load Balancing Веб-ферма
37. Веб-ферма Client Sungero server Storage service Preview service Preview Storage ConvertToPreview() Preview service ConvertToPreview() Preview Storage Файловое хранилище превью • Делаем, чтобы можно было несколько инстансов PreviewStorage 37
38. Оптимизации • Оптимизация работы с файлами Вычитываем в MemoryStream • Оптимизация постраничной конвертации Попутно реализовываем конвертацию нескольких страниц за один проход (по запросу) 38 Сервис предпросмотра Конвертация PowerPointConwerter IDocumentConverter N.png Исходный документ Frontend app Сконвертировать страницу N
39. Итого • Бэкэнд – одна команда (5 человек). ~5 спринтов. • Фронтэнд – другая команда (4 человека). ~3-4 спринта. • Всё работает как часики (в т. ч. в Linux) • Фича включена в релиз DirectumRX • Заявленные в начале цели достигнуты (мобилки, удобство, снизили нагрузку на сервер и т. д.) 39
41. Всё. Спасибо за внимание. 41