很早就想写一篇关于网页源代码屏蔽的文章。是因为经常编出些JS脚本的之后,在沾沾自喜的同时,也在担心源代码会被人家看到,盗用我的脚本。所以一直以来,我都在尽力维护我的网页源代码的安全。虽然目前还没有找到完全安全的屏蔽方法(也就是说,这些方法在我想出来的同时,自己已经知道其弱点和破解方法了),但是,我这里有很多屏蔽的思路,来总结一下。
众所周知,要保护一个页面,最基础的就是要屏蔽右键。而现在网页上用得最多的是function click(),即下面这段代码:
<script type="text/javascript">
function click(){
if(event.button==2){
alert( '本网站欢迎您 !!');
}
}
document.οnmοusedοwn=click
</script>
但是这种屏蔽方法的破解方法也是众所周知的。那就是连续单击鼠标左键和右键便又可以看到右键菜单了。但是,我见过一种很好的屏蔽右键的方法。它的原理和上面所说的不同。它并不是用JS来编写的脚本,而是利用定义网页属性来起到限制的作用。而且,在屏蔽中应该尽量的避开使用JS脚本。因为只要浏览者把IE里的javascript脚本禁用了。那么一切屏蔽都白费。
那么继续说那种通过修改网页属性的屏蔽右键的方法。这种方法利用了HTML里的〈body〉来作修改,它只有以下短短的一行代码:
〈body οncοntextmenu=self.event.returnValue=false〉
这里,定义了oncontextmenu。使得右键的值为false,起到了屏蔽右键的效果。现在,再试试看刚才的破解方法,已经不行了。左右键连击已经不能再打开右键菜单。不但是这个,再试试看其他的方法。无论你怎样的乱点,右键都没有用。因为在这个网页里,右键已经不存在了。对于一个不存在的功能键,你又能做什么呢?
但是,屏蔽了右键还不能解决问题。如果我要复制一段文字,或是一张图片。那么,把它选中后用ctrl+C 再用 ctrl+V不就可以复制粘贴了嘛。对了,接下来要讲的,就是屏蔽左键(什么?屏蔽左键?那这个网页不就差不多废掉了?别急,没说完呢,左键只有一项功能是很讨厌的)的选定功能。
那么,如上所说,用JS来屏蔽是没有用的,治标不治本的。那么,我们就还用网页的最基础的语言:HTML来定义吧。还是老招数,定义〈body〉。这次用的参数是:onselectstart。就是左键选定的参数。代码如下:
〈body onselectstart="return false"〉
这样,左键选定功能就给轻易屏蔽了。原理和上面的一样。现在,再用你的左键选择任意内容把,已经没有用了。自然也不能ctrl + C,ctrl +V了。那么,现在我们来把这两部分合并起来。彻底控制左右键!:
〈body οncοntextmenu=self.event.returnValue=false onselectstart="return false"〉
现在,左右键的问题总算是解决了吧。
好,现在我们来看另一个问题。大家都知道,在IE浏览器的菜单栏里的“查看”项里。有一个“查看源代码”选项。这么一来,虽然我们屏蔽了右键里的查看源代码。但是,只要用菜单栏里的查看源代码,还是可以看到源代码的。这可怎么办呢?
我最初的想法是用框架来避开源代码的查看。也就是说,只要一个网页是嵌在框架里的,那么在菜单栏里选择查看源代码查看到的只是框架网页的源代码。一般格式如下:
〈html〉
〈head〉
〈meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312"〉
〈title〉本网站标题〈/title〉
〈/head〉
〈frameset rows="47,*" framespacing="0" border="0" frameborder="0"〉
〈frame name="header" scrolling="no" noresize target="main" src="top.htm"〉
〈frame name="main" src="main.htm" scrolling="auto" target="_self"〉
〈noframes〉
〈body〉
〈p〉此网页使用了框架,但您的浏览器不支持框架。〈/p〉
〈/body〉
〈/noframes〉
〈/frameset〉
〈/html〉
这样看起来对方是没有直接看到你的源代码了。但是,如果一个人要看你的源代码,那他八成是能看懂的。如果懂一点HTML的话,都能看出这两句是什么意思:
〈frame name="header" scrolling="no" noresize target="main" src="top.htm"〉
〈frame name="main" src="main.htm" scrolling="auto" target="_self"〉
这两句的意思就是:在header(也就是网页顶部)处引用相对路径下的top.htm网页文件。而在main(也就是占据网页大部分页面的位置)处引用相对路径下的main.htm网页文件。就这两点是关键的,其他就不作解释了,大家也都懂的。而上面所讲的利用框架来隐藏源代码的方法就是将要显示页面放在main部分。而将header部分的大小设为0。但是这样一来,利用菜单栏里的查看源代码,还是能查看到框架网页的源代码。只要看到这两句,就知道我们前面用的手法了。也就是说,只要将框架网页的名字改为目标网页,便可以用相同的方法直接看到目标网页的源代码了。如:框架网页:http://www.sina.com.cn/red.htm的源代码如上,就可以改为Http://www.sina.com.cn/main.htm。这样便可直接浏览被保护网页,屏蔽源代码的效果还是没有达到。
那么,有些人就会想到,如果对方看不到框架网页的源代码。又何谈去直接打开被保护网页?对,这就是接下来我要讲的。如果要一个页面的菜单栏内的查看源代码失去效用。那最简单的办法就是去掉菜单栏。而这一点是可以通过弹出窗口来实现的。之所以不选用超链接打开无菜单栏窗口是因为那样会暴露目标地址,浏览者可以直接在浏览器中敲入地址,而绕过这个屏蔽的菜单栏。要使用超链接打开无菜单栏窗口,就必须在一个已受到源代码屏蔽保障的网页中使用相关链接。
那么,我们就看看如何利用弹出窗口来去掉菜单栏。其实,我们要做的,就是让目标网页在一个广告条中打开。这个代码几乎每个大型网站都会有的。代码如下:
〈script〉
〈!--
window.open("red.htm", "red", "resizable=yes,width=500,height=300");
--〉
〈/script〉
这里,在window.open后的括号里的第一个参数就是弹出窗口所显示的网页的位置,这里例子里是先对位置下的red.htm网页文件。这时运行便会谈出一个显示有red.htm的无菜单栏的窗口。好,我们的目的达到了。但是,这个窗口有一个缺陷,就是没有滚动条。因为在谈出窗口的语句:window.open里并没有关于滚动条的参数,(或是我不知道?欢迎高手来信指出),所以这里打开的网页建议只做成网页的导航页。
但是,用以上方法取消菜单栏,必须有一个第二方的网页来作弹出的工作。那么,这个用来弹出窗口的网页又成为了一个问题的所在。举例来说:假设,我们用一个index.htm来作弹出窗口的工作。也就是打开index.htm之后,会弹出red.htm的无菜单栏窗口。前面我们也提到了,如果知道了一个网页的地址后,无论这个网页是否隐藏在无菜单栏之下,你都能看到它的源代码。那么,不让这个red.htm的地址暴露也就成了解决这个问题的关键。但是,只要这个index.htm被打开,就可以看到源代码。但是,不妨反过来想想,如果我们把index.htm给关起来呢?只要在浏览者没有来得及查看index.htm之前将它关闭,就能保住它的源代码了。那么,在这个index.htm里就有得做些文章了。
那就是,添加关闭网页的代码。
那么,我们就可以用window.close来关闭窗口。代码如下:
〈script〉
〈!--
window.open();
--〉
〈/script〉
那么,现在我们把两部分代码合并起来。现在,得到的效果就是——直接有一个无菜单栏的窗口打开了。因为计算机的处理速度很快,如果我们将这两段代码紧接着写在一起,那么我们就只能看到新建的窗口。代码如下:
〈script〉
〈!--
window.open("red.htm", "red", "resizable=yes,width=500,height=300");
window.close();
--〉
〈/script〉
而原来的窗口,已在我们无察觉的情况下关闭了。这样,就别说查看该网页的源代码了。这里,加入上面源代码的网页起了一个跳板的作用。但是,在这里,我们要注意几点。第一,用来做跳板的网页不应该命名为index.htm。将它换一个名字,然后把默认首页的名字改为更改过的名字。这样,是浏览者能在输入网之后便自动访问该页。而又不致让对方知道该页的名称。如果不这样做,就会导致对方猜测出该页的位置。如:172.0.0.0/index.htm。这样,就可以通过在浏览器中提交:View-Source:Http://172.0.0.0/index.htm就可以看到该页的源代码了。
在屏蔽掉了菜单栏和工具栏之后,我们想,如果没有了最上方的窗口条该多好呢?下面我们要做的事情,有前提,就是在上面所说的在利用跳板页面打开一个无菜单栏的窗口之后。我们要做什么呢?就是让我们显示网站内容的窗口只显示内容,(是啊,网站不就是给别人浏览的吗?要浏览器和windows的那么多功能做什么呀……)只要内容,其余一律去掉。我们就可以通过一段javascript来完成。下面这段代码就是用来定义无任何窗口特征的代码:
〈script〉
function open1(url){
newwin=window.open(url,'newwindow','fullscreen=1')
newwin.resizeTo(800,600)
newwin.moveTo(screen.width/0-800,screen.height/0-600)
}
〈/script〉
其中,function open1(url)定义了超链接的写法。所以,我们在写链接的地址时,应该这样写:javascript:open1(url)。比如我要打开一个无窗口特征的新浪首页就应该在文字或图片的超链接里这样写:javascript:open1(‘http:www.sina.com.cn’)。当然,括号内也支持相对路径。最后写出来的格式应该是:
〈script〉
function open1(url){
newwin=window.open(url,'newwindow','fullscreen=1')
newwin.resizeTo(800,600)
newwin.moveTo(screen.width/0-800,screen.height/0-600)
}
〈/script〉
〈body οncοntextmenu=self.event.returnValue=false onselectstart="return false"〉
〈td width="100%"〉〈a href="javascript:open1('main.htm'),window.close()"〉〈img border="0" src="pic/blank1.gif" style="position: absolute; left: 556; top: 142" width="169" height="57"〉〈/a〉〈/td〉
〈/body〉
这样,我们就达到了打开无窗口边的网页了。并且,在这个网页中,会自动加入滚动条,这样,就不会像前面那样看不到下面的内容啦。