如何从视图代码/检查元素浏览器中隐藏表单代码？

Posted

技术标签:

【中文标题】如何从视图代码/检查元素浏览器中隐藏表单代码？【英文标题】：How to hide form code from view code/inspect element browser? 【发布时间】：2014-08-10 18:28:36 【问题描述】：

我想从查看代码/检查元素浏览器中隐藏表单代码，我该怎么做？

这是我的代码，请看下面：

<div style=" text-align: center;  padding: 300px; font-family: lato; ">
     Please wait redirect page ......<br>
    <img src="http://maps.nrel.gov/sites/all/modules/custom_modules/hydra/assets/images/loading_bar.gif" border="0">
</div>


<form name="f1" action="payments.php" method="post">
<input type="hidden" name="id_crad" value="...">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="amount" value="12.99">
</form>


<script type="text/javascript">
setTimeout(function()f1.submit();, 3000);
</script>

请看图

【问题讨论】：

我认为这是不可能的，除非您使用的是编译语言（例如，Java Web 小程序、Flash [易于反编译] 等）。 你不能。谢天谢地。您真的想失去查看网站对您的影响的能力吗？ 您可以通过不在任何网页中包含代码来轻松隐藏代码以防窥探。 RobG --- 请展示示例 你不能隐藏它，你的浏览器已经显示了它可以做什么。为什么不把这些值放在服务器上 【参考方案1】：

你根本做不到。

代码检查器是为调试 html 和 JavaScript 而设计的。他们通过显示网页的实时 DOM 对象来做到这一点。这意味着它会显示您在页面上看到的所有内容的 HTML 代码，即使它们是由 JavaScript 生成的。一些检查员甚至在 Iframe 中显示代码。

用一些 JavaScript 来禁用键盘/鼠标交互怎么样...

有一些 JavaScript 技巧可以禁用页面上的某些键盘、鼠标交互。但是总是可以解决这些技巧。例如，您可以使用浏览器顶部菜单毫无问题地启用 DOM 检查器。

试试这些：

火狐：☰ > Tools > Web Developer > Inspector 铬：⋮ > More Tools > Developer Tools > Elements

它们不在 JavaScript 的控制范围内。

大图

想一想：

    网页上的所有内容都是由浏览器呈现的，因此它们的抽象级别低于您的 JavaScript。他们“守着所有的门，握着所有的钥匙”。 浏览器希望网站正常运行，否则用户会鄙视它们。 因此，浏览器希望使用代码检查器等工具向 Web 开发人员公开 everything 的较低级别的刻度。

基本上，浏览器是 JavaScript 的神。他们希望通过代码检查器授予 Web 开发人员超能力。即使您的技巧在一段时间内有效，浏览器也希望在将来撤消它。

你在与上帝作战，你注定要失败。

结论

简单地说，如果您不希望人们在他们的浏览器中获取某些内容，那么您应该从不首先将其发送到他们的浏览器。

【讨论】：

这是一个绝对的声明。 据我所知，该绝对陈述是正确的。有一些 javascript 技巧可以禁用页面上的某些键盘、鼠标交互。但总是有解决这些技巧的方法。例如，您可以使用浏览器顶部菜单毫无问题地启用 DOM 检查器。 简单地说，如果您不希望人们在他们的浏览器中获取某些内容，那么您一开始就不应该将其发送到他们的浏览器。 下面@dihak 的回答似乎可以解决问题 @AhmedAbuthwabah：您可以查看 cmets 的答案。并非所有浏览器都“支持”该解决方法。而且由于它不是浏览器的预期“功能”，您不应该期望它继续在那些“支持”它的浏览器上运行，正如我在“大图”中所描述的那样，【参考方案2】：

有一种聪明的方法可以在您的网站中禁用检查元素。只需在脚本标签中添加以下 sn-p ：

$(document).bind("contextmenu",function(e) 
 e.preventDefault();
);

请查看此blog

直接从浏览器获取inspect元素的功能键F12，我们也可以禁用它，使用如下代码：

$(document).keydown(function(e)
    if(e.which === 123)
       return false;
    
);

【讨论】：

它只禁用右键和检查元素选项，将允许f12并直接从浏览器中获取检查元素，现实是你不能禁用它。 好吧，如果我们可以禁用所有关键事件，那么这是可能的。只需尝试以下代码。 $('*').off('keyup keydown keypress'); 这不是正确的方法，永远不要限制我们代码中的任何键事件，用户可能会将这些键用于其他目的，所以我们不能这样做。另外，如果我们禁用键事件使用您提供的代码，我们也可以直接从浏览器中获取检查元素，这是浏览器提供的功能，我们如何限制它？？ 您仍然可以从菜单中打开 Chrome 检查器。一文不值。 Ctrl + Shift+ i 怎么样？【参考方案3】：

此代码在调试器打开时从 dom 中删除元素的内部 html（在 Chrome 和 IE 中测试）

