Как установить свои страницы ошибок

Файл htaccess

От автора: в этом уроке мы с вами познакомимся еще с двумя полезными директивами сервера, которые можно использовать в файле htaccess.

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

скачать исходникискачать урок

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

Профессия PHP-разработчик с нуля до PRO

Готовим PHP-разработчиков с нуля

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

Узнать подробнее

Командная стажировка под руководством тимлида

90 000 рублей средняя зарплата PHP-разработчика

3 проекта в портфолио для старта карьеры

Другое дело файлы php. Здесь правильно настроенный сервер ни за что не отдаст просто так такой файл. Прежде всего, сервер отдает этот файл интерпретатору PHP, который, в свою очередь, обрабатывает файл, выполняя программный код в файле. Затем интерпретатор возвращает уже обработанный документ серверу, который отдает его уже клиенту.

Как же нам «заставить» сервер отдавать, к примеру, файлы html интерпретатору для исполнения программного кода? В этом нам как раз и поможет следующая директива:

# выполнение кода PHP в файлах не .php

AddType application/xhttpdphp .html .htm .txt .css

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

Вторая директива очень полезна и помогает отдавать так называемые собственные страницы ошибок.

Когда сервер в результате запроса клиента генерирует ошибку, то эту ошибку он показывает клиенту на специальной странице. Например, это может быть ошибка 404 (файл не найден), ошибка 403 (доступ запрещен), ошибка 500 (внутренняя ошибка сервера) и много других.

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

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

Указать серверу на собственные страницы ошибок можно с помощью директивы ErrorDocument, после которой мы укажем код ошибки и путь к странице ошибки, которую нужно показать в случае данной ошибки:

# страницы ошибок

#ErrorDocument 403 «Access Denied»

ErrorDocument 403 /htaccess/page403.html

ErrorDocument 404 //localhost/htaccess/page404.html

Здесь, как Вы могли заметить, мы можем использовать как относительный, так и абсолютный путь. Также, как вариант, можно вместо страницы показать какой-нибудь текст (хотя в этом мало смысла).

Профессия PHP-разработчик с нуля до PRO

Готовим PHP-разработчиков с нуля

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

Узнать подробнее

Командная стажировка под руководством тимлида

90 000 рублей средняя зарплата PHP-разработчика

3 проекта в портфолио для старта карьеры

На этом текущий урок завершен. Удачи и до встречи в следующем!

Как установить страницу 404

Страница 404 — это страница, которая открывается при ошибке 404. Ошибка 404 — это попытка открыть несуществующую страницу. То есть, когда Вы вводите неправильный адрес (или переходите по неработающей ссылке), то Вы как раз переходите на эту страницу. Безусловно, у самого браузера есть встроенная страница. Но, думаю, что Вам бы хотелось оформить эту страницу как-то по-другому, возможно, написать какой-нибудь свой текст и так далее. О том, как установить страницу 404 на свой сайт, я и расскажу.

Первое, что необходимо сделать — это создать файл .htaccess. Обратите внимание, что имени у этого файла нет, а расширение «htaccess«. Если Вы работаете в Unix, то проблем с созданием не возникнет. А вот если Вы работаете в Windows, то создать файл .htaccess можно таким образом (так делаю я, хотя, возможно, есть более простые способы):

  1. Открыть блокнот.
  2. Выбрать пункт меню «Сохранить как«.
  3. Введите имя файла «.htaccess«.
  4. Выберите тип файла «Все файлы«.
  5. Сохраните.

В результате, у Вас появится файл .htaccess. Скопируйте его в корень своего сайта. Теперь Вы можете его открыть (например, в том же блокноте) и написать там такую строку:

ErrorDocument 404 /404.html

Теперь создайте в корне сайта страницу «404.html», в которой пишите любой HTML-код, например, такой:

<html>
<head>
</head>
<body>
  <h1>Страница не существует!</h1>
  <p>Проверьте правильность ввода адреса</p>
  <p>С Уважением, <a href = ''>Мой сайт</a></p>
</body>
</html>

Таким образом, люди будут видеть не стандартную страницу в браузере, а ту страницу, которую создали Вы.

