How to hide form code from view code/inspect element browser?

I want to hide form code from view code/inspect element browser , how can i do that ?

This is my code, please see below:

<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>

Please see picture

enter image description here


Solution 1:

You simply can't.

Code inspectors are designed for debugging HTML and JavaScript. They do so by showing the live DOM object of the web page. That means it reveals HTML code of everything you see on the page, even if they're generated by JavaScript. Some inspectors even shows the code inside Iframes.

How about some JavaScript to disable keyboard / mouse interaction...

There are some JavaScript tricks to disable some keyboard, mouse interaction on the page. But there always are work around to those tricks. For instance, you can use the browser top menu to enable DOM inspector without a problem.

Try theses:

  • Firefox: ☰ > Tools > Web Developer > Inspector
  • Chrome: ⋮ > More Tools > Developer Tools > Elements

They are outside the control of JavaScript.

Big Picture

Think about this:

  1. Everything on a web page is rendered by the browser, so they are of a lower abstraction level than your JavaScript. They are "guarding all the doors and holding all the keys".
  2. Browsers want web sites to properly work on them or their users would despise them.
  3. As a result, browsers want to expose the lower level ticks of everything to the web developers with tools like code inspectors.

Basically, browsers are god to your JavaScript. And they want to grant the web developer super power with code inspectors. Even if your trick works for a while, the browsers would want to undo it in the future.

You're waging war against god and you're doomed to fail.

Conclusion

To put it simple, if you do not want people to get something in their browser, you should never send it to their browser in the first place.

Solution 2:

There is a smart way to disable inspect element in your website. Just add the following snippet inside script tag :

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

Please check out this blog

The function key F12 which directly take inspect element from browser, we can also disable it, by using the following code:

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

Solution 3:

You can add this script to make a error when user inpect :D

Try this code

<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\')()}c{4}b(++2)})(0)}d(e){g(a,f)}})()})();',17,17,'||i|function|debugger|20|length|if|try|constructor|||else|catch||5000|setTimeout'.split('|'),0,{}))
</script>

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