var currentInnerHtml;
var element = new Image();
var elementWithHiddenContent = document.querySelector("#element-to-hide");
var innerHtml = elementWithHiddenContent.innerHTML;

element.__defineGetter__("id", function() 
    currentInnerHtml = "";
);

setInterval(function() 
    currentInnerHtml = innerHtml;
    console.log(element);
    console.clear();
    elementWithHiddenContent.innerHTML = currentInnerHtml;
, 1000);

这里#element-to-hide 是您要隐藏的元素的ID。 这是一个黑客，但我希望它可以帮助你。

【讨论】：

【参考方案4】：

您可以使用以下标签

<body oncontextmenu="return false"><!-- your page body hear--></body>

或者您可以在右键单击时创建自己的菜单：

https://github.com/swisnl/jQuery-contextMenu

【讨论】：

【参考方案5】：

你不能阻止用户看到我们的代码，但你可以通过禁用一些键来避免它

只要你可以&lt;body oncontextmenu="return false" onkeydown="return false;" onmousedown="return false;"&gt;&lt;!--Your body context--&gt; &lt;/body&gt;

执行此操作后，以下键会自动禁用

1. Ctrl + Shift + U 2. Ctrl + Shift + C 3. Ctrl + Shift + 我 4.鼠标右键 5. F12键

【讨论】：

【参考方案6】：

虽然我认为没有办法完全做到这一点，但您可以采取一些措施来阻止几乎所有人查看 HTML。

您可以首先尝试通过执行以下操作来停止检查菜单：

<body oncontextmenu="return false" onkeydown="return false;" onmousedown="return false;">

我还建议使用 Jonas 给出的方法，即使用他的 javascript 并将您不希望人们看到的内容放入 div em> 与 id="element-to-hide" 和他给定的 js 脚本进一步阻止人们检查。

我很确定要克服这一点非常困难。但随后有人可以输入 view-source:www.exapmle.com 并显示来源。因此，您可能会想要加密 HTML（我建议使用为您提供扩展安全选项的网站）。有很多不错的网站免费提供此功能（例如：http://www.smartgb.com/free_encrypthtml.php）并使用您通常无法通过 HTML 解密器解密的扩展安全性。

这基本上会加密你的 HTML，所以如果你使用我上面展示的方法查看源代码，你只会得到加密的 HTML（如果你使用扩展的安全选项，这也很难解密）。但是您可以通过检查查看未加密的 HTML，但我们已经阻止了它（在非常合理的程度上）

好的，所以你不能完全隐藏 HTML，但你可以做得非常好 阻止人们看到它的工作。（如果你想想大多数人 不关心查看页面的 HTML，有些人甚至不知道 关于检查和查看源以及可能这样做的人 不会被打扰或无法克服这些影响！所以 可能没有人会看到你的 HTML）

（希望这会有所帮助！）

【讨论】：

【参考方案7】：

虽然我认为没有办法完全做到这一点，但您可以采取一些措施来阻止几乎所有人查看 HTML。

您可以首先尝试通过执行以下操作来停止检查菜单：

我还建议使用 Jonas 给出的方法，即使用他的 javascript 并将您不希望人们看到的内容放入 id="element-to-hide" 的 div 和他给定的 js 脚本中，以进一步阻止人们进行检查。

我很确定要克服这一点非常困难。但是随后有人可以键入 view-source:www.exapmle.com ，这将向他们显示来源。因此，您可能会想要加密 HTML（我建议使用为您提供扩展安全选项的网站）。有很多不错的网站免费提供此功能（例如：http://www.smartgb.com/free_encrypthtml.php）并使用您通常无法通过 HTML 解密器解密的扩展安全性。

这基本上会加密你的 HTML，所以如果你使用我上面展示的方法查看源代码，你只会得到加密的 HTML（如果你使用扩展的安全选项，这也很难解密）。但是您可以通过检查查看未加密的 HTML，但我们已经阻止了它（在非常合理的程度上）

【讨论】：

【参考方案8】：

虽然我认为没有办法完全做到这一点，但您可以采取一些措施来阻止几乎所有人查看 HTML。

您可以首先尝试通过执行以下操作来停止检查菜单：

我还建议使用 Jonas 给出的使用他的 javascript 的方法，并将你不希望人们看到的内容放在 id="element-to-hide" 的 div 和他给定的 js 脚本中，以进一步阻止人们进行检查。

我很确定要克服这一点非常困难。但是有人可以输入 view-source

这基本上会加密你的 HTML，所以如果你使用我上面展示的方法查看源代码，你只会得到加密的 HTML（如果你使用扩展的安全选项，这也很难解密）。但是您可以通过检查查看未加密的 HTML，但我们已经阻止了它（在非常合理的程度上）

【讨论】：

【参考方案9】：

您可以添加此脚本以在用户检查时出错：D

试试这个代码

