Web SQL UI (Play)

Документация по Web SQL UI (Play), встроенному интерфейсу запросов в браузере, доступному по пути /play

Web SQL UI (Play) — это встроенный интерфейс запросов для ClickHouse, работающий в браузере. Он доступен на любом HTTP-порту ClickHouse по пути /play (например, http://localhost:8123/play). С его помощью можно писать и выполнять запросы, просматривать результаты в виде таблицы или графика, а также делиться запросом, копируя его URL.

Весь интерфейс содержится в programs/server/play.html: это одна автономная страница, которая напрямую отдается из бинарного файла ClickHouse, без фреймворков и этапа сборки. Единственное исключение — отрисовка графиков: библиотека uPlot загружается отложенно со стороннего CDN при первом отображении результата в виде графика, поэтому графики недоступны в автономных развертываниях или развертываниях с ограничениями на исходящий трафик.

​

Вкладки запросов

Вкладки позволяют держать несколько запросов открытыми рядом, не переключаясь между ними в одном редакторе и не полагаясь на историю браузера.

У каждой вкладки есть собственный текст запроса, заголовок, параметры запроса и последний результат. Настройки подключения (URL, пользователь, пароль) остаются общими для всех вкладок.

​

Когда появляется панель вкладок

Панель вкладок появляется после выполнения запроса или когда вкладок становится больше одной. Одиночная вкладка без результатов выглядит в точности так же, как страница до появления вкладок, поэтому, пока она не понадобится, панель вкладок не показывается.

Активная вкладка визуально сливается со страницей: её фон повторяет цвет хэша данного запроса (тот же цвет, который уже используется для фона страницы), с градиентом, который в светлой теме более насыщен сверху, а в тёмной — более яркий сверху. Неактивные вкладки тонируются в соответствии с хэшем текста своего запроса, поэтому разные вкладки автоматически различаются по цвету.

​

Создание, закрытие и переименование вкладок

• Создайте новую вкладку с помощью кнопки [+] справа от вкладок.
• Закройте вкладку с помощью значка x на самой вкладке.
• Новые вкладки получают имена по умолчанию: Query A, Query B и так далее.
• Щелкните по заголовку активной вкладки, чтобы отредактировать его прямо там; поле редактирования автоматически расширяется по размеру текста.

​

Переключение вкладок

• Нажмите на неактивную вкладку, чтобы перейти на неё.
• Прокрутите колёсико мыши над панелью вкладок, чтобы переключаться между вкладками: прокрутка вверх переключает на вкладку слева, прокрутка вниз — на вкладку справа (если они есть). Работает и вертикальная, и горизонтальная прокрутка колёсиком.

Панель вкладок фиксируется по горизонтали — при горизонтальной прокрутке страницы она остаётся слева, как и логотип ClickHouse внизу, — а по вертикали прокручивается вместе с остальной частью страницы.

​

Сохранение и история браузера

Рабочее пространство — вкладки, их заголовки, активная вкладка, их порядок и небольшие снимки результатов — сохраняется в IndexedDB и восстанавливается после перезагрузки. Сохранение выполняется по мере возможности: если IndexedDB недоступна, рабочее пространство для текущего сеанса ограничивается состоянием в памяти.

Вкладки также интегрируются с History API браузера и URL:

• Состояние истории хранит активную вкладку, поэтому кнопки браузера «Назад» и «Вперёд» переключают вкладки.
• В URL добавляется параметр tab=<name>. При загрузке запрос URL и параметр tab сопоставляются с сохранёнными вкладками: если вкладка с таким именем уже существует, она используется повторно (и её запрос подставляется); если имя не найдено или вкладка была безымянной, создаётся новая. Это позволяет открывать URL с новым запросом, сохраняя при этом собственные сохранённые вкладки.

​

Ограничения

При переключении вкладок во время выполнения запроса состояние его выполнения теряется.

Для восстановления сохраняются снимки только небольших результатов. Большой результат (превышающий ограничение на размер снимка) или результат в виде изображения не сохраняется: после переключения вкладки или перезагрузки вкладка сохраняет запрос, но не отрисованный результат, и повторный запуск запроса воспроизводит его. Это относится как к результатам одного запроса, так и к объединённому выводу при выполнении “Run all” (нескольких запросов).