Начинаю самостоятельное изучение веб-технологий и столкнулся с довольно интересной вещью, удобной для разработка сложных сайтов. Речь идёт о связке jQuery + AJAX + PHP.
JQuery – это фреймворк (библиотека), позволяющая упростить взаимодействие JavaScript и HTML в документах. Штука заслуживает внимания, я покажу пример работы ниже.
AJAX даёт нам возможность обмениваться данными между браузером и сервером без перезагрузки страницы, то есть делать почти полноценное веб-приложение, наподобие тех же форм, как в Delphi и др.
PHP – язык программирования, интерпретируемый на стороне сервера. Ниже я приведу пример взаимодействия.
Итак, у нас есть веб-сервер с базой данных, например логины и хеш паролей. Попробуем создать простой пример авторизации без перезагрузки страницы. Разумеется, пример не действующий, но для общего развития может понадобиться. Сейчас я вовсю эту тему изучаю, может быть она будет интересна и вам тоже.
Итак, на сервере есть страница со следующим кодом:
<!-- Подключаем фреймворк -->
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
…
Логин: <input type="text" id="login" /><br />
Пароль: <input type="password" id="pass" /><br />
<div id="auth">Авторизоваться</div>
<script>
$(function () {
// При клике на элемент с id auth
$('#auth').click(function (){
// Выполняем AJAX
$.ajax({
// Метод POST
type:"POST",
// Скрипт action.php
url:"action.php",
// Массив переменных POST, действие "auth_me", значение поля логин и значение поля пароль
data:({action:'auth_me',login:$('#login').val(),pwd:$('#pass').val()}),
// Тип возвращаемого значения - текст, можно формат json
dataType:"text",
// В случае успеха, выполняем функцию
success: function(rezult){
// Текст элемента с id auth меняем на то, что вернётся от сервера (см. ниже)
$('#auth').val(rezult);
}
}); }); }
</script>
Далее, на сервере у нас есть файл action.php, содержащий функционал:
<?php
...
// Коннектимся к базе
$con = @mysql_connect('......');
// Если тип действия - авторизация
if ($_REQUEST['action'] == 'auth_me')
{
// Получаем массив полей значения по запросу (выбрать все элементы, где логин = присланному логину)
$row=@mysql_fetch_assoc(@mysql_query('SELECT `password` FROM `auth` WHERE `login` = \'@mysql_real_escape_string($_REQUEST['login'])\''));
// Если хеш пароля в базе равен хешу пароля, присланного из ajax, то вывод текста "Авторизованы", иначе "Неверный пароль"
if ($row['password'] == md5($_REQUEST['pwd'])) { echo 'Авторизованы';} else {echo 'Неверный пароль';}
}
...
?>
Нетрудно проследить логику, возвращаемый текст PHP попадет не на экран браузера, а вернется в .ajax, где будет присвоен элементу страницы с id=auth.
Пример, конечно, простой и утрированный, но помогает понять, как с помощью него можно развить форму и превратить её в полноценное веб-приложение с десятком процедур обмена данными.
Comments: