Одна из самых популярных и необходимых функций на любом сайте – это поиск, реализованный с помощью специальной формы. Этот функционал позволяет посетителям быстро находить на сайте интересующий их контент.
Сегодня мы хотим рассказать, как сделать поиск по сайту с помощью специальной формы, которая будет опрашивать таблицы базы данных и выводить информацию о текущих руководителях на сайте. Вы научитесь создавать таблицы базы данных, которая будет содержать в себе информацию о текущем персонале.
Что вам понадобится
Создаем базу данных
Если вы не совсем уверены, что сможете разобраться с базой данных на вашем хостинге, то свяжитесь с хостером для получения соответствующих инструкций или помощи. После того как база данных будет создана, вам нужно будет подключить ее, создать таблицу и записать в нее необходимые данные.
Создание таблицы
Наша таблица должна быть создана в следующем формате:
Column Name
Data Type
Length
Null or Not Null
Primary key?
Auto Increment
ID
INT
1
Not Null
Yes
Yes
FirstName
Varchar
50
Not Null
No
No
LastName
Varchar
50
Not Null
No
No
Email
Varchar
50
Not Null
No
No
PhoneNumber
Varchar
15
Not Null
No
No
И среди данных персонала не может быть пустых значений ( null, empty ). Первая строка выделена желтым цветом, потому что столбец ID – наш основной ключ. Основной ключ в базе данных гарантирует, что каждая запись будет уникальной. К этой колонке также применен автоинкремент, а это значит, что каждой записи в нашей базе данных будет присваиваться уникальный номер автоматически.
Вносим представителей персонала в таблицу
Как только разберетесь с таблицей, начните заполнять ее данными. 6 записей вполне достаточно, чтобы закрепить в уме процедуру. Ниже предлагаю вам собственный пример:
Column ID
FirstName
LastName
Email
PhoneNumber
2
Ryan
Butler
ryanbutler@domain.com
417-854-8547
3
Brent
Callahan
brentcallahan@domain.com
417-854-6587
Разработка формы
Проверка на соответствие критерию
До вывода запрашиваемых результатов нам нужно перепроверить: (1) была ли подтверждена форма, (2) содержит ли строка запроса значение go, (3) был ли поисковой запрос введен в нижнем или верхнем регистре? Если ни одна из проверок не дает положительного результата ( true ), то от нас не требуется выполнять какие-либо действия.
Для начала добавим небольшой блок кода PHP поиск по сайту после закрывающего тега :
Сначала мы открываем блок PHP-кода тегом ””.
Любой PHP-код внутри этой пары тегов будет исполняться сервером. Затем мы проверяем, была ли подтверждена форма:
Далее нам нужно проверить, имеется ли в строке запроса значение go :
Теперь нам нужно убедиться, что посетители могут вводить первую букву в строку запроса только в верхнем или только в нижнем регистре. Нам также нужно предусмотреть способ учета критериев поиска, введенных посетителем. Лучше всего проверять введенные посетителем данные с помощью регулярного выражения:
Мы вкладываем еще одно условное логическое выражение внутрь наших двух. На этот раз мы используем регулярное выражение для проверки ввода. Мы используем встроенную функцию preg_match с двумя параметрами: регулярное выражение, и поле формы, к которому должна применяться проверка.
Результаты Connect, Select, Query и Return из таблицы базы данных
Чтобы получить данные из таблицы, сначала в скрипте поиска по сайту нужно подключиться к серверу. Для этого мы используем следующий код:
Далее при помощи представленного ниже кода, мы выбираем, какую базу данных использовать:
Убираем табуляцию
Результаты выводятся в виде неупорядоченного списка, но суть в том, что нам не нужна табуляция. Чтобы избавиться от нее, добавьте следующее CSS-правило в самое начало вашего файла в head :
Поиск по буквам
Для реализации поиска по буквам потребуется лишь несколько дополнительных строк кода. Добавим этот удобный функционал для посетителей. Таким образом, они смогут находить представителей персонала по буквам, которые содержатся в имени или фамилии.
Добавьте следующую строку кода после закрывающего тега form :
Здесь мы изменили четыре фрагмента кода скрипта поиска по сайту:
Сохраните файл search_byletter.php и проверьте результат.
Поиск определенного сотрудника
Здесь мы изменили четыре фрагмента кода:
Сохраните файл search_byid.php и проверьте результат.
SQL-инъекция
Как уже было отмечено, регулярное выражение гарантирует, что в качестве первого символа посетитель может вводить лишь буквы в нижнем или верхнем регистре.
В завершение
В сегодняшней статье мы рассмотрели, как сделать поиск по сайту, а также:
Используя знания, полученные из этой статьи, вы сможете без труда модифицировать чужой код, а также при необходимости расширять функционал формы поиска.
Вы можете предложить своим потенциальным клиентам дополнительное преимущество. Разместите у себя специальный код, чтобы пользователь мог выполнять поиск по вашему сайту или приложению прямо на странице результатов. При этом ему будут доступны подсказки в реальном времени и другие функции окна поиска.
Как реализовать окно поиска по сайту
Как добиться того, чтобы при показе вашего контента в результатах поиска Google показывалось окно поиска:
Введя поисковый запрос в дополнительном окне, пользователь будет переадресован на сайт или в приложение и увидит страницу с результатами. Чтобы эта функция работала, вам понадобится настроить поисковую систему.
Пример
Ниже приведен пример для запроса «Pinterest» в Google. Среди полученных результатов пользователь увидел окно поиска сразу под ссылкой на нужный сайт.
Далее приведены примеры разметки для окна поиска по сайту, на котором установлена пользовательская система поиска.
Нажмите кнопку ниже, чтобы увидеть пример кода в формате JSON-LD.
Нажмите кнопку ниже, чтобы увидеть пример кода в формате микроданных.
Нажмите кнопку ниже, чтобы увидеть пример кода JSON-LD для сайта и приложения.
Рекомендации
Чтобы материалы вашего сайта могли появляться в расширенных результатах, вам необходимо следовать перечисленным ниже рекомендациям.
Как запретить Google добавлять окно поиска
Алгоритм Google Поиска может добавить окно поиска под ссылкой на ваш сайт, даже если вы не предпринимали действий, описанных в статье. Вы можете избежать этого, указав на главной странице следующий метатег:
Типы структурированных данных
Чтобы ваш контент мог демонстрироваться в расширенных результатах, необходимо задать все обязательные свойства.
Измененный тип WebSite
Google Поиск использует измененный тип структурированных данных WebSite для окон поиска сайтов и приложений. Подробное описание структурированных данных типа WebSite приведено на сайте schema.org, однако в случае с Google Поиском оно немного отличается от стандартного. Более подробные сведения представлены ниже.
Обязательные свойства
potentialAction
Массив из одного или двух объектов SearchAction.
Объект описывает URI, к которому нужно направить запрос, и синтаксис этого запроса. Вы должны добавить страницу или обработчик намерений, который может получить запрос и выполнить корректный поиск по отправленной строке. Если пользователь не работает с приложением Android (или намерение для Android отсутствует), версия запроса для сайта будет отправлена из поискового окна по указанному маршруту. Если пользователь работает с устройством Android, а URI намерения известен, будет отправлено это намерение.
Пример для сайта
Пример для приложения
В качестве свойства urlTemplate должна быть строка в следующем формате: search_handler_uri.
https://query.example.com/search?q=
search_handler_uri
На сайтах применяется URL обработчика, который должен получать и обрабатывать поисковый запрос. В приложениях – URI обработчика намерения для вашей поисковой системы, который должен обрабатывать запрос.
search_term_string
Указывает на URL сайта, который является целью поиска. Ведет на каноническую главную страницу сайта. Пример: https://www.example.org
Сбор статистики по расширенным результатам в Search Console
С помощью Search Console вы можете собирать данные об эффективности страниц вашего ресурса в Google Поиске. Вам не обязательно регистрироваться в этом сервисе, чтобы ваши страницы попали в результаты поиска. Однако это позволит узнать, как роботы Google воспринимают сайт, и оптимизировать его. Рекомендуем проверять информацию в Search Console в следующих случаях:
После первого размещения структурированных данных
Когда ваши страницы будут проиндексированы, проверьте их на наличие ошибок с помощью отчета о статусе расширенных результатов. В идеальном случае количество правильных страниц должно вырасти, а число ошибок и предупреждений – нет. Если в структурированных данных будут обнаружены ошибки, примите следующие меры:
После выпуска новых шаблонов или обновления кода
При регулярном анализе трафика
Устранение неполадок
Если у вас возникли трудности с добавлением или отладкой структурированных данных, вам помогут ресурсы и сведения, доступные по приведенным ниже ссылкам.
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Наверное, многие когда-нибудь задумывались, как сделать поиск на сайте? Безусловно, для крупных сайтов с большим количеством контента поиск является просто незаменимой вещью. В большинстве случаев пользователь, впервые посетив Ваш сайт в поисках чего-либо важного, не станет разбираться в навигационных панелях, выпадающих меню и прочих элементах навигации, а в спешке попытается найти что-нибудь похожее на поисковую строку. И если такой роскоши на сайте не окажется, либо он не справится с поисковым запросом, то посетитель просто закроет вкладку. Но статья не о значении поиска для сайта и не о психологии посетителей. Я расскажу, как реализовать небольшой алгоритм полнотекстового поиска, который, надеюсь, избавит начинающих разработчиков от головной боли.
У читателя может возникнуть вопрос: зачем писать все с нуля, если все уже давно написано? Да, у крупных поисковиков есть API, есть такие клевые проекты, как Sphinx и Apache Solr. Но у каждого из этих решений есть свои преимущества и недостатки. Пользуясь услугами поисковиков, типа Google и Яндекс, Вы получите множество плюшек, таких как мощный морфологический анализ, исправление опечаток и ошибок в запросе, распознавание неверной раскладки клавиатуры, однако без ложки дегтя тут не обойдется. Во первых, такой поиск не интегрируется в структуру сайта — он внешний, и Вы не сможете указать ему, какие данные наиболее важны, а какие не очень. Во вторых, содержимое сайта индексируется только с определенным интервалом, который зависит от выбранного поисковика, так что если на сайте что-нибудь обновится, придется дожидаться момента, когда эти изменения попадут в индекс и станут доступными в поиске. У Sphinx и Apache Solr дела с интеграцией и индексированием гораздо лучше, но не каждый хостинг позволит из запустить.
Ничто не мешает написать поисковый механизм самостоятельно. Предполагается, что сайт работает на PHP в связке с каким-нибудь сервером баз данных, например MySQL. Давайте сначала определимся, что требуется от поиска на сайте?
В конце статьи будет показан пример реализации поиска на примере простого интернет-магазина. Тем, кому лень все это изучать и просто нужен готовый поисковик, можно смело забирать движок из репозитория GitHub FireWind.
Принцип работы
Подготовка
Задача поставлена, теперь можно перейти к делу. Я использую Linux в качестве рабочей ОС, однако постараюсь не использовать ее экзотических возможностей, чтобы любители Windows смогли «собрать» поисковый движок по аналогии. Все, что Вам нужно — это знание основ PHP и умение обращаться с MySQL. Поехали!
Наш проект будет состоять из ядра, где будут собраны все жизненно необходимые функции, а также модуля морфологического анализа и обработки текста. Для начала создадим корневую папку проекта firewind, а в ней создадим файл core.php — он и будет ядром.
Теперь вооружаемся своим любимым текстовым редактором и подготавливаем каркас:
Тут мы создали основной класс, который можно будет использовать на Ваших сайтах. На этом подготовительная часть заканчивается, пора двигаться дальше.
Морфологический анализатор
Русский язык — довольно сложная штука, которая радует своим разнообразием и шокирует иностранцев конструкциями, типа «да нет, наверное». Научить машину понимать его, да и любой другой язык, — довольно непростая задача. Наиболее успешны в этом плане поисковые компании, типа Google и Яндекс, которые постоянно улучшают свои алгоритмы и держат их в секрете. Придется нам сделать что-то свое, попроще. К счастью, колесо изобретать не придется — все уже сделано за нас. Встречайте, phpMorphy — морфологический анализатор, поддерживающий русский, английский и немецкий языки. Более подробную информацию можно получить тут, однако нас интересуют только две его возможности: лемматизация, то есть получение базовой формы слова, и получение грамматической информации о слове (род, число, падеж, часть речи и т.д.).
Нужна библиотека и словарь для нее. Все это добро можно найти тут. Библиотека находится в одноименной папке «phpmorphy», словари расположены в «phpmorphy-dictionaries». Скачиваем последние версии в корневую папку проекта и распаковываем:
Отлично! Библиотека готова к использованию. Пришло время написать «оболочку», которая абстрагирует работу с phpMorphy. Для этого создадим еще один файл morphyus.php в корневой директории:
Пока реализовано только два метода. get_words разбивает текст на массив слов, фильтруя при этом HTML-теги и сущности типа » «. Метод lemmatize возвращает массив лемм слова, либо false, если таковых не нашлось.
Механизм ранжирования на уровне морфологии
Давайте остановимся на такой единице языка, как предложение. Наиболее важной частью предложения является основа в виде подлежащего и/или сказуемого. Чаще всего подлежащее выражается существительным, а сказуемое глаголом. Второстепенные члены в основном употребляются для уточнения смысла основы. В разных предложениях одни и те же части речи порой имеют совершенно разное значение, и наиболее точно оценить это значение в контексте текста сегодня может только человек. Однако программно оценить значение какого-либо слова все-таки можно, хоть и не так точно. При этом алгоритм ранжирования должен опираться на так называемый профиль текста, который определяется его автором. Профиль представляет из себя ассоциативный массив, ключами которого являются части речи, а значениями соответственно ранг (или вес) каждой из них. Пример профиля я покажу в заключении, а пока попробуем перевести эти размышления на язык PHP, добавив еще один метод к классу morphyus:
Индексирование содержимого сайта
Как уже говорилось выше, индексирование заметно ускоряет выполнение поискового запроса, так как поисковому движку не нужно обрабатывать контент каждый раз заново — поиск выполняется по индексу. Но что же все-таки происходит при индексировании? Если по порядку, то:
В результате получается объект следующего формата:
Пишем инициализатор и первый метод ядра поискового движка:
Теперь при добавлении или изменении данных в таблицах достаточно просто вызвать данную функцию, чтобы проиндексировать их, но это не обязательно: индексирование может быть и отложенным. Первым аргументом метода make_index является исходный текст, вторым — коэффициент значимости индексируемых данных. Ранг каждого слова, кстати, расчитывается по формуле:
Хранение индексированных данных
Очевидно, что индекс нужно где-нибудь хранить, да еще и привязать к исходным данным. Наиболее подходящим местом для них будет база данных. Если индексируется содержимое файлов, то можно создать отдельную таблицу в базе данных, которая будет содержать индекс название каждого файла, а для содержимого, которое уже хранится в базе, можно добавить еще одно поле типа в структуру таблиц. Такой подход позволит разделять типы содержимого при поиске, например, названия и описание статей в случае блога.
Нерешенным остался лишь вопрос формата индексированного содержимого, ведь make_index возвращает объект, и так просто в базу данных или файл его не запишешь. Можно использовать JSON и хранить его в полях типа LONGTEXT, можно BSON или CBOR, используя тип данных LONGBLOB. Два последних формата позволяют представлять данные в более компактном виде, чем первый.
Как говорится, «хозяин — барин», так-что решать, где и как все будет храниться, Вам.
Benchmark
Давайте проверим, что у нас получилось. Я взял текст своей любимой статьи «Темная материя интернета», а именно содержимое узла #content html_format и сохранил его в отдельный файл.
Остался последний и самый главный метод, метод поиска. В качестве первого аргумента метод принимает индекс поискового запроса, в качестве второго — индекс содержимого, в котором выполняется поиск. В результате выполнения возвращается суммарный ранг, рассчитанный на основе ранга найденных слов, либо 0, если ничего не нашлось. Это позволит сортировать поисковую выдачу.
Все! Поисковый движок готов к использованию. Но есть одно но… На самом деле это не джин-волшебник, и просто закинув его на свой сайт Вы не получите ничего. Его нужно интегрировать, причем этот процесс во многом зависит от архитектуры Вашего сайта. Рассмотрим этот процесс на примере небольшого интернет магазина.
Реализация поиска на примере интернет-магазина
Допустим, информация о продаваемой продукции хранится в таблице production:
А описание в таблице description:
Поле production.keywords будет содержать индекс ключевых слов продукта, description.index будет содержать индексированное описание. И все это будут храниться в формате JSON.
Вот пример функции добавления нового продукта:
Здесь поисковый механизм был интегрирован в функцию добавления нового продукта магазина. А теперь обработчик поисковых запросов:
Данный сценарий принимает поисковый запрос в виде GET-параметра query и выполняет поиск. В результате выводятся найденные продукты магазина.
Заключение
В статье был описан один из вариантов реализации поиска для сайта. Это самая первая его версия, поэтому буду только рад узнать Ваши замечания, мнения и пожелания. Присоединяйтесь к моему проекту на Github: https://github.com/axilirator/firewind. В планах добавить туда еще кучу всяких возможностей, вроде кэширования поисковых запросов, подсказок при вводе поискового запроса и алгоритма побуквенного сравнения, который поможет бороться с опечатками.
Всем спасибо за внимание, ну и с днем информационной безопасности!
Сегодня мы напишем собственный поиск по сайту с использованием PHP и MySQL. Первым делом рассмотрим краткий алгоритм.
Пользователь выполняет POST запрос из формы поиска, этот запрос передается специальному скрипту-обработчику, который должен обработать поисковый запрос пользователя и возвратить результат.
Сначала скрипт должен обработать должным образом запрос пользователя для обеспечения безопасности, затем выполняется запрос к базе данных, который возвращает в ассоциативном массиве результаты, которые должны будут выводиться на экран. Итак, приступим.
Для начала создадим форму поиска на нужной нам странице:
Эта форма и будет отправлять сам поисковый запрос скрипту search.php. Теперь создадим сам скрипт-обработчик.
Естественно, данные таблиц БД нужно задать собственные. Рассмотрим, что делает эта функция. Первые 4 строчки обрабатывают запрос, чтобы он стал безопасным для базы. Такую обработку нужно делать обязательно, т. к. любая форма на Вашем сайте — это потенциальная уязвимость для злоумышленников.
Затем идет проверка, не пустой ли запрос. Если запрос пустой, то возвращаем соответствующее сообщение пользователю. Если запрос не пустой, проверяем его на размер.
Если поисковый запрос имеет длину менее 3 или более 128 символов, также выводим соответствующие сообщения пользователю. Иначе, выполняем запрос к базе данных, который делает выборку идентификатора страницы, ее заголовка, описания, описания ссылки, категорию, если она есть и идентификатор самой статьи, в которой найдены совпадения нужных нам полей с поисковым запросом.
В данном случае мы делаем сравнение с текстом статьи, ее заголовком, ключевыми словами и описанием. Если ничего не найдено, выводим пользователю сообщение об этом. Если запрос возвратил хотя бы одну запись, выполняем в цикле еще один запрос, который делает выборку из таблицы со страницами ссылку на страницу, на которой находится статья.
Если у Вас все статьи на одной странице, вы можете опустить этот шаг. После выполнения запроса при каждой итерации цикла в переменную $text Дозаписываем одну найденную статью.
Теперь осталось на этой же странице search.php сделать вызов этой функции и вывести ее результат пользователю.
Также вы можете упростить скрипт поиска по Вашему усмотрению. Желательно создать стиль в таблице css для выводимой информации, чтобы выводимая информация смотрелась более красиво и читабельно. Все замечания вопросы по скрипту можете задавать в комментариях.
Узнайте, как создать меню поиска для фильтрации ссылок с помощью JavaScript.
Поиск/Фильтр меню
Как искать ссылки в меню навигации:
Содержание страницы
Начните вводить определенную категорию/ссылку в строке поиска, чтобы «отфильтровать» параметры поиска.
Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..
Some other text..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..Какой-то текст..
Создать меню поиска
Шаг 1) Добавить HTML:
Пример
Примечание: Мы используем href=»#» в этой демонстрации, поскольку у нас нет страницы, на которую можно было бы сделать ссылку. В реальной жизни это должен быть реальный URL-адрес конкретной страницы.
/* Стиль навигационных ссылок */ #myMenu li a < padding: 12px; text-decoration: none; color: black; display: block >
#myMenu li a:hover < background-color: #eee; >
Шаг 3) Добавить JavaScript:
Пример
Совет: Удалите toUpperCase() если вы хотите выполнять поиск с учетом регистра.
ПАЛИТРА ЦВЕТОВ
ПРИСОЕДИНЯЙТЕСЬ!
Получите ваш Сертификат сегодня!
Связь с админом
Если вы хотите сообщить об ошибке, а также внести предложение о работе сайта, добавить объявление или рекламу на сайт, не стесняйтесь отправить админу электронное письмо на email:
Топ Учебники
Топ Справочники
Топ Примеры
Веб Сертификаты
Этот сайт оптимизирован для обучения и тестирования. Примеры могут быть упрощены для улучшения чтения и базового понимания. Учебные пособия, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность и работоспособность всего контента. Используя этот сайт, вы соглашаетесь с тем, что прочитали и приняли условия использования, cookie и политику конфиденциальности. Также вы можете абсолютно бесплатно скачать офлайн версию сайта W3Schools на русском архивом с GitHub и пользоваться локально на своём компьютере. Также доступна версия сайта W3Schools на украинском языке. Copyright 1999-2022 by Refsnes Data. All Rights Reserved. Сайт работает на фреймворке W3.CSS.
