PHP и JavaScript

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

В языках PHP и JavaScript предусмотрены разные объектные системы обозначений. В языке JavaScript используется так называемая уточняющая запись через точку в стиле C#, тогда как в языке PHP используются стрелки, иначе говоря, система обозначений в стиле C++. Язык JavaScript полностью объектно-ориентирован, тогда как в языке PHP объекты рассматриваются как необязательное средство. Такое различие систем обозначений имеет свое преимущество в том, что невозможно когда-либо спутать объект JavaScript с объектом PHP, или наоборот. А недостатком является то, что отсутствует возможность обратиться к одному и тому же объекту из обоих языков.

Вывод кода JavaScript с помощью сценария PHP

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

Безусловно, язык PHP обладает большими возможностями по созданию динамически формируемых веб-страниц, но PHP — исключительно серверный язык. К тому же есть одна общая категория задач, решаемых на веб-сайте, для которых чаще всего не требуется вся обрабатывающая мощь сервера, и поэтому эти задачи быстрее и проще решаются в клиентском программном обеспечении. К таким задачам, например, относится изменение внешнего вида кнопки при перемещении над ней курсора мыши. Для решения многих подобных задач можно легко применить язык JavaScript, который представляет собой чисто клиентский язык (безусловно, имеется и серверная версия этого языка, но предполагается, что для этой цели уже выбран язык PHP) и легко интегрируется с языком PHP.

С другой стороны, клиентский язык JavaScript сам по себе характеризуется многими ограничениями. Например, будучи клиентским языком, JavaScript не позволяет организовать непосредственное взаимодействие с базой данных, поэтому сценарии JavaScript не способны обновлять сами себя путем получения новых данных, зависящих от условий просмотра страницы.

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

Широкие возможности вывода данных в языке PHP

Одной из наиболее важных особенностей языка PHP является то, что с его помощью можно обеспечить вывод кода в различных форматах. В частности, PHP может применяться (и применяется) для вывода открытого текста, кода HTML, XHTML, JavaScript, XML, MathML, файлов в различных графических форматах, кода CSS, XSL и даже (что трудно сначала представить себе) кода ASP.NET.

Кроме того, нет каких-либо реальных технических сложностей, которые не позволяли бы выводить с помощью языка PHP код C, хотя, по-видимому, такой способ применения PHP не находит слишком широкого распространения. Следует помнить, что язык PHP не используется исключительно для вывода кода HTML — конечным продуктом применения этого языка обычно становится код, предназначенный для обработки другим приложением, обычно браузером.

Для вывода кода JavaScript с помощью языка PHP может применяться целый ряд способов. Простейшим из них является выход из режима PHP каждый раз, когда требуется непосредственно включить какой-то текст в код страницы, передаваемый в клиентскую программу. Данный способ осуществляется точно по такому же принципу, как происходит выход из режима PHP для формирования кода HTML. Например:

<?php
    echo 'Какой-то код PHP<br>';
?>
<script>
    document.write('Строгое разделение клиентского и серверного кода это хорошо<br>');
</script>
<?php
    echo 'Еще один блок кода PHP';
?>

Но этот пример не демонстрирует наилучший способ формирования кода JavaScript в сценарии PHP. Гораздо удобнее формировать основной объем кода определения функций JavaScript в элементе <head> HTML-страницы и просто вызывать эти функции в элементе <body>, используя для формирования этих вызовов главным образом язык PHP.

Как и при формировании в сценарии PHP кода HTML, в некоторых случаях код JavaScript можно формировать, не выходя из режима PHP. К тому же подобный стиль организации работы сценариев PHP может соответствовать личным предпочтениям разработчика. В этом случае для вывода кода JavaScript может использоваться оператор echo или print языка PHP, как в следующем примере:

<?php
    echo <<<EOT
Какой-то код PHP<br>
<script>
    document.write('Строгое разделение клиентского и серверного кода это хорошо<br>');
</script>	
Еще один блок кода PHP
EOT;

?>

