เรียนรู้วิธีและเหตุผลในการเปลี่ยนเส้นทางผู้เยี่ยมชมเว็บไซต์ของคุณไปยัง 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
.