Разрабатываем функционал поиска по сайту на PHP и MySQL

Одна из самых популярных и необходимых функций на любом сайте – это поиск, реализованный с помощью специальной формы. Этот функционал позволяет посетителям быстро находить на сайте интересующий их контент.

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

Разрабатывать формы поиска при помощи PHP, а также познакомитесь с SQL (Structured Query Language) – специальным языком для сбора, записи и модификации информации, содержащейся в базах данных. Перед тем как начать, рекомендуем вам скачать файлы проекта.

Что вам понадобится

  • Инструмент для работы с базами данных MySQL.
  • Локальный или удаленный сервер с поддержкой PHP.
  • Текстовый редактор.

Создаем базу данных

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

Самым популярным инструментом для управления MySQL является PHP My Admin, Этого инструмента будет достаточно для нашего сегодняшнего руководства.

Создание таблицы

Наша таблица должна быть создана в следующем формате:

Column NameData TypeLengthNull or Not NullPrimary key?Auto Increment
IDINT1Not NullYesYes
FirstNameVarchar50Not NullNoNo
LastNameVarchar50Not NullNoNo
EmailVarchar50Not NullNoNo
PhoneNumberVarchar15Not NullNoNo

Таблица базы данных состоит из столбцов и строк, как в Excel. Первый столбец позволяет идентифицировать данные по имени. Далее идет колонка Data types (тип данных), которая указывает нам на тип данных, содержащихся в колонке. В поле Length (Длина) указывается максимальный объем памяти (хранилища) для столбца таблицы. Мы используем переменные, которые дают больше гибкости. Другими словами, если длина ФИО меньше 50 символов, то будет занята лишь часть отведенного места.

И среди данных персонала не может быть пустых значений (null, empty). Первая строка выделена желтым цветом, потому что столбец ID – наш основной ключ. Основной ключ в базе данных гарантирует, что каждая запись будет уникальной. К этой колонке также применен автоинкремент, а это значит, что каждой записи в нашей базе данных будет присваиваться уникальный номер автоматически.

Вносим представителей персонала в таблицу

Как только разберетесь с таблицей, начните заполнять ее данными. 6 записей вполне достаточно, чтобы закрепить в уме процедуру. Ниже предлагаю вам собственный пример:

Column IDFirstNameLastName EmailPhoneNumber
2RyanButlerryanbutler@domain.com417-854-8547
3BrentCallahanbrentcallahan@domain.com417-854-6587

Разработка формы

Чтобы создать форму поиска по сайту через Google, откройте любой подходящий текстовый редактор. Я рекомендую воспользоваться бесплатным PSPad. Вы можете использовать любой текстовый редактор, где предусмотрена подсветка синтаксиса. Это в значительной степени облегчит процесс написания и отладки PHP-кода. Создавая страницу для формы поиска, не забудьте сохранить ее в формате .php, иначе PHP-код не будет обрабатываться должным образом. Как только сохраните документ, скопируйте в него следующую разметку:

<!DOCTYPE  HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
  <head> 
    <meta  http-equiv="Content-Type" content="text/html;  charset=iso-8859-1"> 
    <title>Поиск  контактов:</title> 
  </head> 
  <p><body> 
    <h3>Детальный поиск контактов</h3> 
    <p>Вы можете искать по имени или фамилии</p> 
    <form  method="post" action="search.php?go"  id="searchform"> 
      <input  type="text" name="name"> 
      <input  type="submit" name="submit" value="Search"> 
    </form> 
  </body> 
</html> 
</p>

Если вы знакомы с языком HTML, то тут вам все должно быть понятно как минимум до открывающего тега form. Внутри этого тега находится важнейший элемент всего кода – атрибут action. В качестве действия нашей формы мы указали название нашего файла, а затем применили к нему строку запроса “go”.

Проверка на соответствие критерию

Когда пользователь вводит имя или фамилию, а затем нажимает кнопку подтверждения, форма передает данные самой себе и добавляет в конце строку запроса “go”. На данном этапе мы проверяем наличие строки запроса go. Если результат положительный, выводим результаты поиска.

