Code Javascript tạo trang chuyển hướng khi click vào link chuyển sang website khác

Có một số website khi chúng ta mở link bên khoải (nghĩa là link khác trang hiện tại) thì tự động được chuyển sang một trang chuyển tiếp có bộ đếm ngược và cảnh báo "Chuyển hướng sang trang không thuộc hệ thống". Bạn cũng có thể chèn nhiều quảng cáo hay gì đó ở trang này. OK, đại loại là vậy. Giờ mình hướng dẫn các bạn tự tạo một trang chuyển hướng như vậy nhé.

1. Nguyên lý hoạt động

Để dễ hiểu tôi sẻ quy ước như sau

Trang A có url là https://domainA.com/trang-a(trang hiện tại chứa các link sẽ bị chuyển hướng)

Trang B có url là https://domainA.com/trang-b (trang chuyển hướng mag chúng ta cần làm)

Trang K có url khác là https://domainB.com/trang-k (domainB.com khác domainA.com)

Cách thực hiện như sau:

Tại trang A, Tạo 1 code js để tự quét tất cả các link không cùng tên miền website của chúng ta. Lưu nó vào bộ nhớ thông qua biến. Sau đó sửa lần lượt các link bên ngoài (nếu có nhiều link trên trang) thành một dạng link với tham số là link bên ngoài đó.

nếu bạn chưa hình dung được thì nó sẻ có dạng như sau

https://domainA.com/trang-a?url=https://domainB.com/trang-k

Tuy nhiên để tránh phát sinh lỗi ngớ ngẩn, thì link nên được mã hóa base64 sau đó mới truyền vào tham số.

Tại trang B, tức trang cảnh báo đếm ngược mà ta cần làm. Thêm code js để lấy toàn bộ URL bao gồm tham số "url=XXXXXX". Sau đó tách va lấy nội dung sau dấu = là có được link cần chuyển hướng, giải mã base64 và chờ 30s sau đó thức hiện mã chuyển hướng.

Mình không giỏi trình bày lắm nên hơi lủng củng. AE cứ xem code là hiểu ngay thôi, cũng đơn giản.

2. Code js

Code 1: Thêm vào footer tất cả các trang, chú ý đây là js nên nếu web bạn đang dùng wordpress thì cũng có thể dùng nhưng cài thêm plugin header & footer rồi thêm vào là được

var links = document.querySelectorAll("a");

for (let i = 0; i < links.length; i++) {

if (checkIsExternalLink(links[i].href)) {

links[i].href = 'https://domainA.com/trang-a?url=' + encodeURIComponent(links[i].href);

links[i].setAttribute("target", "_blank");

}

function checkIsExternalLink(url) {

if (url.indexOf("mailto") !== -1 || url.indexOf("tel") !== -1 || url.indexOf("sms") !== -1 || url.indexOf("javascript:void(0)") !== -1) {

return false;

} else {

var tempLink = document.createElement("a");

tempLink.href = url;

return tempLink.hostname !== window.location.hostname;

}

</script>

Giải thích một chút cho dể hiểu:

- hàm checkIsExternalLink(url) để lọc bỏ các link đặt biệt như email, phone,...

- encodeURIComponent để mã hóa link trước khi đưa vào tham số cho đỡ lỗi và cũng che đi link thực

Code 2: Tạo một trang cố định: và thêm code sau để chuyển tiếp link

var currentUrl = window.location.href;

function getQueryParam(url, key) {

var queryStartPos = url.indexOf('?');

if (queryStartPos === -1) {

return;

}

var params = url.substring(queryStartPos + 1).split('&');

for (var i = 0; i < params.length; i++) {

var pairs = params[i].split('=');

if (decodeURIComponent(pairs.shift()) == key) {

return decodeURIComponent(pairs.join('='));

}

var valueUrl_goto = getQueryParam(currentUrl, 'url');

var decoded_url = decodeURIComponent(valueUrl_goto);

setTimeout(function() {

window.open(decoded_url, "_blank");

}, 60000);

});

</script>

Code đếm ngược mình không viết ở đây, ở đây mình chờ 60 giây sau đó chuyển tiếp link nha

Đây là các viết code cho JS thuần nên chạy được cho mọi nền tảng web, chỉ cần nhúng vào footer website là chạy được hết. Còn nếu muốn viết bằng PHP thì trên mạng có nhiều bạn có bài hướng dẫn rồi nên mình không hướng dẫn thêm. Nếu cần để lại comment mình sẽ làm

Nội dung bài viết "Code Javascript tạo trang chuyển hướng khi click vào link chuyển sang website khác". Bài viết sẽ được chúng tôi thường xuyên cập nhật và sẽ hiển thị trong 24 giờ tới. Webcode24h luôn cập nhật các bài viết của mình để nó trở nên hữu ích với bạn đọc.

Cảm ơn bạn đã đọc hết bài viết, bạn cũng có thể truy cập danh mục "Lập trình Web, WordPress, Hướng dẫn, Hỏi đáp code, Lập Trình" dưới để xem các bài viết khác cùng chủ đề trên website của chúng tôi nhé.

Vui lòng để link nguồn bài viết này nếu bạn copy nội dung này