Поддержка форматов комментариев

В комментарии можно добавлять различное содержимое, включая расширенный синтаксис Markdown и HTML-теги.

Поддержка форматов

Мы поддерживаем полный CommonMark (стандартный синтаксис Markdown), а также следующие расширения:

• таблицы в стиле GFM
• зачёркивание в стиле GFM
• нижние и верхние индексы
• эмодзи
• подсветка блоков кода
• формулы $TEX$

GFM

Github Flavored Markdown

Кроме того, можно свободно встраивать любое HTML-содержимое, не срабатывая при этом механизм защиты.

Ограниченная поддержка предпросмотра

Чтобы контролировать размер клиента, в официальный клиент @waline/client встроен лишь небольшой парсер Markdown, из-за чего многие конструкции отображаются в панели предпросмотра некорректно (они корректно отображаются в области комментариев).

Это включает следующие ограничения:

• Стандартный синтаксис эмодзи (например, 🎉:tada:) отображается некорректно

• Верхние и нижние индексы (например, H~2~O, x^2^) не отображаются корректно

• Синтаксис $TEX$, то есть математические формулы (например, $a = 1$), по умолчанию не отображается.

  При использовании официального клиента можно настроить отображение $TEX$ в предпросмотре с помощью параметра texRenderer, см. Рецепты → Использование собственного рендерера $TEX$.

• При стандартном подсветчике блоки кода подсвечиваются случайными цветами с определёнными разделителями.

  При использовании официального клиента можно настроить подсветку кода в предпросмотре с помощью параметра highlighter, см. Рецепты → Пользовательская подсветка кода.

Дополнительно

Принцип

1. Учитывая размер пакета, клиент использует marked для отрисовки и подсветчик размером < 1kb для подсветки по умолчанию, а также не включает рендерер $TEX$, что и приводит к описанным выше ограничениям.

2. Когда пользователь отправляет комментарий, клиент встраивает собственное изображение эмодзи и отправляет исходный комментарий на сервер.

3. Сервер получает исходный текст, корректно отрисовывает Markdown с помощью markdown-it и соответствующих плагинов, подсвечивает блоки кода по языку с помощью prismjs, выполняет отрисовку $TEX$ в соответствии с настройками пользователя и, наконец, выполняет XSS-обработку.

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