Test Foro de elhacker.net SMF 2.1

Programación => Desarrollo Web => Mensaje iniciado por: tecasoft en 5 Marzo 2013, 19:59 PM

Título: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 5 Marzo 2013, 19:59 PM
estoy haciendo un teclado virtual para evitar los keyloggers, y necesito saber komo dirigir las teclas hacia los campos usuario y contraseña, es decir, un poco de javascript para calentar motores, ya que estoy un poco atascado a la hora de EJEMPLO: seleccionar el campo "usuario" y luego elcampo "contraseña", es decir seleccionarlos con el raton y que se pueda escribir desde el teclado virtual, que hasta ahora escribo pero nose cambiar del campo "text" al campo "password", eso es....


<?php
session_start
();

session_destroy();

$_SESSION['usuario1'] = "";
$_SESSION['contrasena'] = "";

?>


<html>
<head>
<meta http-equiv='last-modified' content='0'>
<meta http-equiv='cache-Control' content='no-cache, mustrevalidate'>
<meta http-equiv='pragma' content='no-cache'>
<meta http-equiv='expires' content='-1'>

<meta charset="utf-8">
<title>Tecasoft.com | Area de clientes</title>
<link href="css/smoothness/jquery-ui-1.9.2.custom.css" rel="stylesheet">
<script src="js/jquery-1.8.3.js"></script>
<script src="js/jquery-ui-1.9.2.custom.js"></script>

<link rel="shortcut icon" type="image/x-icon" href="http://www.tecasoft.com/imagenes/favicon.ico" />

<link rel="StyleSheet" type="text/css" href="http://www.tecasoft.com/css/estilos.css">

</head>
<body>

<div id="contenedor">
<center>

<div id="cabecera">

<div id="logo">

<a href="http://www.tecasoft.com"><img src="http://www.tecasoft.com/imagenes/logotipo.png" border="0" width="270" height="90" alt="Tecasoft.com, servicio informatico"></a>

</div>

<div id="anexo">

<a href="http://www.tecasoft.com/clientes/anexo.php" class="anexo" title="Cambiar idioma">Español (Cambiar ▼)</a>

</div>

</div>

<!-- Menu navegador -->

<div id="navegador">






</div>

<!-- El contenido central -->

<div id="contenido">

<h1 class="naranja">Inicie Sesión</h1>

<form action="login.php" method="post" name="form1">

<label for="usuario">Usuario:</label>
<input type="text" name="usuario" id="usuario" class="text ui-widget-content ui-corner-all" readonly>
&nbsp;&nbsp;&nbsp;
<label for="contrasena">Contraseña:</label>
<input type="password" name="contrasena" id="contrasena" class="text ui-widget-content ui-corner-all"><br><br>



<input type="button" class="boton" id="1" value="1">
<input type="button" class="boton" id="2" value="2">
<input type="button" class="boton" id="3" value="3">
<input type="button" class="boton" id="4" value="4">
<input type="button" class="boton" id="5" value="5">
<input type="button" class="boton" id="6" value="6">
<input type="button" class="boton" id="7" value="7">
<input type="button" class="boton" id="8" value="8">
<input type="button" class="boton" id="9" value="9">
<input type="button" class="boton" id="0" value="0">
<br>

<!-- Cambia a mayusculas y minusculas -->
<input type="button" class="boton" value="Bloq.Mayus">
<!-- End -->

<input type="button" class="boton" value="Q">
<input type="button" class="boton" value="W">
<input type="button" class="boton" value="E">
<input type="button" class="boton" value="R">
<input type="button" class="boton" value="T">
<input type="button" class="boton" value="Y">
<input type="button" class="boton" value="U">
<input type="button" class="boton" value="I">
<input type="button" class="boton" value="O">
<input type="button" class="boton" value="P">
<br>
<input type="button" class="boton" value="A">
<input type="button" class="boton" value="S">
<input type="button" class="boton" value="D">
<input type="button" class="boton" value="F">
<input type="button" class="boton" value="G">
<input type="button" class="boton" value="H">
<input type="button" class="boton" value="J">
<input type="button" class="boton" value="K">
<input type="button" class="boton" value="L">
<input type="button" class="boton" value="Ñ">
<br>
<input type="button" class="boton" value="Z">
<input type="button" class="boton" value="X">
<input type="button" class="boton" value="C">
<input type="button" class="boton" value="V">
<input type="button" class="boton" value="B">
<input type="button" class="boton" value="N">
<input type="button" class="boton" value="M">
<input type="button" class="boton" value="-">
<input type="button" class="boton" value="_">
<input type="button" class="boton" value="@">
<input type="button" class="boton" value="#">