До вывода запрашиваемых результатов нам нужно перепроверить: (1) была ли подтверждена форма, (2) содержит ли строка запроса значение go, (3) был ли поисковой запрос введен в нижнем или верхнем регистре? Если ни одна из проверок не дает положительного результата (true), то от нас не требуется выполнять какие-либо действия.

Для начала добавим небольшой блок кода PHP поиск по сайту после закрывающего тега </form>:

</form> 
<?php 
//сделать что-то в коде 
?> 
</body> 
</html>

Сначала мы открываем блок PHP-кода тегом ””.

Любой PHP-код внутри этой пары тегов будет исполняться сервером. Затем мы проверяем, была ли подтверждена форма:

<?php 
  if(isset($_POST['submit'])){ 
  // сделать что-то в коде
  } 
  else{ 
  echo  "<p> Введите поисковый запрос</p>"; 
  } 
?>

Мы воспользуемся встроенной функцией isset, которая возвращает значение типа bool, и поместим в нее массив $_POST. Логическое выражение в программировании позволяет получить нам либо true, либо false.

Следовательно, если функция возвращает значение true, то форма была подтверждена, и нам нужно продолжить выполнение кода дальше. Если же функция возвращает значение false, то мы выведем сообщение об ошибке. Сохраните весь набранный код в файле search_submit.php.

Далее нам нужно проверить, имеется ли в строке запроса значение go:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  else{ 
  echo  "<p> Введите поисковый запрос</p>"; 
  } 
  } 
  } 
?>

Мы вкладываем еще одно условное логическое выражение внутрь основного, но только в этот раз мы используем массив $_GET вместе со значением “go”. Сохраните изменения в файле search_go.php.

Теперь нам нужно убедиться, что посетители могут вводить первую букву в строку запроса только в верхнем или только в нижнем регистре. Нам также нужно предусмотреть способ учета критериев поиска, введенных посетителем. Лучше всего проверять введенные посетителем данные с помощью регулярного выражения:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  if(preg_match("^/[A-Za-z]+/", $_POST['name'])){ 
   $name=$_POST['name']; 
  } 
  } 
  else{ 
  echo  "<p>Пожалуйста, введите поисковый запрос</p>"; 
  } 
}?>

Мы вкладываем еще одно условное логическое выражение внутрь наших двух. На этот раз мы используем регулярное выражение для проверки ввода. Мы используем встроенную функцию preg_match с двумя параметрами: регулярное выражение, и поле формы, к которому должна применяться проверка.

В нашем случае, это будет поле «Имя» (name). Чтобы извлечь параметры поиска, указанные посетителем, мы создаем переменную $name, и привязываем к ней значение POST с названием поля из формы, которое будет использоваться в SQL-запросе. Сейчас мы реализовали: (1) отправку данных формы, (2) строка запроса включает значение go и (3) посетитель ввел либо заглавную, либо строчную первую букву. И все эти проверки происходят еще до внесения изменений в базу данных. Сохраните все изменения.

Результаты Connect, Select, Query и Return из таблицы базы данных

Чтобы получить данные из таблицы, сначала в скрипте поиска по сайту нужно подключиться к серверу. Для этого мы используем следующий код:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  if(preg_match("/[A-Z  | a-z]+/", $_POST['name'])){ 
  $name=$_POST['name']; 
  //подключение к базе данных 
  $db=mysql_connect ("servername",  "<username>", "<password>") or die (' Я не могу подключиться к базе данных, так как: ' . mysql_error()); 
  else{ 
  echo  "<p> Пожалуйста , введите поисковый запрос</p>"; 
  } 
  } 
}?>

Мы создаем переменную $db, и привязываем ее к встроенной функции MySQL mysql_connect, которая принимает три параметра: сервер с базой данных (localhost, если вы работаете локально), логин и пароль.

После этого мы запускаем встроенную PHP-функцию die, которая останавливает дальнейшее выполнение кода, если нет соединения с базой данных. И выводим информацию об ошибке, запуская встроенную функцию MySQL mysql_error, которая вернет причину ошибки. Сохраните файл search_connectdb.php.