Стиль, в котором вывод кода JavaScript осуществляется полностью в режиме PHP, нельзя считать совсем неправильным, но при его использовании значительно затрудняется создание безошибочно действующих сценариев. Поэтому такой стиль следует отдать в распоряжение опытных программистов, а менее опытные программисты должны применять его исключительно в тех случаях, когда в код формируемой страницы требуется включить вызовы заранее определенных функций JavaScript, например, касающихся событий onsubmit.

Области применения языка JavaScript

Клиентский код JavaScript не обладает чрезвычайно большими функциональными возможностями, но позволяет быстрее решать некоторые задачи, а также создавать такие эффекты, которые довольно сложно воспроизвести с помощью PHP. Ниже перечислены такие функциональные средства кода, которые действительно следует дополнить или заменить в коде HTML-страницы функциями JavaScript:

• Простые арифметические операции в формах и калькуляторах (такие как вычисление промежуточной суммы по товарам, собранным в тележку для покупок, и расчет платежей по ипотечной задолженности).

• Простая проверка правильности формы (например, определение наличия символов @ в адресах электронной почты).

• Реализация средств навигации сайта (например, создание разворачивающихся меню навигации).

• Создание всплывающих меню (предупреждений, окон поиска).

• Обработка событий, обнаруживаемых в браузере (mouseover, onclick).

Резервирование функциональных средств кода JavaScript с помощью кода PHP

Безусловно, как показывают приведенные выше рекомендации, язык JavaScript позволяет расширить функциональные возможности сайта, но если язык JavaScript не установлен в браузере или его использование запрещено, то компенсировать отсутствие поддержки JavaScript можно с помощью PHP. Дело в том, что иногда существует возможность безукоризненно выполнить одну и ту же задачу и с помощью клиентского, и с помощью серверного метода.

Если в браузере посетителя будет разрешено применение языка JavaScript, то посетитель получает возможность воспользоваться более быстрым методом. В противном случае применяется менее быстрый, резервный метод, но обычно посетители даже не замечают, что в коде сайта реализуется подобный выбор. А если бы не было возможности вместо кода JavaScript переходить к использованию кода PHP, то пользователи браузера без поддержки JavaScript были бы полностью лишены доступа к функциональным средствам сайта.

Идеальным примером резервирования кода JavaScript с помощью кода PHP является дважды зарезервированное разворачивающееся меню для навигации по страницам сайта без использования ссылок. Код JavaScript обеспечивает мгновенное перенаправление, а если в браузере не разрешено использование JavaScript, то в действие вступает код PHP, с помощью которого достигается такой же результат, но после более продолжительного ожидания.

В этом примере взят за основу тот факт, что в коде JavaScript имеются обработчики событий (например, onchange), которые выполняют свои действия в результате прохождения курсора над элементами формы HTML, поэтому фактически не требуют передачи данных формы щелчком на кнопке. Это означает, что кнопка Submit может быть зарезервирована для использования в коде PHP. В примере ниже показан сценарий формирования HTML-страницы, в котором используется перенаправление с помощью события onchange языка JavaScript, а если этот код не работает, то применяется обработчик формы PHP:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Основы PHP</title>
<script>
function Browse(form, i)
{
	var site = form.elements[i].selectedIndex; 
	if (site > 0)
	{
		top.location = form.elements[i].options[site].value 
	}
}
</script>
</head>
<body>
<form method="post" action="redirect.php">
	<select name="category" onchange="Browse (this.form, 0) ">
    	<option selected value="0">Выберите категорию</option>
        <option value="desktop.php">Desktops</option>
        <option value="laptop.php">Laptops</option>
        <option value="monitor.php">Monitors</option> 
        <option value="input.php">Input devices</option>
        <option value="storage.php">Storage devices</option> 
    </select>
    
    <input type="submit">
</form>
</body>
</html>

В файле обработчика формы PHP, называемом redirect.php, достаточно предусмотреть только две строки:

$category = $_POST['category']; 
header("Location: $category");

Аналогичное разделение труда можно предусмотреть при проверке правильности формы. Если разрешено использование языка JavaScript, то с его помощью можно убедиться в том, что номера телефонов имеют десять цифр, а адреса электронной почты включают и символ @ и еще какие-то символы. Если же применение JavaScript не разрешено, то можно написать небольшой сценарий PHP, который выполняет такие же действия при передаче данных формы и возвращает сообщение с предупреждением, если введенные значения являются неправильными.

