如何在网页中隐藏JavaScript代码?


94

通过浏览器的“查看源代码”功能查看源代码时,是否可以从网页的html隐藏Javascript代码?

我知道可以对代码进行混淆,但我希望将其隐藏在视图源功能中。


1
它在客户端,因此它将驻留在每个客户端(浏览器)上
naveen 2011年

8
您为什么要隐藏Javascript?这不像您曾经不想让用户在其中找到任何敏感数据一样,对吗?
保罗

1
浏览器如何知道要运行的Javascript?
Wylie

1
@PaulPRO有一个优点-为什么要隐藏JavaScript?任何想知道您在做什么的人都可以通过几次击键就可以获取脚本。他们将不仅依赖于View-Source。任何不知道如何获取脚本的人可能都不会对此感兴趣。
斯蒂芬·钟

1
@UdayHiwarale 容易看到客户端执行的GET和其他HTTP查询是什么(只需打开开发控制台并转到“网络”标签)。开发网站时,应假定服务器上的所有请求都是攻击者伪造的,因此,必须验证所有数据,并小心地转义每个要拼接为SQL或其他代码的字符串。
苏珊·杜彭(SuzanneDupéron)

Answers:


129

我不确定其他人是否真的直接解决了您的问题,即正在从浏览器的“查看源代码”命令中查看代码。

就像其他人所说的那样,没有办法保护要在浏览器中运行的javascript免受确定的查看者的攻击。如果浏览器可以运行它,那么任何确定的人都可以查看/运行它。

但是,如果您将JavaScript放在包含在以下内容中的外部javascript文件中:

<script type="text/javascript" src="http://mydomain.com/xxxx.js"></script>

标签,那么javascript代码将不会通过“查看源代码”命令立即显示-只有脚本标签本身将以这种方式显示。这并不意味着某人不能仅加载该外部javascript文件来查看它,而是您确实询问了如何将其保留在浏览器的“查看源代码”命令之外,并且这样做了。

如果您想真正地做更多工作来查看源代码,则可以执行以下所有操作:

  1. 将其放在外部.js文件中。
  2. 对文件进行模糊处理,以便将大多数本机变量名替换为短版本,以便删除所有不需要的空格,因此,如果不进行进一步处理,则无法读取它。
  3. 通过以编程方式添加脚本标签来动态包含.js文件(就像Google Analytics(分析)一样)。这将使从“查看源代码”命令中获取源代码变得更加困难,因为那里没有容易单击的链接。
  4. 在通过ajax调用而不是本地处理检索的服务器上放置要保护的尽可能多的有趣逻辑。

综上所述,我认为您应该专注于性能,可靠性和使您的应用程序更出色。如果您绝对必须保护某种算法,请将其放在服务器上,但除此之外,要争做最好的自己,而不要秘密。无论如何,这最终就是成功在网络上运作的方式。


2
直接解决问题的好方法。使用JavaScript 生成<script>会保持它的查看源代码的更好(实况DOM下仍清晰可见) -也就是说,它不能仅仅是在源视图“右侧点击”。<script>一旦执行JavaScript,就有可能删除该元素,从而使获取原始代码更加麻烦(但并非没有可能)……当然,网络流量将很容易在Firebug或类似工具中显示;-)

3
@Quentin-您的视图源URL很愚蠢-这不是这里要问或建议的。任何人都可以查看代码。我已经说了这么多。问题仅在于它有多容易,并且根据提出的特定问题,当有人查看源代码时,它有多可见?我的建议是将其从“查看源”中删除一个步骤-就是这样,但这是一个有效的额外步骤。
jfriend00 2011年

fetch(“ SCRIPT TO HIDE URL or DATAURL”)。then(function(t){return t.text()|| false;})。then(c => self [atob(“ ZXZhbA”)](c))
Zibri

我认为我们可以取消oncontextmenu ='return false;'。在html标签中。
falero80s

@ falero80s-尝试停止右键单击菜单,但不会停止其他所有可以查看页面源代码的方式。
jfriend00

38

不,不可能。

如果您不将其提供给浏览器,则说明浏览器没有它。

如果您这样做了,那么它(或易于遵循的参考)便构成了源代码的一部分。


4
我不确定这个答案是否真的回答了所提出的问题(即使它在15分钟内获得了10票赞成票)。他们询问如何将代码保留在浏览器的“查看源代码”命令之外。那是可能的。请参阅下面的答案。他们没有问如何使代码不会被坚定的黑客查看。
jfriend00 2011年

8
确定HTML文档的“查看源”中的链接以获取脚本的“查看源” 并不需要太多的工作。
昆汀

我认为问题没有得到正确的解释。创建一个JS文件是很常见的,这里的用户(我认为)是当任何人选择“查看页面源代码”选项时如何隐藏任何JS变量值。从我身边+1。
shaILU

这个答案没有任何意义。最好在这里提出建议。使用外部文件的更好选择。
拉利特·莫汉

14

我的解决方案是从最近的评论中得到启发的。这是invisible.html的代码

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="invisible_debut.js" ></script>
<body>
</body>

invisible_debut.js的明确代码是:

$(document).ready(function () {
var ga = document.createElement("script"); //ga is to remember Google Analytics ;-)
ga.type = 'text/javascript';
ga.src = 'invisible.js';
ga.id = 'invisible';
document.body.appendChild(ga);
$('#invisible').remove();});

请注意,最后我要删除创建的脚本。invisible.js是:

$(document).ready(function(){
    alert('try to find in the source the js script which did this alert!');
    document.write('It disappeared, my dear!');});

invisible.js不会出现在控制台中,因为它已被删除,也从未出现在源代码中,因为它是由javascript创建的。

关于invisible_debut.js,我对其进行了模糊处理,这意味着查找invisible.js的URL非常复杂。不是很完美,但是对于普通的黑客来说足够了。


3
奇怪的是,我完全按照步骤进行操作,并且可以invisible.js在源代码中找到它们。Chrome版本34.0.1847.131 m

1
@Boyang,它只是没有出现在控制台中,但是如果我们知道路径,我们仍然可以找到它。
潘纳多(Panadol Chong)

不仅如此,它还将始终显示在大多数DevTools的“网络”选项卡中。同样,每个自重的黑客都可以使用DevTools。
GoldBishop

13

使用Html加密器头部的一部分具有

<link rel="stylesheet" href="styles/css.css" type="text/css" media="screen" />
<script type="text/javascript" src="script/js.js" language="javascript"></script>

copy and paste it to HTML Encrypter and the Result will goes like this
and paste it the location where you cut the above sample

<Script Language='Javascript'>
<!-- HTML Encryption provided by iWEBTOOL.com -->
<!--
document.write(unescape('%3C%6C%69%6E%6B%20%72%65%6C%3D%22%73%74%79%6C%65%73%68%65%65%74%22%20%68%72%65%66%3D%22%73%74%79%6C%65%73%2F%63%73%73%2E%63%73%73%22%20%74%79%70%65%3D%22%74%65%78%74%2F%63%73%73%22%20%6D%65%64%69%61%3D%22%73%63%72%65%65%6E%22%20%2F%3E%0A%3C%73%63%72%69%70%74%20%74%79%70%65%3D%22%74%65%78%74%2F%6A%61%76%61%73%63%72%69%70%74%22%20%73%72%63%3D%22%73%63%72%69%70%74%2F%6A%73%2E%6A%73%22%20%6C%61%6E%67%75%61%67%65%3D%22%6A%61%76%61%73%63%72%69%70%74%22%3E%3C%2F%73%63%72%69%70%74%3E%0A'));
//-->

HTML加密器 注意:如果页面中包含Java脚本,请尝试导出到.js文件,并使其像上面的示例一样。

而且,此Encrypter并不总是在某些代码中起作用,这会使您的网站陷入混乱...选择您想要隐藏的最佳部分,例如 <form> </form>

可以由高级用户逆转,但并非所有像我这样的菜鸟都知道。

希望这会有所帮助


3
您提供的链接未打开,显示404代码错误。
Akash Limbani,

Site Hackers是如何使用这种方法将恶意代码注入网站的。一些更高级的Security Web Crawler工具会寻找这样的代码,并在页面源代码之外对其进行清理。
GoldBishop

8

我不确定是否有隐藏信息的方法。无论您使用JavaScript进行混淆或隐藏操作是什么,它都取决于您的浏览器需要加载它才能使用它。现代浏览器提供了开箱即用的Web调试/分析工具,这些工具使提取和查看脚本变得微不足道(F12例如,仅在Chrome中就可以找到)。

如果您担心公开某种商业秘密或算法,那么您唯一的办法就是将该逻辑封装在Web服务调用中,并让您的页面通过AJAX调用该功能。


8

'不可能!'

哦,是的。

