Để thông báo cho các công cụ tìm kiếm và khách truy cập trang web rằng trang web của bạn đã được chuyển vĩnh viễn đến một vị trí mới với nội dung tương đương, hãy sử dụng chuyển hướng 301. Mã “301” được hiểu là “đã di chuyển vĩnh viễn”. [Tìm hiểu thêm về Mã trạng thái HTTP]
Cách đơn giản nhất để chuyển hướng đến một URL khác là sử dụng thẻ HTML với tham số http-equiv được đặt thành “làm mới”. Thuộc tính nội dung đặt độ trễ trước khi trình duyệt chuyển hướng người dùng đến trang web mới. Để chuyển hướng ngay lập tức, hãy đặt tham số này thành “0” giây cho thuộc tính nội dung
Nếu bạn muốn chuyển hướng của mình diễn ra trong thời gian chính xác, chỉ cần chỉ định tham số ưa thích của bạn [tính bằng giây] cho nội dung. Hãy xem xét một ví dụ, trong đó chúng tôi đặt "7" giây làm thời gian chuyển hướng
Một số trình duyệt không hiển thị
làm mới thẻ chính xác, vì vậy trước khi tải trang tiếp theo, người dùng có thể thấy đèn flash dưới dạng một trangMột số trình duyệt cũ không làm mới chính xác khi bạn thêm liên kết nhanh. Trong trường hợp đó, bạn có thể thêm một liên kết neo để cho phép người dùng theo dõi
Bạn có thể chuyển hướng một trang web qua JavaScript bằng một số phương pháp. Nếu bạn muốn tập lệnh chuyển hướng JavaScript tương thích với nhiều trình duyệt, tốt hơn nên sử dụng các tập lệnh sau
thí dụ
Bạn có thể sử dụng cửa sổ. đối tượng vị trí để tải một trang khác trong JavaScript
thí dụ
Sự khác biệt giữa cửa sổ. vị trí và vị trí. href
- cửa sổ. vị trí là một đối tượng chứa tất cả thông tin về vị trí tài liệu hiện tại [máy chủ, href, cổng, giao thức, v.v. ]
- địa điểm. href là viết tắt của cửa sổ. địa điểm. href [bạn gọi vị trí từ đối tượng chung - cửa sổ, vì vậy đây là cửa sổ. địa điểm. href] và đây chỉ là một chuỗi có URL đầy đủ của trang web hiện tại
Các phương pháp chuyển hướng JavaScript khác
Gán một URL mới cho cửa sổ hiện tại
Thay thế vị trí của cửa sổ hiện tại bằng cửa sổ mới
Đặt vị trí của chính cửa sổ hiện tại
Đặt vị trí của cửa sổ trên cùng của cửa sổ hiện tại
Chuyển hướng trang là tình huống bạn đã nhấp vào một URL để đến trang X nhưng bên trong bạn được chuyển hướng đến một trang Y khác. Nó xảy ra do chuyển hướng trang. Các nhà thiết kế trang web dựa vào chuyển hướng khi có nhu cầu thay đổi bố cục của một trang web cụ thể hoặc vị trí của một trang cụ thể
Để chuyển hướng từ một trang HTML, chúng tôi sử dụng Thẻ META. Cùng với điều này, chúng tôi cũng sử dụng thuộc tính http-equiv để cung cấp tiêu đề HTTP cho giá trị của thuộc tính nội dung. Giá trị trong nội dung là số giây;
Đặt thuộc tính nội dung thành 0, nếu bạn muốn nó tải ngay lập tức. Mặt khác, chỉ định thời gian tính bằng giây nếu bạn muốn trì hoãn việc chuyển hướng một chút
cú pháp
Như chúng ta có thể quan sát rằng chuyển hướng yêu cầu hai tham số -
Thời gian. thể hiện độ trễ trước khi trình duyệt chuyển hướng người dùng đến một trang khác
new_url. đại diện cho địa chỉ URL mà chúng tôi cần chuyển hướng người dùng đến sau thời gian trễ
Sau đây là các ví dụ…
Thí dụ
Trong ví dụ sau, chúng tôi đang chuyển hướng trang này sang một trang khác bằng cách chỉ định liên kết URL trong
HTML Redirect WELCOME TO Tutorialspoint
you'll be redirected to Tutorialspoint Homepage, in 5 seconds.
Ngay sau khi bạn chạy mã, cửa sổ trình duyệt sẽ mở ra và đợi trong 5 giây trước khi tự động chuyển hướng đến trang chủ điểm hướng dẫn
Trì hoãn trang HTML chuyển hướng
Nếu chúng tôi gặp phải bất kỳ lỗi nào trong khi chuyển hướng đến một trang khác hoặc đôi khi trang chuyển hướng bị chậm, điều đó có thể xảy ra nếu chúng tôi đang sử dụng các trình duyệt cũ. vượt qua điều này, chúng tôi sẽ đề cập đến một liên kết mới đến trang web
If you are not redirected in five seconds, click here.
Khi thực thi đoạn mã trên, trang web xuất hiện một liên kết mà chúng tôi đã đề cập bằng cách sử dụng a, để tránh độ trễ chuyển hướng
Bạn có thể đã gặp phải trường hợp khi bạn nhấp vào một URL để đến trang X nhưng bên trong bạn được chuyển hướng đến một trang Y khác. Nó xảy ra do chuyển hướng trang
Khá đơn giản để thực hiện chuyển hướng trang bằng JavaScript ở phía máy khách. Để chuyển hướng khách truy cập trang web của bạn đến một trang mới, bạn chỉ cần thêm một dòng vào phần đầu của mình như sau
Bạn có thể thử chạy đoạn mã sau để tìm hiểu cách sử dụng JavaScript để chuyển hướng trang HTML. Tại đây, chúng tôi sẽ chuyển hướng đến trang chủ
Chuyển hướng trong JavaScript là một kỹ thuật hướng các công cụ tìm kiếm và mọi người đến một URL khác với URL gốc. Trang được định tuyến lại có thể nằm trên cùng một máy chủ hoặc trên một máy chủ khác. Nó cũng có thể diễn ra trên cùng một trang web hoặc các trang web riêng biệt. Đôi khi chúng tôi được chuyển hướng đến một URL khác khi chúng tôi nhấp vào một URL. Nó xảy ra do chuyển hướng trang. Nó không giống như làm mới một trang web
Trong hầu hết các trường hợp, các công cụ tìm kiếm không kiểm tra JavaScript để xem chuyển hướng có đúng không. Vì vậy, nếu chúng ta cần thông báo cho các công cụ tìm kiếm [SEO] về việc chuyển tiếp URL, chúng ta phải đưa phần tử rel="canonical" vào phần đầu của trang web
Có rất nhiều kỹ thuật chuyển hướng trong JavaScript để thực hiện chuyển hướng trang, nhưng phổ biến nhất là vị trí. href và vị trí. thay thế[]. Trong JavaScript, chuyển hướng trang rất đơn giản
Đối tượng vị trí của đối tượng cửa sổ là một thuộc tính. Một trang web có thể được chuyển hướng theo một số cách. Cửa sổ. đối tượng vị trí được sử dụng bởi hầu hết các chức năng
Nó có thể được sử dụng để lấy URL hiện tại hoặc địa chỉ của địa chỉ web. Không có tiền tố cửa sổ, cửa sổ. đối tượng vị trí có thể được viết
Chương trình sau đại học. Phát triển web đầy đủ ngăn xếp
hợp tác với Caltech CTME Đăng ký ngayMột trong những cách thường được sử dụng nhất là cửa sổ. đối tượng vị trí. Nó được sử dụng để tạo một tài liệu mới từ một tài liệu hiện có. Chúng tôi có thể cung cấp một URL mới cho phương pháp này và nó sẽ bắt đầu chuyển hướng HTTP trong JavaScript. Nó khác với href ở chỗ nó xóa tài liệu hiện tại khỏi lịch sử của tài liệu, khiến không thể quay lại bản gốc
cú pháp
cửa sổ. địa điểm. thay thế ["URL mới"]
Thí dụ
hàm page_redirect[]{
cửa sổ. vị trí = "https. //www. xếp hạng với tôi. com/";
}
Đây là một ví dụ về chuyển hướng trang
Bấm vào nút sau để xem hiệu ứng.
đầu ra
Việc sử dụng chuyển hướng trong JavaScript là gì?
Nếu bạn chuyển sang miền mới vì bất kỳ lý do gì, bạn có thể đưa mọi người đến trang web mới khi họ truy cập nội dung của miền cũ hơn
Bạn có nhiều trang với nội dung khác nhau tùy thuộc vào vị trí, ngôn ngữ, trình duyệt hoặc các tiêu chí khác của người dùng và bạn chuyển hướng họ đến trang phù hợp nhất
Yêu cầu tài nguyên từ người dùng không được xác thực hoặc trái phép được gửi đến trang đăng nhập
Bạn hướng mọi người đến các trang bổ sung được kết nối với nội dung của trang hiện tại
Chuyển hướng hoạt động như thế nào?
Bạn có thể đã gặp phải trường hợp khi bạn nhấp vào một URL để truy cập trang web X nhưng thay vào đó lại được chuyển đến trang Y. Nó xảy ra do chuyển hướng trang. Bạn có thể muốn chuyển hướng khách truy cập khỏi trang gốc vì nhiều lý do. Chúng tôi đã biên soạn một danh sách các lý do như vậy
Bạn đã quyết định thay đổi tên miền của mình vì bạn không thích nó. Bạn có thể muốn gửi tất cả khách truy cập của mình đến trang web mới trong trường hợp này. Bạn có thể giữ miền trước của mình nhưng tạo một trang duy nhất có chuyển hướng trang để tất cả các lượt truy cập vào miền cũ của bạn đều chuyển sang miền mới của bạn
Nếu bạn đã tạo một số trang dựa trên phiên bản trình duyệt, tên hoặc thậm chí các quốc gia khác nhau, bạn có thể sử dụng chuyển hướng trang phía máy khách thay vì chuyển hướng trang phía máy chủ để định tuyến khách hàng của bạn đến trang thích hợp
khóa học miễn phí. JavaScript cho người mới bắt đầu
Tìm hiểu kiến thức cơ bản về JavaScript Đăng ký ngayCó thể các công cụ tìm kiếm đã lập chỉ mục các trang của bạn. Tuy nhiên, bạn không muốn mất khách truy cập thông qua các công cụ tìm kiếm khi chuyển sang miền mới. Do đó, chuyển hướng trang phía máy khách là một tùy chọn. Tuy nhiên, hãy nhớ rằng điều này không nên được thực hiện để đánh lừa công cụ tìm kiếm;
Thí dụ
Nhấp vào nút sau, bạn sẽ được chuyển đến trang chủ.
đầu ra
Chuyển hướng trang khi tải trang bằng chuyển hướng trong JavaScript
Bạn có thể sử dụng mã sau ở đầu trang của mình, trong phần tử head> để chuyển hướng khách truy cập đến một trang web khác ngay sau khi trang web của bạn được khởi chạy. Ngoài ra, nếu bạn đang sử dụng một. js, hãy thêm đoạn mã sau vào tệp đó và liên kết tới nó từ đầu trang. Chỉ cần thay thế URL bạn muốn chuyển hướng đến cho URL mẫu. Khách truy cập sẽ không nhìn thấy trang web của bạn và sẽ được chuyển đến URL mục tiêu ngay lập tức với loại chuyển hướng này khi bạn chuyển hướng trong JavaScript
cửa sổ. địa điểm. href = "https. //www. thí dụ. com";
Khóa học Full Stack Web Developer
Để trở thành chuyên gia về MEAN Stack Xem khóa họcChuyển hướng trang sau một sự kiện với chuyển hướng trong JavaScript
Trong những trường hợp như vậy, bạn có thể tiến hành chuyển hướng bằng cách sử dụng kiểm tra điều kiện hoặc bằng cách gán một sự kiện cho một phần tử. Xem xét ví dụ sau
// Kiểm tra điều kiện có đúng không rồi chuyển hướng
nếu [. ] {
cửa sổ. địa điểm. href = "https. //www. thí dụ. com";
}
Nâng cao sự nghiệp của bạn với tư cách là nhà phát triển MEAN stack với Nhà phát triển Web Full Stack - Chương trình Thạc sĩ MEAN Stack. đăng ký ngay bây giờ
Sự kết luận
Việc chuyển hướng trang web bị gián đoạn hoặc không mong muốn được người dùng coi là cực kỳ khó chịu vì chúng làm giảm trải nghiệm chung của người dùng. Ví dụ: chuyển hướng khách hàng đến một trang web khác ngay khi họ đến trang web của bạn chắc chắn sẽ khiến họ khó chịu. Hơn nữa, nếu bạn chuyển hướng mọi người đến một trang không liên quan sau một bộ đếm thời gian, sau khi họ nhấp vào nút hoặc hình ảnh hoặc sau khi họ thực hiện một hành động nhất định trên trang web của bạn, rất có thể người dùng sẽ muốn rời đi ngay lập tức và không bao giờ quay lại
Nếu bạn muốn biết thêm về cách chuyển hướng trong JavaScript, bạn phải đăng ký khóa học Phát triển Web Full Stack của Simplilearn và tận hưởng việc chuyển hướng các trang của bạn. Ngoài ra, nếu bạn muốn nâng cao chuyên môn của mình, bạn có thể khám phá chương trình nâng cao kỹ năng của Simplilearn, nơi các khóa học được cung cấp tập trung vào việc xây dựng các kỹ năng nền tảng vững chắc để phát triển nghề nghiệp
Tìm Chương trình sau đại học của chúng tôi trong Chương trình đào tạo trực tuyến về phát triển web Full Stack tại các thành phố hàng đầu
NameDatePlacePost Chương trình sau đại học về Phát triển Web Full Stack Nhóm bắt đầu vào ngày 10 tháng 1 năm 2023,Đợt cuối tuầnChi tiết CityView của bạnChương trình Post Graduate trong Phát triển Web Full Stack, SingaporeCohort bắt đầu vào ngày 25 tháng 1 năm 2023,
Weekend batchSingaporeView DetailsPost Graduate Program in Full Stack Web DevelopmentCohort starts on 14th Feb 2023,
Weekend batchYour CityView Details
Thông tin về các Tác giả
Simplilearn là một trong những nhà cung cấp đào tạo trực tuyến hàng đầu thế giới về Tiếp thị kỹ thuật số, Điện toán đám mây, Quản lý dự án, Khoa học dữ liệu, CNTT, Phát triển phần mềm và nhiều công nghệ mới nổi khác