<br><br>
<a href="" class="anexo">¿Has olvidado tu contraseña?</a>
&nbsp;&nbsp;&nbsp;
<input type="submit" class="boton" value="Iniciar sesión">
</form>
</div>

<!-- Pie Pagina -->

<div id="pie">

<hr>

<div id="pie-izq">

<a href="http://www.tecasoft.com/legal.html" class="pie-izq" title="Condiciones Generales de Contratación">Legal &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/proteccion-de-datos.html" class="pie-izq" title="Protección de datos personales">Proteccion de datos &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/central-de-soporte.html" class="pie-izq" title="Documentación de ayuda">Central de soporte &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/sitemap.html" class="pie-izq" title="Todos los enlaces web">Mapa web &nbsp;|&nbsp;</a>
<span class="pie-izq">Rotacion soporte:  &nbsp;|&nbsp;</span>
<span class="pie-izq">Hora: </span>


</div>

<div id="pie-der">

<a href="http://www.tecasoft.com/empresas-grupo.html" class="pie-der" title="Nuestro grupo empresarial">Empresas del grupo: anonimo S.L</a>


</div>

<br><br>

</div>





</center>

</div>

<script type="text/javascript" >
$(".boton").button();
</script>

<script type="text/javascript" >

$("input#1").click(function(){
document.form1.usuario.value=document.form1.usuario.value+1;
});

$("input#2").click(function(){
document.form1.usuario.value=document.form1.usuario.value+2;
});

</script>

</body>
</html>


x cierto me faltan las minusculas pero no me importa de momento*, muchas gracias x contestar
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: Ori-chan en 5 Marzo 2013, 22:03 PM
Interesante. Cuando haga mi pagina web pondré esto seguro.
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: MCKSys Argentina en 5 Marzo 2013, 22:26 PM
Porque no examinas el teclado que ofrecen los bancos?

Te dejo un link que tiene teclado virtual implementado con JS: https://www.accessbanking.com.ar/RetailHomeBankingWeb/access.do (https://www.accessbanking.com.ar/RetailHomeBankingWeb/access.do)

Hay varios .js que estan trabajando, pero parece estar bastante modularizado.