Сравнение методов статического и динамического формирования кода JavaScript

Безусловно, статическая форма JavaScript — PHP, приведенная в примере выше, удобна для использования во многих приложениях, но она имеет один существенный недостаток — ее приходится сопровождать вручную. Каждый раз, когда потребуется добавить новую страницу к сайту, необходимо будет вспоминать о том, что ссылку на эту страницу необходимо ввести вручную в код формирования раскрывающегося списка. На первый взгляд может показаться, что в этом нет ничего особенного, но из массы таких мелочей складывается невероятно трудоемкая работа, когда приходится сопровождать огромный сайт с интенсивным трафиком.

Используя язык PHP в сочетании с базой данных, вы можете обеспечить автоматическое обновление определенной части кода JavaScript каждый раз после ввода новых данных в базу данных, иначе говоря, обеспечить динамическое обновление. К достижению такой цели следует стремиться при любой возможности, поскольку в долговременном плане это помогает экономить время. В примере ниже показано, как можно модифицировать форму, чтобы обеспечить лучшую интеграцию клиентского и серверного кода:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Основы PHP</title>
<script>
function Browse(form, i)
{
	var site = form.elements[i].selectedIndex; 
	if (site > 0)
	{
		top.location = form.elements[i].options[site].value 
	}
}
</script>
</head>
<body>
<form method="post" action="redirect.php">
	<select name="category" onchange="Browse (this.form, 0) ">
    	<option selected value="0">Выберите категорию</option>
<?php 
	// Предполагается наличие MySQL-базы данных devises с root-доступом, 
	// с таблицей categories, имеющей поля filename и device
	$link = mysqli_connect('localhost', 'root', '', 'devises') or die('Нет подключения');
	$query = "SELECT filename, device FROM categories";
	
	if ($result = mysqli_query($link, $query)) {
		while($row = mysqli_fetch_array($result)) 
		{
			echo '<option value="'.$row['filename'].'">'.$row['device'].'</option>';
		}
	}

?>
    </select>
    
    <input type="submit">
</form>
<option value="desktop.php">Desktops</option>
        <option value="laptop.php">Laptops</option>
        <option value="monitor.php">Monitors</option> 
        <option value="input.php">Input devices</option>
        <option value="storage.php">Storage devices</option> 

</body>
</html>

Несомненно, читатель уже понял, что аналогичный метод может оказаться буквально бесценным, даже если создается простая форма JavaScript (например, такая, в которой используется обработчик событий onsubmit, а не onchange). В частности, этот метод позволяет модифицировать вызовы обычных функций JavaScript, поскольку язык PHP позволяет изменять значения переменных в вызове функции, до того как код этого вызова будет отправлен в браузер. Поэтому при желании сценарии PHP могут использоваться непосредственно для вывода кода JavaScript, в котором предварительно осуществляется подстановка значений переменных, взятых из какого-то источника данных.

Передача данных в обратном направлении, из кода JavaScript в код PHP

Наконец, рассмотрим, как завершить цикл обработки данных, снова передав значения формы в код PHP из кода JavaScript. В примере ниже показано, как использовать код JavaScript, для передачи в сценарий PHP простого объекта:

<?php
    $js_data = isset($_POST['hide']) ? $_POST['hide'] : '';
	
	if (!empty($js_data))
	{
		// Парсим JSON и получаем объект JS в виде ассоциативного массива
		$js_data = json_decode($js_data);
		
		foreach($js_data as $key => $value) {
			echo '<b>'.$key.'</b> => '.$value.'<br>';
		}
	}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Основы PHP</title>
<script>
window.onload = function() {
	// Найти скрытое поле в форме
	var hidden = document.getElementsByTagName('form')[0].elements['hide'];
	
	// Передать объект JavaScript в JSON-формате
	hidden.value = JSON.stringify({x:1, y:1, name:'Alex'});
}
</script>
</head>
<body>
<form method="post">
    <input type="hidden" name="hide">
    <input type="submit" value="Отправить данные коду PHP">
</form>

</body>
</html>