Приветствую всех!
Сегодня я хочу обсудить два способа передачи параметров в JavaScript файлы.
Прежде всего, объясню, в чем заключается проблема. Обычно в конфигурационных файлах серверных (PHP) скриптов хранится множество настроек. И к некоторым из них нужно получить доступ из JavaScript. Если все эти параметры собраны в одном месте (конфигурационном файле или БД), то значительно упростится поддержку приложения.
Существует два широко распространенных решения этой задачи.
1) Генерация JS кода с помощью серверного скрипта.
Тут нужно помнить о том, что любой запуск скриптов на сервере создает дополнительную нагрузку. Поэтому генерировать JS скрипты целиком не правильно. Гораздо проще вставить небольшой фрагмент JS кода, который создаст массив с параметрами, прямо внутрь страницы, а основную часть JS кода разместить в статичных файлах.
Поясню сказанное на примере.
Допустим у нас есть страница (index.php) и js файл (my-scripts.js). Нам нужно передать несколько параметров из массива $config.
Страница будет выглядеть так.
<script type="text/javascript">
$(function() {
$.config = {
par1:<?php echo $config['par1']; ?>
};
});
</script>
<script type="text/javascript" src="my-script.js"></script>
Как видите, мы создали глобальный хеш ($.config) и установили для его элемента par1 значение из массива $config.
Примечание. Для работы этого примера нужно подключить библиотеку jQuery.
Теперь хеш $.config можно использовать в my-script.js. Например, так
$(function() {
alert($.config.par1);
});
Примечание. Если вам нужно передавать сложные структуры с параметрами, то будет удобнее использовать JSON формат.
2) Передача параметров в атрибуте src скрипта.
Этот способ используется загрузчиком библиотеки Script.aculo.us.
Идея следующая.
1) Необходимые параметры добавляются прямо к адресу скрипта. Напрмер, так
src="my-script.js?par1=myValue&par2=value2
Т.е. мы формируем GET запрос. Но естественно статичный JS файл его обработать не может.
2) Чтобы получить доступ к этим параметрам, мы добавляем в JS файл код, который:
2.1) находит соответствующий тег script;
2.2) читает его атрибут src;
2.3) получает строку с параметрами, например, с помощью такого регулярного выражения
/my-script\.js(\?.*)?$/
2.4) разбирает строку с параметрами (это можно сделать с помощью функции split).
Приводить пример для этого способа я не буду, т.к., во-первых, его можно посмотреть в исходниках script.aculo.us (файл scriptaculous.js, строки 48-56), а во-вторых, на мой взгляд, он обладает несколькими серьезными недостатками.
1) Вы не сможете передать большой объем данных таким способом, т.к. существуют ограничения на длину URL.
2) Значительно усложняется код как серверной, так и клиентской частей приложения. Сервер должен преобразовать массив с данными в строку, а браузер выполняет обратную операцию.
В общем, я понимаю, почему этот способ использовали разработчики script.aculo.us. Они передают только названия компонентов библиотеки, которые нужно подключить. И для пользователя такая запись перечня компонентов выглядит проще, чем вставка отдельного тега script. Но для передачи более сложных параметров этот метод подходит плохо.
На этом известные мене способы передачи параметров заканчиваются 🙂
Если у вас возникли идеи, пишите, буду рад обсудить!