Saludos!
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 5 Marzo 2013, 22:59 PM
estoy buscando en la web y no encuentro nada, es mucho codigo, hecharme una mano por favor
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: MCKSys Argentina en 5 Marzo 2013, 23:14 PM
Fijate teclado.js (https://www.accessbanking.com.ar/bkb/js/teclado.js (https://www.accessbanking.com.ar/bkb/js/teclado.js))

Luego es custeion de seguir analizando el codigo...

Saludos!

PD: Opera trae incorporado un analizador de los elemtnos de la pagina. Seguro que hay algo parecido para otros navegadores, pero uso Opera solamente.
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 5 Marzo 2013, 23:26 PM
ya lo examine y no encuentro nada para que me bloquee el teclado fisico
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: MCKSys Argentina en 5 Marzo 2013, 23:37 PM
Creo que la idea no es bloquear el teclado fisico (no creo que desde un navegador lo puedas hacer) sino permitirle al usuario ingresar texto sin usar el mismo.

No se mucho JS, pero se me ocurre que cada vez que un texto sea modificado usando el teclado, se podria borrar el mismo, con lo que obtendria una especie de "bloqueo".
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 5 Marzo 2013, 23:39 PM
y como hago eso, es decir para bloquearlo, afectaria algo al usuario¿?

encontre esta chapucilla que no me soluciona nada


<script language="javascript">function tecla(){alert('EL TECLADO BLOQUEADO')}; document.onkeydown=tecla;</script>
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: daryo en 5 Marzo 2013, 23:43 PM
si que tal si no es un input type=text sino simplemente un cuadrado que se le van dibujando letras con el teclado virtual, y la info la almacene en una variable en js o en un input hidden

solo es una idea
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: MCKSys Argentina en 5 Marzo 2013, 23:45 PM
Cita de: tecasoft en  5 Marzo 2013, 23:39 PM
y como hago eso, es decir para bloquearlo, afectaria algo al usuario¿?

Afectaria en que no podria ingresar texto usando el teclado normal.

Fijate este link: http://stackoverflow.com/questions/1948332/detect-all-changes-to-a-input-type-text-immediately-using-jquery (http://stackoverflow.com/questions/1948332/detect-all-changes-to-a-input-type-text-immediately-using-jquery)

Cita de: daryo en  5 Marzo 2013, 23:43 PM
si que tal si no es un input type=text sino simplemente un cuadrado que se le van dibujando letras con el teclado virtual, y la info la almacene en una variable en js o en un input hidden

solo es una idea

Y muy buena, por cierto!

Como te dije antes, mis conocimientos son en programacion general, no en JS. Hay mucho que no conozco sobre el tema...

Saludos!
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 5 Marzo 2013, 23:50 PM
siento ser tan torpe me lo podrias explicar lo del link, es que soy un poco patosillo con JS
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: EFEX en 6 Marzo 2013, 00:53 AM
https://github.com/Mottie/Keyboard
Demo
http://mottie.github.com/Keyboard/index.html

Hablan de 'dibujar' tu contraseña e interpretarlo con js ? o entendi mal
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: MCKSys Argentina en 6 Marzo 2013, 00:58 AM
A ver, volviendo al tema, estuve mirando un poco de codigo JS y encontre que, por ej., en TU codigo tienes:

Código (javascript) [Seleccionar]

<input type="button" class="boton" value="#">


Si cambias esa linea por

Código (javascript) [Seleccionar]

<input type="button" class="boton" value="#" onclick="tecla(this.value)">

Fijate que solo agrega la parte de "onclick..."

Y ademas agregas la siguiente función:

Código (javascript) [Seleccionar]

<script type="text/javascript">
function tecla(valor){
    document.forms["form1"]["usuario"].value += valor;
}
</script>


Veras que cada vez que presionas el boton, se copia el valor del parametro "value" en el texto dado (en este caso "usuario").

Si agregas el codigo "onclick..." a todos los botones (el mismo codigo funcina para todos), podras escribir en el texto sin usar el teclado.

De todas formas, lo que estoy poniendo, sale de una busuqeda en Google: http://www.google.com.ar/search?q=how+to+create+a+virtual+keyboard+using+javascript&ie=utf-8&oe=utf-8 (http://www.google.com.ar/search?q=how+to+create+a+virtual+keyboard+using+javascript&ie=utf-8&oe=utf-8)
Título: Re: teclado virtual para evitar los keyloggers
Publicado por: tecasoft en 8 Marzo 2013, 21:52 PM
y para seleccionar el campo usuario y password y que escriban como lo hago e probado con esto pero no da resultado:


<?php
session_start
();

session_destroy();

$_SESSION['usuario1'] = "";
$_SESSION['contrasena'] = "";

?>


<html>
<head>
<meta http-equiv='last-modified' content='0'>
<meta http-equiv='cache-Control' content='no-cache, mustrevalidate'>
<meta http-equiv='pragma' content='no-cache'>
<meta http-equiv='expires' content='-1'>

<meta charset="utf-8">
<title>Tecasoft.com | Area de clientes</title>
<link href="css/smoothness/jquery-ui-1.9.2.custom.css" rel="stylesheet">
<script src="js/jquery-1.8.3.js"></script>
<script src="js/jquery-ui-1.9.2.custom.js"></script>

<link rel="shortcut icon" type="image/x-icon" href="http://www.tecasoft.com/imagenes/favicon.ico" />

<link rel="StyleSheet" type="text/css" href="http://www.tecasoft.com/css/estilos.css">

<!--<script language="javascript">
function tecla(){
document.form1.contrasena.value="";
}
document.onkeydown=tecla;
</script>-->

</head>
<body>

<div id="contenedor">
<center>

<div id="cabecera">

<div id="logo">

<a href="http://www.tecasoft.com"><img src="http://www.tecasoft.com/imagenes/logotipo.png" border="0" width="270" height="90" alt="Tecasoft.com, servicio informatico"></a>

</div>

<div id="anexo">

<a href="http://www.tecasoft.com/clientes/anexo.php" class="anexo" title="Cambiar idioma">Español (Cambiar ▼)</a>

</div>

</div>

<!-- Menu navegador -->

<div id="navegador">






</div>

<!-- El contenido central -->

<div id="contenido">

<h1 class="naranja">Inicie Sesión</h1>

<form action="login.php" method="post" name="form1">

<label for="usuario">Usuario:</label>
<input type="text" name="usuario" id="usuario" maxlength="15" class="text ui-widget-content ui-corner-all">
&nbsp;&nbsp;&nbsp;
<label for="contrasena">Contraseña:</label>
<input type="password" name="contrasena" id="contrasena" maxlength="15" class="text ui-widget-content ui-corner-all"><br><br>



<input type="button" class="boton" id="1" value="1" onclick="tecla(this.value)">
<input type="button" class="boton" id="2" value="2" onclick="tecla(this.value)">
<input type="button" class="boton" id="3" value="3" onclick="tecla(this.value)">
<input type="button" class="boton" id="4" value="4">
<input type="button" class="boton" id="5" value="5">
<input type="button" class="boton" id="6" value="6">
<input type="button" class="boton" id="7" value="7">
<input type="button" class="boton" id="8" value="8">
<input type="button" class="boton" id="9" value="9">
<input type="button" class="boton" id="0" value="0">
<br>

<!-- Cambia a mayusculas y minusculas -->
<input type="button" class="boton" value="Bloq.Mayus">
<!-- End -->

<input type="button" class="boton" value="Q">
<input type="button" class="boton" value="W">
<input type="button" class="boton" value="E">
<input type="button" class="boton" value="R">
<input type="button" class="boton" value="T">
<input type="button" class="boton" value="Y">
<input type="button" class="boton" value="U">
<input type="button" class="boton" value="I">
<input type="button" class="boton" value="O">
<input type="button" class="boton" value="P">
<br>
<input type="button" class="boton" value="A">
<input type="button" class="boton" value="S">
<input type="button" class="boton" value="D">
<input type="button" class="boton" value="F">
<input type="button" class="boton" value="G">
<input type="button" class="boton" value="H">
<input type="button" class="boton" value="J">
<input type="button" class="boton" value="K">
<input type="button" class="boton" value="L">
<input type="button" class="boton" value="Ñ">
<br>
<input type="button" class="boton" value="Z">
<input type="button" class="boton" value="X">
<input type="button" class="boton" value="C">
<input type="button" class="boton" value="V">
<input type="button" class="boton" value="B">
<input type="button" class="boton" value="N">
<input type="button" class="boton" value="M">
<input type="button" class="boton" value="-">
<input type="button" class="boton" value="_">
<input type="button" class="boton" value="@">
<input type="button" class="boton" value="#">


<br><br>
<a href="" class="anexo">¿Has olvidado tu contraseña?</a>
&nbsp;&nbsp;&nbsp;
<input type="submit" class="boton" value="Iniciar sesión">
</form>
</div>

<!-- Pie Pagina -->

<div id="pie">

<hr>

<div id="pie-izq">

<a href="http://www.tecasoft.com/legal.html" class="pie-izq" title="Condiciones Generales de Contratación">Legal &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/proteccion-de-datos.html" class="pie-izq" title="Protección de datos personales">Proteccion de datos &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/central-de-soporte.html" class="pie-izq" title="Documentación de ayuda">Central de soporte &nbsp;|&nbsp;</a>
<a href="http://www.tecasoft.com/sitemap.html" class="pie-izq" title="Todos los enlaces web">Mapa web &nbsp;|&nbsp;</a>
<span class="pie-izq">Rotacion soporte:  &nbsp;|&nbsp;</span>
<span class="pie-izq">Hora: </span>


</div>

<div id="pie-der">

<a href="http://www.tecasoft.com/empresas-grupo.html" class="pie-der" title="Nuestro grupo empresarial">Empresas del grupo: anonimo S.L</a>


</div>

<br><br>

</div>


</center>

</div>

<script type="text/javascript" >
$(".boton").button();
</script>




<script type="text/javascript">

$("input#usuario").select(function(){

function tecla(valor){
document.forms["form1"]["usuario"].value += valor;
}

});


$("input#contrasena").select(function(){

function tecla(valor){
document.forms["form1"]["contrasena"].value += valor;
}

});
</script>


</body>
</html>