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

Вообще говоря, речь пойдёт сейчас об объекте Location , который является свойством объекта Document . У объекта Location есть свойство href , с помощью которого и реализуется редирект на JavaScript . Данное свойство доступно и для чтения, и для записи. Для начала давайте его прочитаем:

Document.write(document.location.href);

В результате Вы увидите полный адрес к Вашему скрипту.

Теперь сделаем простейший редирект на JavaScript :

Document.location.href = "http://сайт";

Таким образом, все пользователи, которые запустят этот скрипт будут автоматически переходить на сайт: "http://сайт ".

Теперь давайте сделаем классическую задачу, которые реализуют очень часто. Допустим, у Вас был сайт: http://a.ru . Затем Вы купили новый домен для Вашего сайта и его адрес стал: http://b.ru . И хотите, чтобы все посетители переходили с http://a.ru на новый http://b.ru . Причём, Вы хотите, чтобы они знали, что у Вашего сайта новый адрес. Знакома ситуация? Так вот, реализуется это с помощью редиректа с задержкой:

var delay = 5000;
setTimeout("document.location.href="http://b.ru"", delay);

У нашего сайта новый адрес: http://b.ru. Через 5 секунд Вы будете перенаправлены на него. Если этого не происходит, то перейдите самостоятельно: http://b.ru

Сначала пользователь увидит сообщение, а через 5 секунд он уже перейдёт по новому адресу. Если вдруг у пользователя отключён JavaScript , то тогда он может перейти самостоятельно, просто щёлкнув по ссылке.

30.09.16 6K

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

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

Редиректы выполняются с помощью .htaccess , PHP скрипт , HTML мета-тегов и JavaScript .

Перенаправление доменов сайта

Редиректы используются для информирования серверов о том, что контент сайта был перенесен с одного URL-адреса на другой. Делать это необходимо, когда исходный веб-адрес (цель входящей ссылки ) занимает высокие позиции в выдаче поисковых систем (SERP ). В этом случае редирект сообщает поисковому роботу, что нужный контент был перенесен, предоставляя пользователю ссылку на новый адрес.

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

Кроме этого перенаправление позволяет одинаковому контенту быть доступным по различным веб-адресам. Все альтернативные адреса перенаправляются в сторону приоритетного домена сайта:

Типы редиректов

Различают клиентские и серверные HTML meta redirect . В случае с серверными перенаправлениями происходит передача кодов состояния HTTP пользовательским агентам (браузерам и поисковым роботам ).

Когда дело доходит до перенаправлений на стороне клиента, все выглядит по-другому: они выполняются без какого-либо ответа, и никакие коды состояний не передаются. Именно поэтому не все системы поддерживают редирект. Это может привести к ситуациям, когда посетители остаются на оригинальном сайте и не перенаправляются на новую страницу.

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

Серверные редиректы

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

Ниже приведены актуальные коды состояния HTTP 301 и 302 :

• redirect 301 HTML – перемещен навсегда: запрашиваемый ресурс теперь постоянно доступен по новому URL . Старый URL с этого момента становится недействительным;
• 302 – перемещен временно: запрашиваемый ресурс доступен по новому URL . При этом исходный URL по-прежнему сохраняет свою актуальность.

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

Перенаправление через.htaccess

Htaccess представляет собой конфигурационный файл на сервере Apache , используемый для перезаписи центральной конфигурации на уровне каталогов. Этот файл позволяет администраторам сайта выполнять специфичные настройки каталога для доменов и их подкаталогов. Одна из функций файла .htaccess включает в себя серверные перенаправления отдельных адресов на другие URL .

После того, как файл .htaccess со следующим кодом помещается в основные каталоги, запросы на исходный домен перенаправляются серверной стороной на домен www.example.com ‘ ‘:

Htaccess перенаправление на новый домен redirect 301 / http://www.example.com/

Строка кода начинается с redirect 301 HTML и определяет код состояния HTTP , который будет передан сервером. Далее следует путь к контенту, который должен быть перенаправлен. В данном случае будет перенаправлено все содержимое. В заключении целевой URL перенаправляется на URL пользовательского агента: ‘http://www.example.com’ .

Этот метод позволяет перенаправить отдельные файлы. Следующий код показывает редирект с одного сайта на другой:

.htaccess перенаправление из подкаталога на другой URL

Вот как выглядит постоянное перенаправление на сервере Apache с активным модулем mod_rewrite :

RewriteEngine On RewriteRule ^directory/example-document.html$ http://www.example.com/example.html

В первой строке кода модуль mod_rewrite сервера Apache активируется с помощью команды ‘RewriteEngine On’ . После этого указывается «RewriteRule » с путем к файлу перенаправления и адресом назначения. Символы ^ и $ обозначают начало и конец пути, а L означает последнее правило для соответствующего запроса. R = 301 пересылает статус HTTP 301 .

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

Перенаправления с помощью PHP

HTML redirect на другую страницу может также быть выполнен PHP скриптом (например, в index.php ). Следующий код отображает постоянное перенаправление к целевому URL ‘www.example.com’ :

При передаче через PHP скрипт код состояния HTTP определяется с помощью функции «header » во второй строке кода. В этом примере должен быть выполнен постоянный 301 редирект . Учитывая, что серверные перенаправления обычно выполняются на временной основе, то для постоянного редиректа нужно явно указать код состояния 301 . Адрес назначения перенаправления также прописан в ‘header ‘.

В примере перенаправление происходит на ‘http://www.example.com ‘. Функция ‘exit ‘ в четвертой строке кода заканчивает сценарий и препятствует выполнению следующей строки. Чтобы редиректы работали через PHP скрипт, блок кода должен быть расположен в начале HTML страницы. Это препятствует передаче сервером содержимого HTML на страницу перенаправления.

Клиентские редиректы

Если выполнение перенаправления на стороне сервера невозможно по техническим причинам, то можно использовать клиентское решение. Для этого применяется HTML метатег «refresh » и JavaScript . Недостатком перенаправления на стороне клиента является то, что серверы не передают коды состояния HTTP запрашивающим браузерам или поисковым роботам.

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

Redirect HTML index на стороне клиента оказывают негативное влияние на поисковый индекс. С клиентскими редиректами 301 не происходит явного исключения из индексации через код состояния HTTP . Это может привести к перенаправлению доменов, конкурирующих с доменами назначения, когда речь заходит о поисковых запросах, связанных с рейтингом. В отличие от серверных редиректов, которые остаются невидимыми для пользователей, клиентские всегда сопровождаются задержками.

Переадресация с помощью HTML метатега refresh

HTML перенаправления реализуются через метатеги с атрибутом ‘http-equiv ’. Для этого нужен простой HTML-файл и соответствующий тег в заголовке для создания перенаправления. Чтобы посетители получали информацию о редиректе, в HTML-документе должно быть установлено соответствующее уведомление: «Пожалуйста, подождите. Вы будете перенаправлены … ‘. Простое перенаправление с помощью refresh выглядит следующим образом.

13.08.16 4.8K

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

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

Методы переадресации JavaScript

В JavaScript window location или объект location используется, чтобы получить информацию о местоположении текущей веб-страницы (документа ), а также для его изменения. Ниже приведен список способов, которые могут быть использованы для реализации переадресации JavaScript :

//Устанавливает новое местоположение текущего окна. window.location = "http://www.example.com"; //Устанавливает новую гиперссылку (URL) для текущего окна. window.location.href = "http://www.example.com"; // Присваивает новый URL текущему окну. window.location.assign("http://www.example.com"); //Заменяет положение текущего окна на новое. window.location.replace("http://www.example.com"); //Задает местоположение самого текущего окна. self.location = "http://www.example.com"; // Задает положение самого верхнего окна относительно текущего. top.location = "http://www.example.com";

Хотя приведенные выше строки JavaScript кода выполняют схожую работу, у них есть небольшие отличия. Например, если вы используете перенаправление top.location внутри элемента iframe , то это принудительно перенаправит на главное окно. Еще один момент, о котором стоит помнить: location.replace() заменяет текущий документ, удаляя его из истории и делая его недоступным с помощью кнопки «Назад » в браузере.

window.location.href = "http://www.example.com";

Также вы можете зайти на эту страницу, чтобы подробнее узнать, как работает window.location .

Переадресация JavaScript: перенаправление при загрузке

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

window.location.href = "http://www.example.com";

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

Переадресация JavaScript: перенаправление после определенного периода времени

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

setTimeout(function() { window.location.href = "http://www.example.com"; }, 3000);

Функция JavaScript location href , приведенная выше, перенаправит пользователя со страницы через 3 секунды после полной загрузки. Вы можете изменить значение 3000 (3 x 1000 в миллисекундах ) на свое усмотрение.

Переадресация JavaScript: перенаправление со страницы после события или действия пользователя

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

// Проверяем, верно ли условие, и затем перенаправляем. if (...) { window.location.href = "http://www.example.com"; }

Приведенный выше код JavaScript document location href выполнит перенаправление, если условие верно.

28.08.16 8.5K

В этой статье я расскажу, как можно перенаправить пользователя с одной веб-страницы на другую с помощью JavaScript . А также приведу несколько простых примеров JS редиректа .

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

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

Давайте рассмотрим, как можно использовать JavaScript для перенаправления пользователя на другую страницу.

Автоматическое JavaScript-перенаправление на другую страницу

Если нужно автоматически перенаправить пользователя с одной страницы (URL1 ) на другую страницу (URL2 ), можно использовать следующий код:

window.location.href = "URL2";

Необходимо вставить приведенный выше код на первую страницу (URL1 ). Замените URL2 на нужный адрес страницы. Лучше поместить этот код внутри элемента (а не в нижней части страницы ), чтобы страница перенаправлялась до того, как браузер начинает ее отображать.

СОВЕТ: Если вы используете встроенный JavaScript (т.е. без внешнего файла.js), не забудьте поместить код JavaScript в теги .

Перенаправление на другую страницу через X секунд

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

setTimeout(function(){ window.location.href = "homepage-url"; }, 5 * 1000);

Необходимо вставить приведенный код JavaScript на странице приветствия. Не забудьте заменить homepage-url на URL-адрес домашней страницы.

Мы использовали метод setTimeout , чтобы указать скрипту выполнить перенаправление через 5 секунд (умножаем 5 на 1000, чтобы преобразовать секунды в миллисекунды ).

СОВЕТ: В JavaScript значения времени всегда рассчитываются в миллисекундах.

Перенаправление на другую страницу, исходя из условия

Например, можно выполнить перенаправление в зависимости от браузера посетителя (хотя это не рекомендуется ), размера экрана, времени суток, или другого условия.

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

if (CONDITION) { window.location.href = "redirect-url"; }

Например, этот код перенаправляет посетителей на другую страницу, если ширина их экрана меньше 600 пикселов:

if (screen.width < 600) { window.location.href = "redirect-url"; }

Перенаправление на другую страницу на основе действий пользователя

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

Следующий код будет перенаправлять посетителя на целевую страницу после нажатия на #mybutton :

document.getElementById("mybutton").onclick = function() { window.location.href = "redirect-url"; };

Можно сделать то же самое, используя следующий код:

Go to Homepage

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

Редирект (от англ. redirect – переориентировать) – это переадресация страницы сайта на какую-то другую страницу или другой сайт. Редирект можно сделать различными способами, основные из которых и будут здесь рассмотрены., а именно redirect на php , javascript , редирект при помощи html и при помощи файла htaccess .

Среди перечисленных способов, наиболее актуальными являются php redirect и редирект при помощи.htaccess . Дело в том, что именно эти способы позволяют не только переадресовать страницу, но и вернуть специальную 301 ошибку (301 Permament Redirect). Для чего же это нужно? А нужно это для поисковых систем.

Допустим у нас был раскрученный сайт с большим числом посетителей. Затем сайт был перемещён на новый домен. Поисковая система его ещё не знает. 301 редирект позволяет как бы “склеить” старый и новый адрес, сохранив при этом все те элементы оптимизации, которые были сделаны для этого сайта, тем самым сохранив посещаемость и аудиторию самого сайта.

А теперь рассмотрим все перечисленные варианты редиректов, и начнём с редиректа на php.

PHP redirect (301)

Редирект на php, как и на других языках программирования, основан на спецификации протокола HTTP, а именно отправки необходимых заголовков. Как это работает? Довольно просто. Каждый раз, когда мы обращаемся к какой-то странице интернета, мы получаем HTTP ответ от сервера, который содержит заголовки (header) и тело (body). В теле ответа

Редирект HTML

В языке разметки HTML есть специальный мета-тег, предназначенный для переадресации.

Изменяется только поле content, где указывается количество секунд до переадресации и собственно ссылка, куда будет производиться редирект. Думаю не стоит говорить, что тег помещается в html-код между тегами head.

Редирект JavaScript

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

function reload() {location = "http://site.com"}; setTimeout("reload()", 0);

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

Редирект htaccess (301)

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

Использование директив модуля mod_alias

В данном модуле существуют три директивы: Redirect, RedirectPermanent и RedirectMatch. Первые две вроде как идентичны по своим свойства, третья идёт особняком. Для первых двух пример:

Redirect 301 / http://site.com
Redirect permanent /index.html http://site.com
RedirectPermanent /index.html http://site.com/default.html

Строчки схожи. Но вроде как существует один минус – чтобы перенаправить все страницы, нужно их все и будет указать в списке. Чтобы как-то облегчить задачу, существует та другая директива:

RedirectMatch /(.*)\.html$ /$1.php

Можно задавать регулярные выражения для переадресации со старого урла на новый.

Использование директив модуля mod_rewrite

Чтобы не было двоякочтения одних и тех же страниц у поисковиков, иногда нужно переправить все адреса с домена без www на домен с www. Например,

#включаем модуль и необходимую доп.опцию
RewriteEngine On
Options +FollowSymLinks
#две строки для переадресации от "без ввв" к "с ввв"
RewriteCond %{HTTP_HOST} ^site.com
RewriteRule (.*) http://www.site.com/$1

Вместо заключения

Если вас всё ещё мучает вопрос, на чём же остановить свой выбор (конечно мучает, тисками и ножницами – прим.ред. ), то пора перестать мучиться (да что вы говорите! – прим.ред. ). Останавливаем взор на редиректе php (или другого языка программирования, которые здесь не были рассмотрены, например Perl) и редиректе при помощи файла.htaccess, поскольку именно они позволяют перенести сайт без всяких потерь для оптимизации в поисковых системах. Если оно не важно, то тогда подойдёт любой метод. И собственно на этой заключительной ноте (соль? ля? си? – прим.ред. ) я и заканчиваю этот пост.