Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

วิธีเปลี่ยนเส้นทางผู้เยี่ยมชมไปยังเว็บไซต์หรือหน้าอื่นด้วย JavaScript

เรียนรู้วิธีและเหตุผลในการเปลี่ยนเส้นทางผู้เยี่ยมชมเว็บไซต์ของคุณไปยัง URL อื่นด้วย window.location ของ JavaScript วัตถุ

วิธีการเปลี่ยนเส้นทางหน้า

ในการเปลี่ยนเส้นทางผู้เยี่ยมชมเว็บไซต์ของคุณไปยัง URL ใหม่ สิ่งที่คุณต้องทำคือเรียกใช้ JavaScript ต่อไปนี้บนหน้าเว็บที่คุณต้องการเปลี่ยนเส้นทางจาก:

window.location = "https://wheretoredirect.com"

คุณสามารถแทรกโค้ดใน .js ภายนอก ไฟล์หรือวางไว้ในบรรทัดในส่วนหัว (<head> ) ของหน้าเว็บของคุณ:

<script type="text/javascript">
  window.location = "https://wheretoredirect.com"
</script>

ตอนนี้ผู้เยี่ยมชมเว็บไซต์ที่ไปที่ https://yourwebsite.com จะถูกเปลี่ยนเส้นทางไปยัง URL ที่คุณระบุเป็น window.location . ของคุณทันที ค่า.

คุณสามารถใช้การเปลี่ยนเส้นทางหน้าเพื่อนำผู้เยี่ยมชมเว็บไซต์ไปที่:

  • โดเมนเว็บไซต์อื่น (จาก oldsite.com ไปที่ newsite.com )
  • หน้า/โพสต์อื่นในโดเมนเดียวกัน (yourwebsite.com/your-post )
  • โฟลเดอร์ย่อยในโดเมนเดียวกัน (yourwebsite.com/archive )
  • โดเมนย่อย (support.yourdomain.com )

ตรวจสอบให้แน่ใจว่าคุณใช้โปรโตคอลเว็บไซต์ที่ถูกต้อง (https , www , https://www ฯลฯ) เมื่อคุณเปลี่ยนเส้นทางผู้ใช้ของคุณ

แสดงข้อความก่อนเปลี่ยนเส้นทางผู้เยี่ยมชมไซต์

เพื่อปรับปรุงประสบการณ์ผู้ใช้ คุณสามารถแสดงข้อความไปยังผู้เยี่ยมชมไซต์ของคุณและชะลอการเปลี่ยนเส้นทางด้วยตัวจับเวลาถอยหลัง วิธีนี้จะทำให้ผู้เยี่ยมชมของคุณไม่สับสนว่าทำไมจู่ๆ จึงส่งพวกเขาไปยัง URL หรือโดเมนอื่น

ลองใช้รหัสเดิมจากก่อนหน้านี้ แต่ตอนนี้เราได้เพิ่มสิ่งต่อไปนี้ด้วย:

  • ข้อความที่อธิบายว่าเหตุใดระบบจึงถูกเปลี่ยนเส้นทาง
  • ตัวจับเวลาถอยหลังที่รันโค้ดเปลี่ยนเส้นทางหลังจาก 5 วินาที

แสดงข้อความ + ตัวจับเวลาถอยหลัง:

function showMessageBeforeRedirect() {
  window.location = "https://wheretoredirect.com"
}
document.write("You’ll be redirected to our new domain in 5 seconds :-)")
setTimeout("showMessageBeforeRedirect()", 5000)

5000 ค่าเป็นมิลลิวินาที

ลองเพิ่มโค้ดลงในเว็บไซต์ของคุณ <head> เหมือนที่คุณทำก่อนหน้านี้:

<script type="text/javascript">
  function showMessageBeforeRedirect() {
    window.location = "https://wheretoredirect.com"
  }
  document.write("You’ll be redirected to our new domain in 5 seconds :-)")
  setTimeout("showMessageBeforeRedirect()", 5000)
</script>

ดูตัวอย่าง CodePen

เหตุใดคุณจึงเปลี่ยนเส้นทางผู้เยี่ยมชมของคุณ

ต่อไปนี้คือสาเหตุบางประการที่คุณต้องการเปลี่ยนเส้นทางผู้ใช้ในโครงการในชีวิตจริง:

  • คุณเปลี่ยนไปใช้ชื่อโดเมนใหม่และต้องการให้แน่ใจว่าผู้ที่เคยเข้าชมโดเมนเก่าของคุณถูกนำไปยังโดเมนใหม่
  • คุณมีเว็บไซต์ในเวอร์ชันต่างๆ เช่น อันหนึ่งสำหรับเบราว์เซอร์รุ่นเก่าและอีกอันสำหรับเบราว์เซอร์รุ่นใหม่ และคุณต้องการให้แน่ใจว่าผู้ใช้เข้าถึงเบราว์เซอร์ที่ตรงกับเบราว์เซอร์ของพวกเขา
  • คุณมีเวอร์ชันภาษาต่างๆ ในเว็บไซต์เดียวกัน และต้องการให้แน่ใจว่า ผู้ใช้ที่มีการตั้งค่าภาษาอิตาลีในเบราว์เซอร์จะถูกนำไปที่ yourwebsite.com/it .