本文實(shí)例講述了JS防止網(wǎng)頁(yè)被嵌入iframe框架的方法。分享給大家供大家參考，具體如下：

例如：

<script type="text/javascript">
  if (window!=top) // 判斷當(dāng)前的window對(duì)象是否是top對(duì)象
  top.location.href = window.location.href; // 如果不是，將top對(duì)象的網(wǎng)址自動(dòng)導(dǎo)向被嵌入網(wǎng)頁(yè)的網(wǎng)址
</script>

這段代碼是有效的。但是，有一個(gè)問(wèn)題：使用后，任何人都無(wú)法再把你的網(wǎng)頁(yè)嵌入框架了，包括你自己在內(nèi)。

于是，我今天就在考慮，有沒(méi)有一種方法，使得我的網(wǎng)頁(yè)只能被嵌入我自己的框架，而不是別人的框架？

表面上看，這個(gè)問(wèn)題很簡(jiǎn)單。只要做一個(gè)判斷：當(dāng)前框架和頂層框架的域名是否相同，如果答案是否，就做了一個(gè)URL重定向。

if (top.location.hostname != window.location.hostname) {
  top.location.href = window.location.href;
}

但是，出乎意料的是，這樣寫是錯(cuò)誤的，根本無(wú)法運(yùn)行。你能看出，錯(cuò)在哪里嗎？

假定 top.location.hostname 是 www.111.com，而 window.location.hostname 是 www.222.com。也就是說(shuō)，111.com把222.com嵌入了它的網(wǎng)頁(yè)中。這時(shí)，比較 top.location.hostname != window.location.hostname 會(huì)有什么結(jié)果？

瀏覽器會(huì)提示代碼出錯(cuò)！

因?yàn)樗鼈兛缬颍╟ross-domain）了，瀏覽器的安全政策不允許222.com的網(wǎng)頁(yè)操作111.com的網(wǎng)頁(yè)，反之亦然。IE把這種錯(cuò)誤叫做"沒(méi)有權(quán)限"。進(jìn)一步說(shuō)，瀏覽器甚至不允許你查看top.location.hostname，跨域情況下，一看到這個(gè)對(duì)象，就直接報(bào)錯(cuò)。

那么，代碼應(yīng)該如何修改？

事實(shí)上，這提示我們，只要查看top.location.hostname是否報(bào)錯(cuò)就可以了。如果報(bào)錯(cuò)了，表明存在跨域，就對(duì)top對(duì)象進(jìn)行URL重導(dǎo)向；如果不報(bào)錯(cuò)，表明不存在跨域（或者未使用框架），就不采取操作。

try{
  top.location.hostname;
}catch(e){
  top.location.href = window.location.href;
}

這樣寫已經(jīng)正確了，在IE和Firefox中可以正確運(yùn)行。但是，Chrome瀏覽器會(huì)出現(xiàn)錯(cuò)誤，不知為何，在跨域情況下，Chrome對(duì)top.location.hostname不報(bào)錯(cuò)！

沒(méi)辦法，只能為了Chrome，再加一段補(bǔ)充代碼。

try{
  top.location.hostname;
  if (top.location.hostname != window.location.hostname) {
    top.location.href =window.location.href;
  }
}catch(e){
  top.location.href = window.location.href;
}

好了，升級(jí)版代碼完成。除了本地域名以外，其他域名一律無(wú)法將你的網(wǎng)頁(yè)嵌入框架。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript操作iframe技巧總結(jié)》、《JavaScript數(shù)組操作技巧總結(jié)》、《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫(huà)特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》及《JavaScript遍歷算法與技巧總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

最新評(píng)論