Como ocultar ou ofuscar o conteúdo do JS na página

Quem já escreveu algum js com requisições ajax sabe que, vez ou outra, é necessário fazer referencias explicitas à páginas, variáveis e outros conteúdos que não seriam de bom grado caíssem em mãos malvadas. Nunca é demais um proteçãozinha extra (não digo aqui que o 'truque' adiante seja o método mais seguro, mas também, não é dos mais tolos) quando o assunto é dados vulneráveis em nossos sistemas web.

Segue adiante uma dica de como podemos ocultar ('proteger') nosso js para que seu conteúdo não fique exposto à leitura de quantos queiram. E, para os amantes do código arreganhado, não trata-se de uma ação 'CodeEgoíca' (neologismo, nenhuma referencia no google até hoje hehehe), uma vez que não impede o desenvolvedor do código 'protegido' de participar, querendo, de comunidades voltadas ao compartilhamento de conhecimento, e lá, auxiliar ativamente a outros a desenvolverem seus próprios códigos.

Javascript é uma linguagem de programação do lado do cliente (isso vocês já sabem), ele roda (é executado) na máquina do cara que tá cessando sistema web, o site etc.. Assim sendo, não se pode, efetivamente, 'esconder' algo que esteja ai, na sua máquina.

Ocultar ou ofuscar seu o script (código) é uma boa solução, mas não é suficiente, porque, embora torne o processo mais complicado, algum mal intencionado sempre acaba decifrando o que quer decifrar, e aqui, não sejamos ingênuos, os ninjas entram nas máquinas do governo americano, de bancos referencia em segurança digital, imagina no teu scriptzinho 'protegido'.

Não desanime, mesmo com essas injeção de desanimo, existem algumas soluções para deixar seu código ofuscado, 'oculto', difícil de ser roubado (eita! aqui é osso). Mas lembrem-se, como eu disse, nada é 100% em se tratando de segurança digital.

Bem!, assim de cabeça, uma primeira ideia é restringir o acesso aos seus arquivos .js externos. Aqueles que você escreveu o código e esta chamando na index pela tag '<script type="text/javascript" src="exemplo.js"></script>'. Supomos que alguém tente acessar o 'exemplo.js' pelo navegador, e ao fazê-lo ele não deverá visualizar seu conteúdo, mas sim, uma mensagem de erro.

Se sua página é escrita em PHP, pode incluir o script através da função 'include' e deixar o php decidir se é seguro mostrar o código. Para este exemplo, você vai precisar que seus arquivos .js externos estejam escritos em php 'exemplo.php', e neles, conter o código abaixo antes do 'echo' com o código em js:

Vejamos:

<?php
//esse código vai dentro, e logo no início, do arquivo 'exemplo.php' (que é o arquivo que contém o código js, não vamos confundir tudo)

//pode alterar de acordo com a necessidade

$URL = $_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
if ($URL != "meudominio.br/index.php")
die("/\*sry, tipo sem direito de acesso\*/");
?>

...

<script type="text/javascript">

//essa tag de chamada js vai dentro do arquivo index.php (arquivo que chama o js, que em nosso caso é o 'exemplo.php')

<?php include "exemplo.php"; ?>;

</script>

Desta forma, apenas o navegador poderá ver o conteúdo do arquivo js.

Outra ideia interessante é que no final do seu script js, você apague seu conteúdo excluindo o elemento dom, de modo que após o navegador ler o código, o código desapareça:

<script id="codigoJs" type="text/javascript">

//seu código js aqui

//apaga o elemento script com o código após a leitura do mesmo pelo browser

document.getElementById('codigoJs').innerHTML = "";

</script>

Estes são hack's simples que não podem, e eu já falei antes, proteger totalmente seu código js, mas com certeza, pode irritar alguém que está tentando 'ler' o seu código.

Espero ter ajudado.

Abraço a todos!