Напоследок, хочется сказать одну важную вещь. Если Вы работаете на локальном компьютере, то на нём должен быть установлен сервер (например, пакет Denwer, в который входит и сервер Apache, и PHP, и MySQL и много чего ещё).

  • Создано 09.12.2010 16:52:51


  • Михаил Русаков

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Браузер показывает пользователю страницу ошибки, если при обработке запроса возникла какая-то неполадка. Ошибка может возникнуть на стороне пользователя — 4хх (например ошибки 400, 401, 403, 404) или на стороне сервера- 5хх (например ошибки 500, 502, 503, 504). Если страница ошибки для сайта не настроена, то пользователь увидит стандартную страницу ошибки.

Обычно обработку ошибок на сайте осуществляет CMS. Если по каким-то причинам Ваша CMS не обрабатывает ошибки или же сайт является самописным, Вы можете обработать ошибки самостоятельно в панели ISPmanager.

Как настроить страницу ошибки?

Для того, чтобы настроить страницу ошибки на Вашем сайте, если Вы пользуетесь услугой хостинга, Вам требуется зайти в панель ISPmanager.
В панели управления перейти в раздел «WWW» — «WWWдомены», выбрать нужный домен и нажать на кнопку «Ошибки».

Как открыть ошибки в панели управления

На странице ошибок нажимаем на кнопку «Создать».

 

Создать страницу ошибок

В открывшемся окне указываем код ошибки и URL. Жмем на кнопку «ОК».

 

Завершение настройки страницы ошибки

Готово. Страница ошибки для сайта успешно настроена.

На скриншоте показан код ошибки и URL, который будет отдаваться при возникновении ошибки.

Ошибка и URL, который будет отдаваться при возникновении ошибки 404

Вот пример настроенной страницы ошибки на сайте.

Пример настроенной страницы ошибки 404

Посетители сайта видят 404 ошибку, если страница, на которую они пытаются перейти, не существует или по какой-то причине сервер не может её найти. В статье рассмотрим, что это за ошибка и какое влияние она оказывает на поведенческие факторы пользователей и SEO. А также разберем, как настроить редирект 404 ошибки через .htaccess.

Что такое ошибка 404

Ошибка 404 (File not found) возникает, когда сервер не может найти запрашиваемую пользователем страницу. От ее появления не застрахован ни один сайт. Достаточно ввести в адресной строке после домена рандомный набор символов. Например:

http://site.ru/asdfjkl;

Сервер не сможет найти страницу, и отобразится ошибка:



редирект 404 1
Ошибка 404 на сайте reg.ru

Также с ошибкой 404 можно столкнуться в следующих случаях:

  • Администратор сайта удалил или переместил страницу, но не сделал редирект на актуальный материал.
  • Изменилась структура сайта, а у страниц остались старые URL.
  • Посетитель опечатался в адресе, когда вводил его вручную.
  • Посетитель перешел по «битой» ссылке, которая ведет на несуществующую (удаленную или перемещенную) страницу.

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

Код 404 не стоит путать с другими похожими ошибками. Например, 403-й, которая означает, что доступ к ресурсу ограничен или запрещен. Подробнее о том, как ее исправить в статье.

Иногда при загрузке несуществующей страницы браузер получает ответ 200 вместо 404. Такой случай называют Ложной ошибкой (Soft 404). Он означает, что со страницей всё в порядке, хотя пользователь видит ошибку. Также проблема заключается в том, что Яндекс и Google показывают эту страницу в результатах поиска. Чтобы проверить код ошибки, воспользуйтесь проверкой URL от Google.

Наличие ложных ошибок негативно сказывается на SEO-продвижении и затрудняет видимость основного контента сайта. Чтобы это исправить, нужно вручную настроить редирект на страницу с ошибкой 404 для всех несуществующих страниц.

Возможные последствия для сайта

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

Также важно следить за тем, чтобы на сайте было как можно меньше несуществующих страниц, битых ссылок и т. п. Чтобы отыскать их, можно воспользоваться веб-инструментами Яндекс и Google или другими сервисами. Найдите все, что нужно поправить, настройте 301-й редирект на актуальные материалы и замените некорректные ссылки.

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

Рекомендации по созданию страницы 404

Если сайт создавался в CMS WordPress, Joomla, Drupal и т. п., в нем, скорее всего, предусмотрена страница ошибки 404. Но она может быть неинформативной или отличаться от дизайна остальных страниц вашего веб-ресурса.

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