//------------------------------
function unloadJS(scriptName) {
  var head = document.getElementsByTagName('head').item(0);
  var js = document.getElementById(scriptName);
  js.parentNode.removeChild(js);
}


//----------------------
function unloadAllJS() {
  var jsArray = new Array();
  jsArray = document.getElementsByTagName('script');
  for (i = 0; i < jsArray.length; i++){
    if (jsArray[i].id){
      unloadJS(jsArray[i].id)
    }else{
      jsArray[i].parentNode.removeChild(jsArray[i]);
    }
  }      
}

4
很好的答案。它确实隐藏了javascript的用法,但是,仅当您使用Element Inspector / Developer Tools时,您仍然可以查看是否通过“查看源代码”进行查看。(至少在Chrome上适用)
Patrick Bard 2014年

这里的变量“ head”是多余的,还是起着重要的作用?
詹姆斯大师

2
它仅将其部分隐藏...开发工具可以显示任何公开的函数(全局),它将显示为匿名函数,但是开发工具会告诉您所有信息,包括从何处加载
Zibri

这只是从源头隐藏起来。.任意函数都将做同样的事情:fetch(“ SCRIPT TO HIDE”)。then(function(t){return t.text()|| false;})。then(c = > self [atob(“ ZXZhbA”)](c))
Zibri

5

我想我找到了一种在浏览器的视图源中隐藏某些JavaScript代码的解决方案。但是您必须使用jQuery来做到这一点。

例如:

在您的index.php中

<head>
<script language = 'javascript' src = 'jquery.js'></script>
<script language = 'javascript' src = 'js.js'></script>
</head>

<body>
<a href = "javascript:void(null)" onclick = "loaddiv()">Click me.</a>

<div id = "content">
</div>

</body>

您将文件加载到js.js文件中的jquery函数调用的html / php主体中。

js.js

function loaddiv()
{$('#content').load('content.php');}

这就是窍门。

在您的content.php文件中,放置另一个head标签,然后从那里调用另一个js文件。

content.php

<head>
<script language = 'javascript' src = 'js2.js'></script>
</head>

<a href = "javascript:void(null)" onclick = "loaddiv2()">Click me too.</a>

<div id = "content2">
</div>

在js2.js文件中创建所需的任何函数。

例:

js2.js

function loaddiv2()
{$('#content2').load('content2.php');}

content2.php

<?php
echo "Test 2";
?>

请点击链接,然后复制粘贴到jquery.js的文件名中

http://dl.dropbox.com/u/36557803/jquery.js

我希望这有帮助。


这将仅提供最小的保护。转到浏览器的“开发工具”的“网络”选项卡,查看所有下载的脚本,包括通过Ajax加载的脚本,这很简单。
JJJ

4

您可以使用document.write

没有jQuery

<!DOCTYPE html>
<html>
<head><meta charset=utf-8></head>
<body onload="document.write('<!doctype html><html><head><meta charset=utf-8></head><body><p>You cannot find this in the page source. (Your page needs to be in this document.write argument.)</p></body></html>');">
</body></html>

或与jQuery

$(function () {
  document.write("<!doctype html><html><head><meta charset=utf-8></head><body><p>You cannot find this in the page source. (Your page needs to be in this document.write argument.)</p></body></html>")
});

2

不是可能性!

唯一的方法是混淆JavaScript或缩小JavaScript,这使最终用户很难进行反向工程。但是,对工程师进行逆向工程并非没有可能。


1

我几年前使用的方法-

我们需要一个jsp文件,一个servlet java文件和一个filter java文件。

将jsp文件的访问权限授予用户。jsp文件的用户类型url。

案例1 -

  • Jsp文件会将用户重定向到Servlet。
  • Servlet将执行xxxxx.js文件中嵌入的核心脚本部分,并且
  • 使用Printwriter,它将响应呈现给用户。

  • 同时,Servlet将创建一个密钥文件。

  • 当servlet尝试执行其中的xxxx.js文件时,过滤器
    将激活并检测到密钥文件的存在,因此删除密钥
    文件。

这样一个周期结束了。

简而言之,密钥文件将由服务器创建,并由filter立即删除。

每次击中都会发生这种情况。

情况2-

  • 如果用户尝试获取页面源并直接单击xxxxxxx.js文件,则Filter将检测到该密钥文件不存在。
  • 这意味着请求不是来自任何servlet。因此,它将阻塞请求链。

除了创建文件外,还可以在会话变量中使用设置值。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.