Руководство по интеграции статического предварительного просмотра

Продукты: МоиОтчеты Облако, МоиОтчеты Корпоративный Сервер, МоиОтчеты Публикатор

Это руководство предоставляет подробные инструкции по интеграции отчетов Сервисных решений в ваши веб-приложения с использованием iframe.

Базовая настройка iframe

Сервис статического предварительного просмотра Сервисных решений разработан таким образом, чтобы его было легко внедрить в ваши веб-приложения с помощью iframe. Это позволяет легко интегрировать предварительный просмотр отчетов в существующие пользовательские интерфейсы.

<iframe 
  src="https://yourdomain.ru/staticpreview/t/your-template-id?apikey=your-api-key"
  width="100%"
  height="600px"
  frameborder="0"
  style="border: 1px solid #ccc;">
</iframe>

🔗 Структура URL

URL-адрес источника iframe следует такому шаблону:

https://yourdomain.ru/staticpreview/{type}/{report-id}?{parameters}

Пример: https://xn--80ab2acne.xn--e1aflibyb2b0b.xn--p1ai/staticpreview/{type}/{report-id}?{parameters}

Где:

{type}: t для шаблонов или r для отчетов
{report-id}: идентификатор шаблона или отчета
{parameters}: параметры строки запроса для аутентификации и конфигурации

Параметры аутентификации

Аутентификация по API-ключу

<!-- Для аутентификации по API-ключу -->
<iframe src="https://yourdomain.ru/staticpreview/t/template-123?apikey=your-api-key-here"></iframe>

Параметр: apikey

Обязательный: Да (для аутентификации по API-ключу)
Описание: Ваш API-ключ МоиОтчеты Облако, МоиОтчеты Корпоративный Сервер или МоиОтчеты Публикатор
Пример: apikey=dw3ized7i7i97qjsrg4mesn3n8r1bpi54wbyhywpfier7er3nqjo

Аутентификация по ключу доступа

<!-- Для аутентификации по ключу доступа -->
<iframe src="  https://yourdomain.ru/staticpreview/r/report-456?accessKey=your-access-key"></iframe>

Параметр: accessKey

Обязательный: Да (для аутентификации по ключу доступа)
Описание: Временный ключ доступа для конкретного отчета
Пример: accessKey=temp-key-abc123def456

Параметры отчета

Для шаблонов, требующих параметры, используйте формат параметра rp:

<iframe src="https://yourdomain.ru/staticpreview/t/sales-report?apikey=your-key&rp=StartDate:2023-01-01&rp=EndDate:2023-12-31&rp=Region:North"></iframe>

Параметр: rp (Параметры отчета)

Формат: rp=ИмяПараметра:ЗначениеПараметра
Множественные: Используйте несколько параметров rp для разных значений
Описание: Устанавливает начальные значения параметров отчета
Примеры:
- Дата: rp=StartDate:2023-01-01
- Строка: rp=CustomerName:John Doe
- Число: rp=MinAmount:1000
- Логическое значение: rp=IncludeInactive:true

Параметры должны быть указаны внутри шаблона отчета.

Локализация пользовательского интерфейса

Сервис автоматически определяет язык из:

Конфигурации сервера (если доступно)
Настроек языка браузера

Локализация отчета

Локализация отчета будет использоваться из самих параметров отчета. Или из параметров рабочей области.

Примеры адаптивных iframe

Адаптивный на всю ширину

<div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;">
  <iframe 
    src="  https://yourdomain.ru/staticpreview/t/template-123?apikey=your-key"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;"
    allowfullscreen>
  </iframe>
</div>

Интеграция в модальное окно/диалог

<div class="modal" id="reportModal">
  <div class="modal-content" style="width: 90%; height: 90%;">
    <iframe 
      id="reportFrame"
      src="  https://yourdomain.ru/staticpreview/t/template-123?apikey=your-key"
      style="width: 100%; height: 100%; border: none;">
    </iframe>
  </div>
</div>

<script>
function openReport(templateId, apiKey, parameters = {}) {
  const baseUrl = '  https://yourdomain.ru/staticpreview/t/  ' + templateId;
  const params = new URLSearchParams({ apikey: apiKey });
  
  // Добавление параметров отчета
  Object.entries(parameters).forEach(([key, value]) => {
    params.append('rp', `${key}:${value}`);
  });
  
  document.getElementById('reportFrame').src = baseUrl + '?' + params.toString();
  document.getElementById('reportModal').style.display = 'block';
}

// Использование
openReport('sales-report', 'your-api-key', {
  StartDate: '2023-01-01',
  EndDate: '2023-12-31',
  Region: 'North America'
});
</script>

Соображения безопасности

Защита API-ключа: Никогда не раскрывайте API-ключи в клиентском коде в продакшене
Ключи доступа: По возможности используйте временные ключи доступа
HTTPS: Всегда используйте HTTPS для источников iframe в продакшене
Заголовки CSP: Настройте политику безопасности контента для разрешения источников iframe

<iframe src="..."></iframe>

Справочник параметров

Параметр	Тип	Обязательный	Описание	Пример
`apikey`	Строка	Да*	API-ключ МоиОтчеты Облако, МоиОтчеты Корпоративный Сервер или МоиОтчеты Публикатор	`apikey=your-api-key`
`accessKey`	Строка	Да*	Временный ключ доступа	`accessKey=temp-key-123`
`rp`	Строка	Нет	Параметр отчета в формате `Имя:Значение`	`rp=StartDate:2023-01-01`

* Требуется либо apikey, либо accessKey в зависимости от метода аутентификации.

Table of Contents