隨著互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展,網(wǎng)頁應(yīng)用也越來越復(fù)雜,而JavaScript作為網(wǎng)頁客戶端腳本語言,自然也隨之得到越來越廣泛的應(yīng)用。除了最基本的頁面效果控制外,JavaScript還可以用于Ajax請求、表單驗(yàn)證、網(wǎng)頁游戲、數(shù)據(jù)可視化等各種方面,在互聯(lián)網(wǎng)行業(yè)中應(yīng)用范圍十分廣泛。
然而,我們也經(jīng)常遇到各種彈窗廣告、自動(dòng)跳轉(zhuǎn)、頁面修改等不良現(xiàn)象,這些都是被稱為“JavaScript外掛”的東西所為。JavaScript外掛是指通過JavaScript程序修改網(wǎng)頁原有的行為或添加新的行為而讓網(wǎng)頁呈現(xiàn)出不同于設(shè)計(jì)者意愿的效果。這樣的外掛在有些場景下可能會(huì)增強(qiáng)用戶的體驗(yàn),如某些游戲的外掛等,但在大多數(shù)情況下其危害遠(yuǎn)大于其益處。
比如,我們在瀏覽一些真實(shí)網(wǎng)站時(shí),可能會(huì)受到訪問者自動(dòng)跳轉(zhuǎn)到惡意網(wǎng)站的困擾,這類例子并不少見。這種外掛通常是通過修改瀏覽器歷史記錄和頁面跳轉(zhuǎn)機(jī)制來實(shí)現(xiàn)的,防御這類外掛需要我們及時(shí)更新瀏覽器版本并保持合理的網(wǎng)頁瀏覽習(xí)慣。
// 修改瀏覽器歷史記錄并進(jìn)行跳轉(zhuǎn)的JavaScript外掛
window.history.replaceState(null, document.title, window.location.href);
window.history.pushState(null, document.title, window.location.href);
window.onpopstate = function () {
window.history.go(1);
};
window.location.;
此外,JavaScript外掛還會(huì)用于修改網(wǎng)頁的內(nèi)容和樣式,這樣的外掛通常使用JavaScript/DOM/CSS等相關(guān)技術(shù)實(shí)現(xiàn)。例如,在一些博客中,我們可能會(huì)看到文字下面有“瀏覽n次”的統(tǒng)計(jì)數(shù)據(jù),可以試著用自己的瀏覽器控制臺(tái)把它刪掉,再刷新頁面,就會(huì)發(fā)現(xiàn)該數(shù)據(jù)被恢復(fù)了。這種實(shí)現(xiàn)方式利用了Javascript能夠操作文檔樹和CSS樣式表的特點(diǎn),但其本身并不具有危險(xiǎn)性。
// 操作DOM及CSS樣式表的JavaScript外掛
const visits = parseInt(document.getElementsByClassName('visits')[0].innerText);
document.getElementsByClassName('visits')[0].innerText = `瀏覽${visits + 1}次`;
const style = document.createElement('style');
style.innerHTML = '.visits { color: red; }';
document.head.appendChild(style);
除了JavaScript外掛,還有一種被稱為“瀏覽器插件”或“瀏覽器擴(kuò)展”的東西也能改變網(wǎng)頁的行為。瀏覽器插件是指用戶自己安裝在瀏覽器中、能夠修改網(wǎng)絡(luò)流量并在網(wǎng)頁上進(jìn)行深度定制的程序,其比JavaScript外掛的效果更加強(qiáng)大。例如,AdBlock、LastPass等擴(kuò)展都能為我們的瀏覽器增加新的功能,提供更好的上網(wǎng)體驗(yàn)。
JavaScript是一個(gè)強(qiáng)大的語言,它可以為網(wǎng)頁帶來非常豐富的交互體驗(yàn)。但是,由于它的開放性和靈活性,我們也要防范JavaScript外掛所帶來的威脅,尤其是在訪問未知和不可信的網(wǎng)站時(shí)更要保持警惕,不要輕易同意添加瀏覽器插件或運(yùn)行未知腳本。