JavaScript - przekierowanie strony

Co to jest przekierowanie strony?

Mogłeś napotkać sytuację, w której kliknąłeś adres URL, aby przejść do strony X, ale wewnętrznie zostałeś przekierowany na inną stronę Y. Dzieje się tak z powodu page redirection. Ta koncepcja różni się od odświeżania strony JavaScript .

Może być wiele powodów, dla których chcesz przekierować użytkownika z oryginalnej strony. Wymieniamy kilka powodów -

Nie podobała Ci się nazwa Twojej domeny i przenosisz się do nowej. W takim przypadku warto skierować wszystkich odwiedzających do nowej witryny. Tutaj możesz zachować starą domenę, ale umieścić jedną stronę z przekierowaniem strony, tak aby wszyscy odwiedzający starą domenę mogli przejść do nowej domeny.
Zbudowałeś różne strony w oparciu o wersje przeglądarki lub ich nazwy lub możesz mieć siedzibę w różnych krajach, a następnie zamiast korzystać z przekierowania strony po stronie serwera, możesz użyć przekierowania strony po stronie klienta, aby skierować użytkowników na odpowiednią stronę.
Wyszukiwarki mogły już zaindeksować Twoje strony. Ale przenosząc się do innej domeny, nie chcesz stracić odwiedzających przechodzących przez wyszukiwarki. Możesz więc użyć przekierowania strony po stronie klienta. Pamiętaj jednak, że nie należy tego robić w celu oszukania wyszukiwarki, ponieważ może to doprowadzić do zbanowania Twojej witryny.

Jak działa przekierowanie strony?

Implementacje przekierowania strony są następujące.

Przykład 1

Przekierowanie strony przy użyciu JavaScript po stronie klienta jest dość proste. Aby przekierować odwiedzających witrynę na nową stronę, wystarczy dodać linię w sekcji nagłówka w następujący sposób.

<html>
   <head>
      <script type = "text/javascript">
         <!--
            function Redirect() {
               window.location = "https://www.tutorialspoint.com";
            }
         //-->
      </script>
   </head>
   
   <body>
      <p>Click the following button, you will be redirected to home page.</p>
      
      <form>
         <input type = "button" value = "Redirect Me" onclick = "Redirect();" />
      </form>
      
   </body>
</html>

Wynik

Przykład 2

Możesz wyświetlić odpowiednią wiadomość odwiedzającym witrynę, zanim przekierujesz ich na nową stronę. Załadowanie nowej strony wymagałoby trochę opóźnienia. Poniższy przykład pokazuje, jak zaimplementować to samo. TutajsetTimeout() to wbudowana funkcja JavaScript, której można użyć do wykonania innej funkcji po określonym czasie.

<html>
   <head>
      <script type = "text/javascript">
         <!--
            function Redirect() {
               window.location = "https://www.tutorialspoint.com";
            }            
            document.write("You will be redirected to main page in 10 sec.");
            setTimeout('Redirect()', 10000);
         //-->
      </script>
   </head>
   
   <body>
   </body>
</html>

Wynik

You will be redirected to tutorialspoint.com main page in 10 seconds!

Przykład 3

Poniższy przykład pokazuje, jak przekierować odwiedzających witrynę na inną stronę na podstawie ich przeglądarek.

<html>
   <head>     
      <script type = "text/javascript">
         <!--
            var browsername = navigator.appName;
            if( browsername == "Netscape" ) {
               window.location = "http://www.location.com/ns.htm";
            } else if ( browsername =="Microsoft Internet Explorer") {
               window.location = "http://www.location.com/ie.htm";
            } else {
               window.location = "http://www.location.com/other.htm";
            }
         //-->
      </script>      
   </head>
   
   <body>
   </body>
</html>