Далее при помощи представленного ниже кода, мы выбираем, какую базу данных использовать:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  if(preg_match("/[A-Z  | a-z]+/", $_POST['name'])){ 
  $name=$_POST['name']; 
  // Подключиться к базе данных
  $db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как ' . mysql_error()); 
  //-Выберите базу данных
  $mydb=mysql_select_db("yourDatabase"); 
  } 
  else{ 
  echo  "<p>Пожалуйста , введите поисковый запрос</p>"; 
  } 
  } 
  } 
?>

Создаем переменную под названием mydb и привязываем ее ко встроенной MySQL-функции mysql_select_db, а затем указываем название базы данных, которую создали ранее. Далее мы опрашиваем таблицу базы данных при помощи SQL-запроса с переменной name, в которой содержатся параметры поиска, введенные посетителем:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  if(preg_match("/[A-Z  | a-z]+/", $_POST['name'])){ 
  $name=$_POST['name']; 
  //Подключиться к базе данных
  $db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как: ' . mysql_error()); 
  //-Выберите базу данных
  $mydb=mysql_select_db("yourDatabase"); 
  //-Запрос к таблице базы данных
  $sql="SELECT ID, FirstName, LastName FROM Contacts WHERE  FirstName LIKE '%" . $name . "%' OR LastName LIKE '%" . $name  ."%'"; 
  } 
  else{ 
  echo  "<p>Пожалуйста , введите поисковый запрос</p>"; 
  } 
  } 
  } 
?>

При опросе таблицы базы данных мы создаем переменную $sql, и привязываем ее к строке, содержащей SQL-запрос. Мы используем оператор SELECT для извлечения значений из столбцов id, а также имени и фамилии из таблицы contacts. Затем мы используем инструкцию WHERE вместе со значениями имени и фамилии, чтобы сузить поиск.

Вместе с оператором LIKE мы используем знак процента (%) – спецсимвол, который возвращает 0 и более знаков, а также переменную name из строки поиска. В результате LIKE (в сочетании со спецсимволом) находит любое соответствующее имя в таблице базы данных. Можно описать весь процесс следующим образом: «Мы выбираем имя и фамилию из таблицы contacts, которые соответствуют введенным посетителем». Сохраните файл search_query.php.

Далее нам нужно поместить результаты SQL-запроса в переменную, и запустить ее при помощи функции mysql_query, как показано ниже:

<?php 
if(isset($_POST['submit'])){ 
if(isset($_GET['go'])){ 
if(preg_match("/[A-Z  | a-z]+/", $_POST['name'])){ 
$name=$_POST['name']; 
// Подключиться к базе данных
$db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как: ' . mysql_error());  
//- Выберите базу данных
$mydb=mysql_select_db("yourDatabase"); 
//- Запрос к таблице базы данных
$sql="SELECT  ID, FirstName, LastName FROM Contacts WHERE FirstName LIKE '%" . $name .  "%' OR LastName LIKE '%" . $name ."%'"; 
//- Запустить запрос к функции MySQL Query
$result=mysql_query($sql); 
} 
else{ 
echo  "<p> Пожалуйста, введите поисковый запрос </p>"; 
} 
} 
} 
?>

Мы создаем переменную $result, и присваиваем ей значение функции mysql_query (), внося ее в $query. Теперь наш запрос хранится в переменной result. Чтобы вывести результат в PHP, мы создаем цикл, а затем выводим данные в неупорядоченном списке:

<?php 
  if(isset($_POST['submit'])){ 
  if(isset($_GET['go'])){ 
  if(preg_match("/^[  a-zA-Z]+/", $_POST['name'])){ 
  $name=$_POST['name']; 
  // Подключиться к базе данных
  $db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как: ' . mysql_error()); 
  //- Выберите базу данных
  $mydb=mysql_select_db("yourDatabase"); 
  //- Запрос к таблице базы данных
  $sql="SELECT  ID, FirstName, LastName FROM Contacts WHERE FirstName LIKE '%" . $name .  "%' OR LastName LIKE '%" . $name ."%'"; 
  //- Запустить запрос к функции MySQL Query
  $result=mysql_query($sql); 
  //-Создание цикла 
  while($row=mysql_fetch_array($result)){ 
          $FirstName  =$row['FirstName']; 
          $LastName=$row['LastName']; 
          $ID=$row['ID']; 
  //-Вывод результата в виде массива 
  echo "<ul>\n"; 
  echo "<li>" . "<a  href=\"search.php?id=$ID\">"   .$FirstName . " " . $LastName .  "</a></li>\n"; 
  echo "</ul>"; 
  } 
  } 
  else{ 
  echo  "<p> Пожалуйста, введите поисковый запрос </p>"; 
  } 
  } 
  } 
