Реализация просмотра офисных документов в мобильном приложении

Реализация просмотра офисных документов в мобильном приложении

.docx, .xlsx, .pptx — Office Open XML форматы на основе ZIP-архивов с XML внутри. В отличие от PDF, у них нет стандартного рендерера на мобильных платформах. Каждый производитель решает это по-своему: Microsoft предоставляет SDK, Google — Document Viewer API, остальные — сторонние библиотеки с переменным качеством рендеринга таблиц и формул.

Три стратегии

1. Конвертация на сервере в PDF/изображения: документ загружается на ваш сервер, конвертируется через LibreOffice/unoserver, возвращается как PDF или набор PNG. На клиент — готовый для отображения формат. Плюс: предсказуемый рендеринг, нет зависимости от мобильного SDK. Минус: задержка конвертации, передача документа через сервер (GDPR-вопросы для чувствительных данных).

2. Нативный просмотрщик ОС: открыть документ в системном приложении (Microsoft Office, QuickLook на iOS). Выходим за пределы своего приложения — это иногда неприемлемо.

3. Клиентская библиотека рендеринга: встроенный рендерер в React Native/Flutter. Ограниченная поддержка форматов, но без серверной зависимости.

iOS: QuickLook и QLPreviewController

iOS предоставляет QLPreviewController — системный просмотрщик, поддерживающий .docx, .xlsx, .pptx, .pdf, .txt, изображения, архивы. Встраивается в приложение через нативный модуль:

// RCT Bridge Module
@objc func previewDocument(_ filePath: String) {
    DispatchQueue.main.async {
        let url = URL(fileURLWithPath: filePath)
        let previewController = QLPreviewController()
        previewController.dataSource = self
        // present over current context
        UIApplication.shared.windows.first?.rootViewController?
            .present(previewController, animated: true)
    }
}

QuickLook рендерит Microsoft-документы через системный движок — качество идентично Microsoft Office на iOS. Ограничение: только просмотр, без редактирования.

В React Native: react-native-doc-viewer использует именно QLPreviewController под капотом для iOS.

Android: нет единого системного просмотрщика

Android не имеет встроенного аналога QLPreviewController для Office-документов. Опции:

Intent ACTION_VIEW: запускает внешнее приложение (Google Drive Docs, Microsoft Office, WPS Office). Пользователь должен иметь хотя бы одно из них. Если нет — приложение крэшит с ActivityNotFoundException. Обязательная проверка:

val intent = Intent(Intent.ACTION_VIEW).apply {
    setDataAndType(fileUri, getMimeType(filePath))
    flags = Intent.FLAG_GRANT_READ_URI_PERMISSION
}
val resolveInfo = packageManager.resolveActivity(intent, PackageManager.MATCH_DEFAULT_ONLY)
if (resolveInfo != null) {
    startActivity(intent)
} else {
    // Fallback: предложить установить Google Docs или открыть как PDF
}

Aspose.Words for Android via Java: коммерческий SDK, рендерит .docx без установленного Office. Качество близко к Microsoft Word. Лицензия от $999/год.

Android WebView + Google Docs Viewer: https://docs.google.com/viewer?url=<encoded_url>. Работает для публичных файлов. Для приватных — файл нужно временно разместить на доступном URL или использовать Google Drive API для шеринга.

react-native-doc-viewer: кросс-платформенная обёртка

import FileViewer from 'react-native-file-viewer';
import RNFS from 'react-native-fs';

const openDocument = async (url: string, filename: string) => {
  // Скачиваем файл в кэш-директорию
  const localPath = `${RNFS.CachesDirectoryPath}/${filename}`;

  const exists = await RNFS.exists(localPath);
  if (!exists) {
    await RNFS.downloadFile({ fromUrl: url, toFile: localPath }).promise;
  }

  await FileViewer.open(localPath, {
    showOpenWithDialog: true, // Android: диалог выбора приложения
    showAppsSuggestions: true,
  });
};

На iOS FileViewer использует QLPreviewController. На Android — ACTION_VIEW с file:// URI через FileProvider (прямой file:// URI заблокирован на Android 7+).

Конвертация на сервере: LibreOffice Headless

Для максимальной совместимости и privacy (документ не покидает вашу инфраструктуру):

# Конвертация .docx → .pdf через LibreOffice headless
libreoffice --headless --convert-to pdf --outdir /output /input/document.docx

unoserver — REST API над LibreOffice для production-использования. Конвертация типичного .docx занимает 1–3 секунды. Кэшируем результат по хэшу файла — не конвертируем одно и то же дважды.

Сравнение подходов

Оценка

QuickLook + Android Intent с fallback на серверную конвертацию: 2–4 недели. С кэшированием конвертированных файлов и поддержкой офлайн-просмотра: 4–6 недель.