Важно, чтобы страница была информативной и полезной:

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

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

Примеры страниц с ошибкой 404



редирект 404 2
СберМаркет предлагает познать мудрость котов и цены на сайте



редирект 404 3
404 ошибка в разделе «Помощь» на сайте REG.RU

Как создать страницу ошибки 404 и настроить редирект на нее в .htaccess

  1. 1.

    Создайте страницу одним из следующих способов:

    • Если вы знаете HTML и CSS, напишите код страницы самостоятельно и загрузите файл с названием 404.html в корневую папку сайта.

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

    • Если вы используете WordPress, воспользуйтесь плагином 404page — your smart custom 404 error page по инструкции ниже. Обратите внимание! Если вы воспользовались плагином, вам не нужно прописывать путь к файлу в .htaccess.


    Как настроить страницу в плагине WordPress

    1) Откройте админку вашего сайта в WordPress.

    2) Перейдите в раздел «Плагины» и нажмите Добавить новый.

    3) В строке поиска введите название 404page — your smart custom 404 error page.

    4) Нажмите УстановитьАктивировать:



    редирект 404 4

    5) Перейдите в раздел Внешний вид404 Error Page.

    6) Выберите в списке Sample Page, чтобы сменить стандартную страницу ошибки, и нажмите Edit Page:



    редирект 404 5

    7) Создайте страницу в открывшемся визуальном редакторе и нажмите Обновить:



    редирект 404 6

    Готово! После обновления страница будет использоваться автоматически.

  2. 2.

    Откройте конфигурационный файл .htaccess в корневой папке вашего сайта и добавьте в него строку:

    ErrorDocument 404 https://site.ru/404.html

    Где вместо site.ru — домен вашего сайта.

  3. 3.

    Сохраните изменения.

Готово! Теперь при возникновении 404 ошибки, в браузере пользователей будет открываться созданная вами кастомная страница.

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

Редирект с 404 на главную (не рекомендуется)

Чтобы не создавать отдельную страницу ошибки 404, некоторые веб-разработчики прописывают в .htaccess редирект на главную страницу сайта. Это нежелательно делать с точки зрения SEO-оптимизации.

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

Рекомендуется использовать специальные страницы для ошибки 404.

Проверка редиректа 404

Проверить, корректно ли все настроено можно в Яндекс.Вебмастер и Google Search Console.

Яндекс.Вебмастер

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

  1. 1.

  2. 2.

    Перейдите в раздел ИнструментыПроверка ответа сервера.

  3. 3.

    Введите название страницы ошибки и нажмите Проверить.

  4. 4.

    В коде статуса HTTP должно отображаться 404 Not Found:



    редирект 404 7

Google Search Console

Если вы используете этот инструмент впервые, укажите свой домен и пройдите валидацию, добавив TXT-запись/загрузив файл в корневую папку сайта или с помощью других способов.

  1. 1.

  2. 2.

    Перейдите в раздел «Покрытие» в меню справа. Здесь будет отображаться информация о страницах ошибок.

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

Если сайт многораздельный и многостраничный, вручную мониторить его будет сложно. Рекомендуется использовать для поиска страниц ошибки 404 онлайн-сервисы (Serpstat, BadLincs.ru и другие). Также можно воспользоваться плагинами в CMS. Замените ссылки и настройте редиректы. А также создайте понятную красочную страницу ошибки с объяснением причины, ссылками на основные разделы и строкой поиска.

7 июня, 2022 12:03 пп
938 views
| Комментариев нет

LEMP Stack, Ubuntu

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

Требования

  • Виртуальный сервер с пользователем sudo (мы используем сервер Ubuntu 22.04, настроенный по этому мануалу).
  • Предварительно установленный веб-сервер Nginx (инструкции по установке вы найдете здесь).

Создание пользовательской страницы об ошибке

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

Поместите пользовательские страницы ошибок в каталог /usr/share/nginx/html, корневой каталог Nginx по умолчанию. Там мы создадим страницу для ошибки 404 под названием custom_404.html и для общих ошибок уровня 500 под названием custom_50x.html.

Примечание: Дальнейшие строки можно использовать, если вы тренируетесь на наших страницах. В противном случае не забудьте указать свои данные.

