КОнтакты, предложения, отзывы

.rar или .zip
Вложение
Онлайн-чат
На этом сайте, вы найдёте полезную информацию, практические советы в области веб-программирования, веб-дизайна и веб-разработок в целом. Мы с удовольствием поделимся с вами реальными примерами и решениями задач, связанных с jQuery , JavaScript , PHP и MySQL , версткой сайтов , поможем разобраться новичкам с современными технологиями, такими как Ajax , HTML5 , CSS3 и многими другими.

Ajax Регистрация и авторизация

Всем привет :)


В файле index.php у нас есть две формы: для регистрации и авторизации, в первой - 4 поля: для ввода логина, е-мэйла, пароля и подтверждения пароля. Во второй - всё то же самое, только без подтверждения пароля, при авторизации это не обязательно, как, собсно и е-мэйл, но я оставил его чтоб запутаннее было). Первым делом давайте точно поймём что нам нужно сделать. А нужно нам будет БЕЗ перезагрузки страницы с помощью технологии Ajax, которую, нам на радость, уже включили в библиотеку jQuery, выполнить несколько простых действий) Нам нужно оптравить запросы к серверу через два пхп файла, разных для каждой формы, получить от него ответ и в зависимости от ответа выполнить нужные действия..
Итак, приступим. В файле index.php, как я уже говорил, у нас есть две формы, в которых каждое поле и кнопка имеют идентификатор, и под каждой формой есть спан, в который мы будем вставлять сообщения для пользователя.
Первой на очереди у нас регистрация. Для изменения значений полей ввода напишем функцию change_value, она находится в конце файла js/reggi_auth.js (качаем пример, так будет удобнее, я его по минимуму комментировал, чтоб вы увидели полную картину, а то за комментами иногда и кода не видно) Благодаря ей у нас в полях для логина и Е-мэйла будут изначально значения "Login" и "Е-mail" которые уберутся восвояси при клике. Дальше пишем что у нас будет выполняться при отправке формы - предотвращаем стандартную отправку (e.preventDefault();),создаём переменную, которая будет отвечать за ошибки, записываем в переменную fields все инпуты кроме кнопки отправки и кнопки сброса, и для каждого поля ввода с помощью метода each делаем проверку на заполненность, чтобы нам не отправили одни пробелы + с помощью регулярки для е-мэйла проверяем его правильнось. В случае,, если поле не проходит проверку, делаем его цвет красным и увеличиваем на 1 переменную errors (errors++;), иначе оно получит зелёный фон, говорящий о том, что поле проверку прошло. Потом:
if($('#pass').val() != $('#pass2').val())

проверяем совпадение паролей, если нет. бэкграунд - рэд, errors++. Если ошибок нет, делаем кнопку отправки зелёной, говорим какие данные мы передаём (login:login.val(), e_mail:e_mail.val(),password:password.val() - ) и отправляем аякс-запрос методом POST к файлу reggi.php. В нём происходит проверка отправки данных if(isset($_POST['переменная'])), обезвреживание с помощью функции mysql_entities_fix_string (смотрите статью Предотвращение внедрения SQL и XSS кода) и заносим данные в таблицу
$sql = mysql_query("INSERT INTO users (login,password,e_mail,regdate) VALUES ('".$login."','".$pass."','".$e_mail."','".time()."')");
Только для безопасности заносим в таблицу не то, что нам пришло в поле пароля, а хешируем пароль необратимой функцией md5. Также заносим в таблицу количество секунд, прошедших с 1 января 1970 года, это будет как бы датой регистрации. Табличку тоже прилагаю, импортируйте её в свою базу данных (и не забудьте поменять её название в файле db.php), который отвечает за подключение. Если данные успешно внесены в табличку, через функцию echo эхуем 0, иначе 1. Файл reggi_auth.js принимает ответ и проверяет его значение, если оно равно нулю, то в спан добавляем текст 'Вы успешно зарегистрировались' показываем его, делаем задержку 3 секунды и опять прячем, он свою работу сделал. Если же пришла единица, то говорим "Хьюстон, у нас проблемы" и делаем текст красным,удалив родной класс и добавляя класс error. Если скажет "Хьюстон, у нас проблемы" то скорее всего вы неправильно указали базу данных в db.php или не создали (не импортировали) таблицу users. Итак, полдела сделано, юзер уже от нас не уйдёт :)

Авторизация

Здесь в файле reggi_auth.js всё почти так же как и с регистрацией, составляем аякс-запрос при нажатии на кнопку к файлу enter.php, передаём данные и получаем ответ). Отличие в нём спавнительно с файлом reggi.php в том, что вместо INSERT INTO (вставить) мы делаем выборку строки из таблицы,
$sql_query=("SELECT * FROM users WHERE login='".$name."'");
$sql=mysql_query($sql_query);
if(!$sql) die("Сбой при достпе к базе данных: ".mysql_error());
где ячейка логин = пришедшему значению поля логин. Если совпадение не найдено, делаем echo "нет такого у нас)))"; Дальше проверяем правильность е-мэйла и пароля:
elseif(mysql_num_rows($sql)){  
  // если совпадение найдено, возвращаем массив 
  // где ключи = номера строк 
  $row=mysql_fetch_row($sql);
  if ($pass==$row[2] && $e_mail==$row[3]){
    //...
  } 
}
если всё гут, устанавливаем юзеру на диск две печеньки (cookies) на недельку до второго) чтобы ему не пришлось заново вводить данные для входа при каждом посещении.
setcookie("login", $name, time()+3600*24*7, "/");
setcookie("pass", $pass,time()+3600*24*7, "/");
// И делаем эхо:
echo 0;
Если пришел ответ сервера 0, методом html заменяем содержимое дива на картинку, запускаем mp3 и делаем перезагрузку. А делаем мы её только для того, чтобы увидеть печеньки в действии, их невозможно прочитать без перезагрузки. Вернёмся в самое начало файла index.php: если существуют куки с именами login и pass, стартуем сессию и заносим в переменную $login значение $_SESSION['login']
if(isset($_COOKIE['login']) && isset($_COOKIE['pass'])){
  session_start();
  $_SESSION['login']=$_COOKIE['login'];
  $_SESSION['pasword']=$_COOKIE['pass'];
  $login=$_SESSION['login'];
}
и если она существует (дальше проверяем) выводим на экран приветствие и ссылку на выход: файл logout.php, где выполняется удаление всех переменных сессии и куки (чтобы удалить куки, их нужно повторно установить, сделав время удаления До текущего момента(хитроу)) и делаем перенаправление на файл, откуда пришли, index.php:
header("Location: ".$_SERVER["HTTP_REFERER"]);
. Ну вот и всё, а вы боялись) Тут главное читать код так, как это делает PHP-интерпретатор, с самого начала и до конца. Если по дороге встречаем функцию созданную нами же, ищем её во всём файле, находим, выполняем, идём дальше..
Если что-то непонятно, пишите мне письма, ищите на сайтах PHP.SU , jQuery, сражайтесь, в общем :) Делайте что угодно, проявляйте фантазию, пробуйте, придумывайте.. Всем удачи и пока

2015.02.22 504
jpg

Пора бы уже и врачам взять на вооружение золотое правило программистов: "Если оно работает - лучше не трогай!".
Войдите или Зарегистрируйтесь чтобы оставить комментарий

Комментарии


    Яндекс.Метрика Яндекс.Метрика