Html переадресация на другую страницу: Как сделать редирект. Все способы

8

6 Перемещено навсегда»

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

302, «Найдено» или «Временно перемещено»

Код состояния 302 указывает на то, что запрашиваемый вами ресурс был перенаправлен на другой ресурс. При перенаправлении 302 «Найдено» или «Временно перемещено» сервер перенаправляет пользователя в новое место назначения, несмотря на то, что исходное местоположение все еще используется для запросов.

Перенаправление HTML

Meta Refresh является перенаправлением на стороне клиента, а не постоянным перенаправлением 301. Это самый простой способ перенаправить на другой URL-адрес с помощью тега HTML Meta Refresh. Мы можем разместить этот метатег в верхней части любой HTML-страницы следующим образом:

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

Полный исходный код

Перенаправление страниц в HTML 5

Приведенный выше код будет работать и в HTML 5.

Перенаправление URL-адреса Javascript

Вы можете перенаправить веб-страницу на другую страницу несколькими способами, включая перенаправления JavaScript, перенаправления на стороне сервера, перенаправления мета-обновления HTML и т. д. Вы можете перенаправить веб-страницу через JavaScript, используя ряд методов. Почти все методы перенаправления Javascript связаны с объектом window.location, который является свойством объекта Window, поскольку он контролирует, какая страница загружается в браузер, находится в свойстве JavaScript свойства window.location.

Приведенный выше код Javascript перенаправляет текущую страницу на страницу https://net-informations.com/faq.

Полный исходный код

Перенаправление на текущий URL с параметрами URL

Следующий код Javascript показывает, как передать параметр при перенаправлении страницы

Разница между window.

Оба различны, window.location — это объект, содержащий свойство, а location.href — строка. window.location — это объект, который содержит всю информацию о текущем местоположении документа (хост, href, порт, протокол и т. д.). Location.href является сокращением для window.location.href, и это только строка с полным URL-адресом текущего веб-сайта. Значение toString() объекта location такое же, как и у свойства href, поэтому они идентичны, если используются как строки. Настройка window.location аналогична настройке window.location.href.

Приведенный выше код Javascript устанавливает новый href (URL) для текущего окна.

URL перенаправление при загрузке страницы

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

Вернуться на главную страницу

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

Есть и другие способы перенаправления страниц в Javascript

Это то же самое, что нажать кнопку «Назад» в браузере или на history.go(-1).

Как перенаправить ваш сайт на мобильную версию

Бывают ситуации, когда вы хотите перенаправить свой сайт на мобильную версию. Например, если кто-то посещает example.com со своего телефона, вам понадобится способ перенаправить его на m.example.com (в случае, если мобильная версия вашего сайта создана на поддомене с именем «m»). Следующий код Javascript поможет вам перенаправить на вашу мобильную версию.

Примечание. Обычно мобильные телефоны имеют небольшую ширину экрана, поэтому вам следует перенаправлять посетителей на ваш мобильный сайт, если их ширина экрана меньше или равна 699 ​​пикселям.

Для iPhone и iPod

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

Поисковая оптимизация и перенаправление URL

Обычно поисковые системы используют код состояния 301 для переноса рейтинга страницы со старого URL на новый URL. Перенаправление Javascript возвращает код состояния ответа http: 200 OK. Таким образом, перенаправление Javascript не является дружественным для поисковых систем перенаправлением, и лучше использовать некоторые другие методы перенаправления, которые возвращают код состояния: 301 Moved Permanently. Например, если вы хотите уведомить поисковые системы (SEO) о переадресации вашего URL-адреса, вам следует добавить метатег rel=»canonical» в заголовок вашего веб-сайта, поскольку поисковые системы не анализируют javascript для проверки перенаправления.

В чем разница между каноническим и 301 редиректом?

Когда вы используете перенаправление 301, вы показываете поисковой системе, что текущая страница навсегда перемещена в другое место.

Cannonical используется для предотвращения санкций поисковой системы за дублированный контент. Когда вы его используете, текущая страница существует, но показывает поисковой системе, что это «копия» другой «мастер-страницы». Из следующего примера вы получите ясное представление об этом.

http://example.com/demo-1.html

http://example.com/category-1/demo-1.html

http://example.com/category-1/subcategory-1/demo-1.html

Приведенные выше 3 URL-адреса совпадают и имеют точное содержание. Нормальные поисковые системы не любят дублированный контент и тоже штрафуют. Таким образом, в этом случае вы должны поместить на каждой отдельной странице тег rel canonical на «главную» страницу. Например, мы выберем «http://example.com/category-1/subcategory-1/demo-1.html».

Использование перенаправлений — хостинг AWS Amplify

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

Типы перенаправлений

Существует несколько типов перенаправлений, которые поддерживают определенные сценарии.

Постоянная переадресация (301)

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

Общие причины использования переадресации 301 включают:

Временная переадресация (302)

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

Общие причины использования переадресации 302 включают:

Переписать (200)

200 редиректов (перезаписей) предназначены для показа контента с адреса назначения, как если бы они были обслужены с исходного адреса. История рейтинга поисковых систем продолжает применяться на первоначальный адрес. Перенаправление происходит на стороне сервера, поэтому панель навигации браузера показывает исходный адрес после перенаправления. Общие причины использовать 200 редиректов включают:

