Redirect в JavaScript: переадресация на другой URL

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

Иногда вы хотите перенаправить пользователей на новый URL-адрес, например, после входа пользователей вы хотите переадресовать их на домашнюю страницу администратора.

JavaScript имеет API, которые позволяют вам перенаправить на новый URL-адрес или страницу. Однако перенаправление JavaScript полностью выполняется на стороне клиента. Поэтому он не возвращает код состояния 301(перемещение навсегда), как перенаправление сервера.

Если вы перемещаете сайт в отдельный домен или создаете новый URL для старой страницы, вы всегда должны использовать серверное перенаправление.

Перенаправление на новый URL

Чтобы перенаправить на новый URL-адрес с текущей страницы, вы используете объект location :

location.href = 'new_url';

Например:

location.href = 'https://www.javascripttutorial.net/';

Присвоение значения свойству href объекта location имеет тот же эффект, что и вызов метода assign() объекта location :

location.assign('https://www.javascripttutorial.net/');

Любой из этих вызовов перенаправит на новый URL-адрес и создаст запись в стеке истории браузера. Это означает, что вы можете вернуться на предыдущую страницу с помощью кнопки « Назад » в браузере.

Чтобы перенаправить на новый URL-адрес без создания новой записи в стеке истории браузера, используйте метод replace() объекта location :

location.replace('https://www.javascripttutorial.net/');

Перенаправление на относительный URL

Следующий скрипт перенаправляет на about.html, который находится на том же уровне, что и текущая страница.

location.href = 'about.html';

Следующий скрипт перенаправляет на страницу contact.html, расположенную в корневой папке:

location.href = '/contact.html';

Редирект при загрузке страницы

Если вы хотите перенаправить на новую страницу при загрузке, используйте следующий код:

window.onload = function() {
    location.href = "https://www.javascripttutorial.net/";
}

Заключение

  • Чтобы перенаправить на новый URL-адрес или страницу, вы назначаете новый URL-адрес свойству location.href или используете метод location.assign().
  • Метод location.replace() в Джаваскрипт перенаправляет на новый URL-адрес, но не создает запись в стеке истории браузера.
Рейтинг
( Пока оценок нет )
Александр Русаков / автор статьи
Программист, разработчик, 12 лет опыта работы в крупных компаниях. Быстро освоил typescript, делюсь своими знаниями на страницах этого сайта.
Загрузка ...
JavaScript и TypeScript