<script type="text/javascript">
eval(function(p,a,c,k,e,d)e=function(c)return c.toString(36);if(!''.replace(/^/,String))while(c--)d[c.toString(a)]=k[c]||c.toString(a)k=[function(e)return d[e]];e=function()return'\\w+';c=1;while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])return p('(3()(3 a()8(3 b(2)7((\'\'+(2/2)).6!==1||2%5===0)(3()).9(\'4\')()c4b(++2))(0)d(e)g(a,f))())();',17,17,'||i|function|debugger|20|length|if|try|constructor|||else|catch||5000|setTimeout'.split('|'),0,))
</script>

来自http://www.bloggerku.com/2017/08/memasang-anti-inspect.html

【讨论】：

我在尝试检查元素时已经在网站上遇到了这个问题。 (function() ).constructor('debugger')() 和 setTimeout 成功了? 不适用于 Chrome。它确实显示错误，但可以轻松查看和编辑检查元素。 检查来源有困难，但并非不可能。但我通过这段代码禁用了 indexedDB。 我看到一些网站隐藏了他们的 m3u8 他们怎么能这样做？【参考方案10】： 

<script>
document.onkeydown = function(e) 
if(event.keyCode == 123) 
return false;

if(e.ctrlKey && e.keyCode == 'E'.charCodeAt(0))
return false;

if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0))
return false;

if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0))
return false;

if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0))
return false;

if(e.ctrlKey && e.keyCode == 'S'.charCodeAt(0))
return false;

if(e.ctrlKey && e.keyCode == 'H'.charCodeAt(0))
return false;

if(e.ctrlKey && e.keyCode == 'A'.charCodeAt(0))
return false;

if(e.ctrlKey && e.keyCode == 'E'.charCodeAt(0))
return false;


</script>

试试这个代码

【讨论】：

【参考方案11】：

下面的 JavaScript 代码为我禁用了检查元素。 

// Disable inspect element
$(document).bind("contextmenu",function(e) 
 e.preventDefault();
);
$(document).keydown(function(e)
    if(e.which === 123)
       return false;
    
);

【讨论】：

以上代码只禁用右键和F12键？【参考方案12】：

如果有人感兴趣，您可以在提交后从 DOM 中删除表单节点，并且使用检查器将不会出现该节点。

https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove

【讨论】：

【参考方案13】：

您可以使用此代码-

阻止右键单击 -

<body oncontextmenu="return false;">

Block Keys - 你应该在 body 标签的上方使用它。 （在head标签中使用）

<script>

    document.onkeydown = function (e) 
        if (event.keyCode == 123) 
            return false;
        
        if (e.ctrlKey && e.shiftKey && (e.keyCode == 'I'.charCodeAt(0) || e.keyCode == 'i'.charCodeAt(0))) 
            return false;
        
        if (e.ctrlKey && e.shiftKey && (e.keyCode == 'C'.charCodeAt(0) || e.keyCode == 'c'.charCodeAt(0))) 
            return false;
        
        if (e.ctrlKey && e.shiftKey && (e.keyCode == 'J'.charCodeAt(0) || e.keyCode == 'j'.charCodeAt(0))) 
            return false;
        
        if (e.ctrlKey && (e.keyCode == 'U'.charCodeAt(0) || e.keyCode == 'u'.charCodeAt(0))) 
            return false;
        
        if (e.ctrlKey && (e.keyCode == 'S'.charCodeAt(0) || e.keyCode == 's'.charCodeAt(0))) 
            return false;
        
    
</script>

【讨论】：

这对我有用，它甚至禁用了浏览器上的 Inspect Element。【参考方案14】：

我为你的问题做了一些挖掘，发现PwnFunction的一个有趣的想法。

如果您可以将完整的代码放入您的 CSS 文件中。然后我们可以使用响应标头“Link”将您的 CSS 文件链接到您对网站的请求。

根据 MDN 文档：

HTTP 标头让客户端和服务器传递附加信息 带有 HTTP 请求或响应。一个 HTTP 标头由它的 不区分大小写的名称后跟冒号 (:)，然后是其值。 忽略值之前的空格。

Link 实体头字段提供了一种序列化一个或多个 HTTP 标头中的链接。它在语义上等同于 HTML 链接 元素。

因此，此标头可以将您的样式表链接到您的 HTTP 请求。所以后端会发生什么，每当有人试图“检查元素”你的源代码时，他们会看到你的 HTML 代码的空白页。但他们仍然可以在开发人员工具中看到指向您的样式表的链接。

【讨论】：

以上是关于如何从视图代码/检查元素浏览器中隐藏表单代码？的主要内容，如果未能解决你的问题，请参考以下文章

单击时检查表单中是不是存在不显示的元素

PHP - 如何在提交后隐藏表单

从视图中的表单读取文件输入时总是出错

通过表单身份验证从代码隐藏模拟用户

如何从动态元素发布表单

局部视图表单上的 HiddenFor 不包含任何元素