Не найдено (404)

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

Создание и редактирование перенаправлений

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

Исходный адрес

Адрес, запрошенный пользователем.

Адрес назначения А

Адрес, который фактически обслуживает содержимое, которое видит пользователь.

Тип перенаправления

Типы включают постоянное перенаправление (301), временное перенаправление (302), перезапись (200) или не найдено (404).

Двухбуквенный код страны (опционально)

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

Для создания перенаправления в консоли Amplify

1. Войдите в консоль управления AWS и откройте консоль Amplify.

2. Выберите приложение, для которого вы хотите создать перенаправление.

3. В области навигации выберите Параметры приложения , а затем выберите Переписывает и перенаправляет .

4. В разделе Переписывает и перенаправляет выберите Редактировать .

5. Процедура добавления перенаправления зависит от того, хотите ли вы добавить правила по отдельности или массовое редактирование:

   • Чтобы создать индивидуальную переадресацию, выберите Добавить правило .

     1. Для Исходный адрес введите исходный адрес — запросил пользователь.

     2. Для Целевой адрес введите адрес назначения который отображает содержимое для пользователя.

     3. Для Введите , выберите тип перенаправления из список.

     4. (необязательно) Для кода страны введите две буквы состояние кода страны.

   • Чтобы массово редактировать перенаправления, выберите Открыть текст редактор .

     1. Вручную добавить или обновить перенаправления в Массовое добавление переписывает и перенаправляет редактор JSON.

6. Выбрать Сохранить .

Порядок редиректов

Редиректы выполняются сверху вниз по списку. Убедитесь, что ваш заказ желаемый эффект. Например, следующий порядок перенаправлений приводит к тому, что все запросы для заданного пути до /docs/ для перенаправления на тот же путь под /documents/ , за исключением /docs/specific-filename.html , который перенаправляет на /documents/other-filename.html :

 /docs/specific-filename.html /documents/other-filename.html 301
/docs/<*> /documents/<*> 

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

 /документы/<*> /документы/<*>
/docs/specific-filename.html /documents/other-filename.html 301 

Параметры запроса

Параметры запроса можно использовать для большего контроля над совпадениями URL. Усиление вперед все параметры запроса на путь назначения для 301 и 302 редиректов со следующим исключения:

• Если исходный адрес содержит строку запроса, для которой установлено определенное значение, Amplify не пересылает параметры запроса. В этом случае перенаправление применяется только к запросам на целевой URL с указанным значением запроса.

• Если адрес назначения для правила сопоставления имеет параметры запроса, запрос параметры не передаются. Например, если адрес назначения для перенаправления https://example-target.com?q=someParam , параметры запроса не прошел сквозь.

Простые перенаправления и перезаписи

В этот раздел мы включили пример кода для распространенных сценариев перенаправления.

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

^{JSON [{«источник»: «/original.html», «статус»: «301», «цель»: «/destination.html», «условие»: null}]}

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

^{JSON [{«источник»: «/docs/<*>«, «статус»: «301», «цель»: «/documents/<*>«, «условие»: null}]}

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

^{JSON [{«источник»: «/<*>«, «статус»: «200», «цель»: «/index.html», «condition»: null}]}

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

^{JSON [{«источник»: «https://mydomain.com», «статус»: «200», «цель»: «https://www.mydomain.com», «condition»: null}]}

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

^{JSON [{«источник»: «/<*>«, «статус»: «404», «цель»: «/404.html», «condition»: null}]}

Перенаправления для одностраничных веб-приложений (SPA)

Большинство платформ SPA поддерживают HTML5 history.pushState() для изменения местоположения браузера без запуск запроса к серверу. Это работает для пользователей, которые начинают свое путешествие с корня (или /index.html ), но не работает для пользователей, перейти непосредственно на любую другую страницу. 9.]+$)/>», «status»: «200», «target»: «/index.html», «condition»: null}]

Обратное перезапись прокси-сервера

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

^{JSON [{«источник»: «/images/<*>«, «статус»: «200», «цель»: «https://images.otherdomain.com/<*>«, «состояние»: null}]}

Косая черта в конце и чистые URL-адреса

Для создания чистых структур URL-адресов, таких как о вместо about.html , генераторы статических сайтов такие как Hugo генерируют каталоги для страниц с index.html ( /about/index.html ). Amplify автоматически создает очищайте URL-адреса, добавляя косую черту в конце, когда это необходимо. В таблице ниже представлены различные сценарии:

Заполнители

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

^{JSON [{«источник»: «/docs/<год>/<месяц>/<дата>/<элемент>«, «статус»: «301», «target»: «/documents/<год>/<месяц>/<дата>/<элемент>«, «условие»: ноль}]}

Строки запроса и путь параметры

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

^{JSON [{"source": "/docs?id=", "status": "301", "target": "/documents/", "условие": null}]}

Примечание

Amplify перенаправляет все параметры строки запроса на путь назначения для 301 и 302 редиректа. Однако, если исходный адрес включает строку запроса, установленную на определенное значение, как показано в этом примере, Amplify не пересылает запрос параметры. В этом случае перенаправление применяется только к запросам к месту назначения адрес с указанным значением запроса идентификатор .

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