В данной статье подробно расскажем как сделать подсветку кода 1С и не только на сайте под управлением CMS Битрикс
С чего всё началось? Мы обновили наш сайт. В качестве шаблона для сайта выбрали
BXReady Флагман Старт. С решениями данной компании Я лично знаком давно. Они представляют из себя "отличный конструктор" для человека, который не сильно разбирается в php и платформе Битрикс. И позволяют очень гибко настраивать дизайн сайта. Поставили сайт на хостинг, настроили, перенесли данные со старого сайта (кстати тоже интересная тема для статьи). И решили писать статьи и активно делиться своим довольно обширным опытом. Но... Хотелось как то красиво оформлять код 1С (и не только) в статьях. В принципе можно было обойтись тэгом "<pre>".
Запрос = Новый HTTPЗапрос("/private/api/auth.php?USER_LOGIN=" + Логин + "&USER_HASH=" + АПИКлюч + "&type=json");
Но это не наш метод.
После довольно продолжительного поиска выяснилось, что это можно сделать используя библиотеку
highlight.js, которая как оказалось поддерживает в том числе и синтаксис 1С. Решение есть. Добрые люди написали библиотеку. Осталось понять как её правильно подключить в битрикс. Поиск на эту тему практически ничего вменяемого не дал. Ну т.е. для программеров, которые работают с битрикс возможно было бы и понятно, но как показали мои обращения в техподдержку битрикс... "Не только лишь все в этом понимают."
В процессе выяснения механизмов подключения библиотек выяснилось следующее. Библиотека highlight.js уже имеется в стандартной поставке платформы Битрикс, а конкретно она обычно располагается по адресу /bitrix/js/ui/highlightjs В принципе это собственно та самая библиотека в том виде, в котором она есть на сайте.
После чего я написал в поддержу ЦР Кузница. Задал вопрос со следующей формулировкой: Как правильно подключить эту библиотеку в Вашем решении? На что получил ответ, что поддержкой данной библиотеки занимается сам Битрикс. ОК. Я не гордый. Пишу тот же самый вопрос в техподдержку битрикс. Отгадайте какой ответ получаю. Получаю ответ, что стандартно эта библиотека работает только в админке, но как подключить к конкретному шаблону должен дать ответ автор шаблона.
После некоторых препирательств с техподдержкой Кузницы, они мне таки помогли. Бесплатно, хотя я предлагал заплатить. За что им большое спасибо.
Что они сделали?
1. Они скачали стандартную библиотеку с официального сайта и записали её в папку на сайте под именем library_highlight. Прям в корень положили... Как выяснилось поздней можно было этого не делать.
2. Подключили библиотеку и стиль к моей странице "Статьи". Вставив в /articles/index.php следующий код:
$APPLICATION->AddHeadScript("/library_highlight/highlight.pack.js");
$APPLICATION->SetAdditionalCSS("/library_highlight/styles/default.css", true);
И немного дальше вставили скрипт:
<script>
hljs.initHighlightingOnLoad();
</script>
И в принципе подсветка кода заработала. Для php... Но не для 1С. Выясняем дальше.
Как оказалось проблема была в том, что та библиотека, которая была установлена в "/library_highlight" поддерживала множество разных синтаксисов, но 1С не было в их числе. Там на сайте нужно было перед скачиванием установить галку напротив синтаксиса 1С, тогда библиотека будет работать с 1С. В общем я не стал ничего заново скачивать, я просто подключил стандартную библиотеку битрикс, которая уже содержала нужный код:
$APPLICATION->AddHeadScript("/bitrix/js/ui/highlightjs/highlight.pack.js");
В общем всё заработало как надо, но подсветка была "не по феншую".
Приведу текст самой css и дам ссылку на скачивание.
/*
1C-Enterprise Classic theme - Andrey Telnov
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #FFFFFF;
}
/*Базовый цвет Base color*/
.hljs,
.hljs-subst {
color: #0000FF;
}
.hljs-number,
.hljs-string {
color: #000000;
}
.hljs-built_in,
.hljs-type,
.hljs-params,
.hljs-variable,
.hljs-symbol,
.hljs-title,
.hljs-class {
color: #0000FF;
font-weight: bold;
}
.hljs-literal,
.hljs-keyword {
color: #FF0000;
}
/*Цвет комментария Comment color*/
.hljs-comment {
color: #008000;
}
/*Цвет препроцессора Preprocessor color*/
.hljs-meta,
.hljs-meta-string,
.hljs-meta-keyword {
color: #963200;
Единственный момент который не удалось победить это то что скобки, точки с запятой и пр. спецсимволы выводятся общим цветом. Есть подозрение, что для этого нужно модифицировать саму библиотеку.
Можете оценить то что вышло:
#Область РаботаСАМОЦРМ
//Возвращает структуру ответа на авторизацию
// Параметры:
// АдресСайта - Строка - адрес сайта в сервисе amoCRM без "https://"
// Логин - Строка - Логин пользователя в сервисе amoCRM (электронная почта)
// АПИКлюч - Строка - Ключ пользователя в сервисе amoCRM (можно получить в настройках)
// МассивОшибок - Массив строковых значений с кодами ответа сервера для записи в журнал обмена или журнал регистрации передается массив строк или пустой массив
// Возвращаемое значение:
// Структура - со свойствами:
// * РезультатАвторизации - Структура - Структура JSON согласно описанию на сайте amoCRM (https://www.amocrm.ru/developers/content/api/auth)
// * КодСостояния - Число - Код ответа сервера
// * ЗаголовокАвторизации - Строка - Заголовок для авторизации с идентификатором сессии который необходимо вставить в заголовки при отправки запросов через API
// * СессияИстекает - Дата - Рассчетное время истечения сессии
Функция АвторизацияНаСервере(АдресСайта,Логин,АПИКлюч, МассивОшибок) Экспорт
СтруктураОтвета = Новый Структура;
Соединение = Новый HTTPСоединение(АдресСайта,443,,,,,Новый ЗащищенноеСоединениеOpenSSL());
Запрос = Новый HTTPЗапрос("/private/api/auth.php?USER_LOGIN=" + Логин + "&USER_HASH=" + АПИКлюч + "&type=json");
Результат = Соединение.ОтправитьДляОбработки(Запрос);
Поток = Результат.ПолучитьТелоКакПоток();
Чтение = Новый ЧтениеJSON;
Чтение.ОткрытьПоток(Поток);
СтруктураОтвета.Вставить("РезультатАвторизации",ПрочитатьJSON(Чтение));
СтруктураОтвета.Вставить("КодСостояния",Результат.КодСостояния);
Если Результат.КодСостояния = 200 Тогда
Куки = Результат.Заголовки.Получить("Set-Cookie");
СтруктураОтвета.Вставить("ЗаголовокАвторизации",Куки);
СтруктураОтвета.Вставить("СессияИстекает",ТекущаяДата() + 840);
ИначеЕсли Результат.КодСостояния = 401 Тогда
МассивОшибок.Добавить("Ошибка авторизации код ответа: " + Результат.КодСостояния);
СтруктураОтвета.Вставить("ЗаголовкиАвторизации","");
ИначеЕсли Результат.КодСостояния = 403 Тогда
МассивОшибок.Добавить("Ошибка авторизации код ответа: " + Результат.КодСостояния);
СтруктураОтвета.Вставить("ЗаголовкиАвторизации","");
Иначе
МассивОшибок.Добавить("Ошибка авторизации код ответа: " + Результат.КодСостояния);
СтруктураОтвета.Вставить("ЗаголовкиАвторизации","");
КонецЕсли;
Чтение.Закрыть();
Соединение = Неопределено;
Возврат СтруктураОтвета;
КонецФункции
#КонецОбласти
Андрей Тельнов
Программист 1С