Сначала создайте HTML-файл для своей пользовательской страницы 404 с помощью nano или другого текстового редактора:

sudo nano /usr/share/nginx/html/custom_404.html

Вставьте туда код, который определяет пользовательскую страницу:

<h1 style='color:red'>Error 404: Not found :-(</h1>
<p>I have no idea where that file is, sorry. Are you sure you typed in the correct URL?</p>

Сохраните и закройте файл.

Теперь создайте файл HTML для страницы 500:

sudo nano /usr/share/nginx/html/custom_50x.html

Вставьте в файл следующее:

<h1>Oops! Something went wrong...</h1>
<p>We seem to be having some technical difficulties. Hang tight.</p>

Сохраните и закройте файл.

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

Настройка Nginx для поддержки пользовательских страниц

Итак, пора сообщить Nginx, что он должен использовать эти страницы всякий раз, когда возникают соответствующие ошибки. Откройте тот файл server-блока в каталоге /etc/nginx/sites-enabled, который вы хотите настроить. Здесь мы используем стандартный файл по имени default. Если вы настраиваете свои собственные страницы, пожалуйста, убедитесь, что используете правильный файл:

sudo nano /etc/nginx/sites-enabled/default

Теперь нужно направить Nginx на соответствующие страницы.

Настройка пользовательской страницы 404

Используйте директиву error_page, чтобы при возникновении ошибки 404 (когда запрошенный файл не найден) обслуживалась созданная вами пользовательская страница. Создайте location-блок для вашего файла, где вы сможете установить его правильное расположение в файловой системе и указать, что файл доступен только через внутренние перенаправления Nginx (не запрашиваемые клиентами напрямую):

server {
    listen 80 default_server;



    . . .

    error_page 404 /custom_404.html;
    location = /custom_404.html {
        root /usr/share/nginx/html;
        internal;
    }
}

Обычно устанавливать root в новом блоке location не нужно, так как он совпадает с root в блоке server. Однако здесь мы явно указываем, что страницы ошибок нужно обслуживать, даже если вы перемещаете свой обычный веб-контент и связанный с ним root в другое место.

Настройка страницы ошибок 50х

Затем добавьте новые директивы, чтобы Nginx, столкнувшись с ошибками уровня 500 (это проблемы, связанные с сервером), мог обслуживать другую пользовательскую страницу, которую вы создали. Здесь мы будем следовать той же формуле, которую вы использовали в предыдущем разделе. На этот раз мы насторим несколько ошибок уровня 500, чтобы все они использовали страницу custom_50x.html.

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

Отредактируйте файл /etc/nginx/sites-enabled/default следующим образом:

server {
    listen 80 default_server;


    . . .

    error_page 404 /custom_404.html;
    location = /custom_404.html {
        root /usr/share/nginx/html;
        internal;
    }

    error_page 500 502 503 504 /custom_50x.html;
    location = /custom_50x.html {
        root /usr/share/nginx/html;
        internal;
    }

    location /testing {
        fastcgi_pass unix:/does/not/exist;
    }
}

Сохраните и закройте файл, когда закончите.

Перезапуск Nginx и тестирование

Чтобы проверить синтаксис ваших файлов, введите:

sudo nginx -t

Если команда обнаружила какие-либо ошибки, исправьте их, прежде чем продолжить. Перезапустите Nginx, если ошибок нет:

sudo systemctl restart nginx

Теперь, если вы перейдете на домен или IP-адрес вашего сервера и запросите несуществующий файл, вы должны увидеть настроенную вами страницу 404:

http://server_domain_or_IP/thiswillerror

Перейдите в расположение вашего FastCGI и вы получите ошибку 502 Bad Gateway, что является ошибкой уровня 50х:

http://server_domain_or_IP/testing

Вернитесь в конфигурационный файл и удалите фиктивный FastCGI.

Заключение

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

Tags: NGINX, Ubuntu 22.04

Понравилась статья? Поделить с друзьями:
  • Как установить родство если в свидетельстве о рождении ошибка
  • Как установить на телефон исправление ошибок
  • Как установить на компьютере проверку ошибок
  • Как установить на клавиатуре исправление ошибок
  • Как установить мод и исправить ошибку