?>

Сначала мы создаем цикл while, внутри него создаем переменную под названием row, и инициализируем ее возвращаемым значением функции mysql_fetch_array, которая принимает переменную result, в которой находится наш SQL-запрос. Внутри цикла while мы присваиваем каждому значению столбца значение переменной с идентичным названием. Затем мы выводим значения внутрь неупорядоченного списка.

Здесь важно обратить внимание на два момента: (1) внутри цикла while не нужно присваивать значения переменным массива row, так как значения можно брать напрямую из массива row; (2) тег anchor, который мы используем в названии нашего файла вместе с id и основным ключом. Причина этого заключается в том, что во многих поисковых элементах изначально ничего не отображается.

Так как мы показываем только имя и фамилию, приписывая ID в конце нашего тега anchor, то мы можем использовать ID для дополнительного запроса, который позволит вывести дополнительную информацию о персонале. Сохраните файл и протестируйте форму PHP поиска по сайту (search_display.php).

Убираем табуляцию

Результаты выводятся в виде неупорядоченного списка, но суть в том, что нам не нужна табуляция. Чтобы избавиться от нее, добавьте следующее CSS-правило в самое начало вашего файла в head:

<style  type="text/css" media="screen"> 
ul  li{ 
  list-style-type:none; 
} 
</style>

Поиск по буквам

Для реализации поиска по буквам потребуется лишь несколько дополнительных строк кода. Добавим этот удобный функционал для посетителей. Таким образом, они смогут находить представителей персонала по буквам, которые содержатся в имени или фамилии.

Добавьте следующую строку кода после закрывающего тега form:

</form> 
<p><a  href="?by=A">A</a> | <a  href="?by=B">B</a> | <a  href="?by=K">K</a></p> 
<?php

Мы привязываем тег <a> к строке запроса с by с помощью анкора, и устанавливаем его равным определенной букве. Чтобы реализовать функционал поиска по буквам, нам нужно добавить следующий код прямо после закрывающей фигурной скобки в исходном скрипте, как показано ниже:

}//Окончание скрипта поисковой формы 
if(isset($_GET['by'])){ 
$letter=$_GET['by']; 
//Подключение к базе данных 
$db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как: ' . mysql_error()); 
//-Выберете базу данных 
$mydb=mysql_select_db("yourDatabase"); 
//-Запрос к таблице базы 
$sql="SELECT  ID, FirstName, LastName FROM Contacts WHERE FirstName LIKE '%" . $letter . "%' OR LastName LIKE '%" . $letter ."%'"; 
//-Запустить запрос к функции MySQL Query
$result=mysql_query($sql); 
//-Результаты подсчета
$numrows=mysql_num_rows($result); 
echo  "<p>" .$numrows . " results found for " . $letter . "</p>"; 
//-Запуск цикла и сортировка результатов 
while($row=mysql_fetch_array($result)){ 
$FirstName  =$row['FirstName']; 
            $LastName=$row['LastName']; 
            $ID=$row['ID']; 
//-Вывести результат в массиве
echo  "<ul>\n"; 
echo  "<li>" . "<a  href=\"search.php?id=$ID\">"   .$FirstName . " " . $LastName .  "</a></li>\n"; 
echo  "</ul>"; 
} 
}

Здесь мы изменили четыре фрагмента кода скрипта поиска по сайту:

  • Мы используем функцию isset(), и вносим в нее массив $_GET, а затем проверяем значение by;
  • Создаем переменную $letter и инициализируем ее значение массивом $_GET;
  • Добавляем переменную letter в SQL-запрос;
  • Указываем переменную letter внутри выражения, в котором получаем подсчитанное количество строк.

Сохраните файл search_byletter.php и проверьте результат.

Поиск определенного сотрудника

Чтобы отобразить информацию об остальном персонале, которая передается через уникальное id внутри нашей ссылки, нужно добавить следующий код прямо после закрывающей фигурной скобки в скрипте letter, как показано ниже:

}//Окончание скрипта 
if(isset($_GET['id'])){ 
$contactid=$_GET['id']; 
//Подключение к базе данных 
$db=mysql_connect  ("servername", "username",  "password") or die ('Я не могу подключиться к базе данных, так как: ' . mysql_error()); 
//-select  the database to use 
$mydb=mysql_select_db("yourDatabase"); 
//- Запрос к таблице базы данных
$sql="SELECT  * FROM Contacts WHERE ID=" . $contactid; 
//- Запустить запрос к функции mysql_query()
$result=mysql_query($sql); 
//- Запуск цикла и сортировка результатов
while($row=mysql_fetch_array($result)){ 
  $FirstName =$row['FirstName']; 
            $LastName=$row['LastName']; 
            $PhoneNumber=$row['PhoneNumber']; 
            $Email=$row['Email']; 
//- Вывести результат в массиве
echo  "<ul>\n"; 
echo  "<li>" . $FirstName . " " . $LastName .  "</li>\n"; 
echo  "<li>" . $PhoneNumber . "</li>\n"; 
echo  "<li>" . "<a href=mailto:" . $Email .  ">" . $Email . "</a></li>\n"; 
echo  "</ul>"; 
} 
}

Здесь мы изменили четыре фрагмента кода:

  • Мы используем функцию isset(), и с ее помощью проверяем значение ID в массиве $_GET;
  • Создаем переменную $contactid и инициализируем ее массивом $_GET;
  • В таблице выделяем все, что отмечено звездочкой *. Звездочка – это сокращенное обозначение в SQL, которое означает «дайте мне все столбцы и строки из таблицы». Чтобы определить, какую информацию выводить, мы упоминаем переменную contactid в конце SQL-выражения;
  • Выводим дополнительную информацию о каждом представителе персонала.

Сохраните файл search_byid.php и проверьте результат.

Обратите внимание, что наш функционал работает так, как и положено. При вводе имени или фамилии в поле, или при выборе буквы в качестве гиперссылки, отображаются только имена представителей персонала. Если навести курсор на ссылку, то в строке статуса можно увидеть уникальный ID. Если кликнуть по конкретному человеку, то адресная строка изменится, и отобразится дополнительная информация об этом сотруднике.

SQL-инъекция

Причина, по которой мы добавили в наше поле поиска регулярное выражение, заключается в том, чтобы никто не смог вмешаться в наш SQL-запрос. Раньше эта проблема была распространена, и хакеры умудрялись проводить собственные SQL-запросы, манипулируя при этом вашим приложением. Например, если бы мы допустили возможность использовать апостроф в нашем поле, то хакер мог бы просто удалить базу данных, используя запрос:

'DROP  TABLE <myTable>

Как уже было отмечено, регулярное выражение гарантирует, что в качестве первого символа посетитель может вводить лишь буквы в нижнем или верхнем регистре.

В завершение

В сегодняшней статье мы рассмотрели, как сделать поиск по сайту, а также:

  • Создавать базы данных и соответствующие таблицы;
  • Использовать инструменты для управления базами данных, создавать столбцы и вводить данные;
  • Разрабатывать формы поиска на основе PHP, которая умеет осуществлять проверку вводимых данных, наличия переменных в запросе, а также соединяться с базой данных и выводить результаты из таблицы;
  • Как защитить приложение и базу данных от SQL-инъекций.

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

Перевод статьи “How to Create a Search Feature with PHP and MySQL” был подготовлен дружной командой проекта Сайтостроение от А до Я.

28 февраля 2016 в 13:31
Материалы по теме
{"url":"http://www.fastvps.ru/", "src":"/images/advbanners/fastvps.png", "alt":"Хостинг Fastvps.ru. Наш выбор!"}
Заработок