Detectar si el botón hace clic en un usuario real o se activa mediante un script

6 minutos de lectura

avatar de usuario
usuario151402

¿Hay algún método que me permita detectar si un usuario real hizo clic en un botón y no algún método automatizado (javascript) que un usuario haya cargado en la consola de desarrollo de su navegador u otra herramienta de desarrollo de navegador?

Probé los siguientes métodos sugeridos en varias publicaciones de stackoverflow, pero ninguno de ellos parece funcionar. REF: ¿Cómo detectar si un clic () es un clic del mouse o está activado por algún código?

Métodos de detección de secuencias de comandos probados y fallados:

mybutton.click(function (e) {
    if (!e.which) {
        //Triggered by code NOT Actually clicked
        alert(' e.which - not a real button click')
    } else if ('isTrusted' in e && !e.isTrsuted) {
        //Triggered by code NOT Actually clicked
        alert(' e.isTrusted - not a real button click')
    } else if (e.originalEvent === undefined) {
        //Triggered by code NOT Actually clicked
        alert(' e.originalEvent - not a realbutton click')
    }
    //                  else if (!e.focus) {
    //                      //triggered  // does not detect e.focus on a real btn click
    //                      alert(' e.focus - not a realbutton click')
    //                  }
    else {
        // Button hopefully clicked by a real user and not a script
    }
})

Si ejecuto la siguiente secuencia de comandos para activar el clic del botón desde la consola del navegador Chrome, ninguno de los métodos anteriores lo atrapa como activado por una secuencia de comandos.

var button = document.getElementById("btnSubmit");
button.click();

================================================== ========================

Gracias por todas sus respuestas y gracias a stackoverflow por proporcionar un sitio tan excelente que facilita tanto el intercambio de conocimientos y por ahorrarnos a los técnicos una cantidad incalculable de horas.

Parece que todavía no tengo un método confiable. Los 3 navegadores (FF, IE y Chrome) proporcionan interfaces de desarrollador/consola para que un usuario ejecute/inyecte un javascript en mi página web. Parece que cada tipo de navegador atrapa algunos valores de propiedades de eventos de manera un poco diferente. Por ejemplo: Chrome detecta la diferencia entre un clic activado por secuencia de comandos y un usuario real con e.screenX pero en IE: e.screenX tiene el mismo valor tanto para un clic de secuencia de comandos (sintético) como para un clic de botón de usuario

Los siguientes métodos de detección no funcionaron en absoluto o son inconsistentes entre los diferentes navegadores: e.which e.isTrsuted e.originalEvent (event.source != window) (e.distance != null)

El evento de mousedown parece ser activado solo por un clic de botón de usuario real, pero debo suponer que hay algún método de secuencia de comandos para emular un mousedown además de un evento de clic de botón

$(me.container + ' .mybutton').mousedown(function (e) { 
    alert('mouseisdown real button click'); 
}

Si alguien puede encontrar un método confiable que funcione en varios navegadores, que detecte la diferencia entre un clic de botón sintético (script) y un clic de botón por parte de un usuario, merecerá el estatus de superhéroe.

  • A partir de ahora, no puedo ver una respuesta aceptada. Y peor aún, ninguno que yo aceptaría.

    – Gyro Gearloose

    21 de enero de 2016 a las 16:28

  • Para firefox e.isTrusted funciona, no sé para otros. e.isTruted no funciona 😉

    – Gyro Gearloose

    7 febrero 2016 a las 15:34

  • Esta pregunta fue causada por un error tipográfico.

    – Kaiido

    31 de marzo a las 9:03

avatar de usuario
Nabbit Dagg

No, no es posible en todos los casos.

Como se mencionó en otras respuestas, puede buscar las coordenadas del mouse (clientX/Y y screenX/Y), y si no están presentes, puede asumir que fue probablemente no es una acción generada por humanos.

Pero, si el usuario toca el botón con el tabulador y usa la barra espaciadora para hacer clic en él, o lo hace sin usar el mouse, las coordenadas también serán cero y este método determinará incorrectamente que se trata de un clic con secuencia de comandos.

Además, si el script usa dispatchEvent en vez de click, se pueden dar coordenadas al evento. En este caso, este método lo identificará incorrectamente como un clic generado por el usuario.

// This will produce what appears to be a user-generated click.
function simulateClick(element) {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 110, 111, 10, 11, false, false, false, false, 0, null);
  element.dispatchEvent(evt);
}

http://jsfiddle.net/bYq7m/

avatar de usuario
kyle weller

Por motivos de seguridad, cuando activa un evento con javascript, se registrará de forma diferente que si el usuario activara el evento. Consola registra el ev objeto y verá diferencias significativas entre los dos casos.

mybutton.click(function(ev) {
  console.log(ev);
});

Aquí hay algunos resultados de muestra de los dos casos:

jQuery.Event
currentTarget: button
data: null
delegateTarget: button
handleObj: Object
isTrigger: true
jQuery191011352501437067986: true
namespace: ""
namespace_re: null
result: undefined
target: button
timeStamp: 1360472753601
type: "mousedown"
__proto__: Object

jQuery.Event {originalEvent: MouseEvent, type: "mousedown", isDefaultPrevented:     function, timeStamp: 1360472840714, jQuery191011352501437067986: true…}
altKey: false
bubbles: true
button: 0
buttons: undefined
cancelable: true
clientX: 39
clientY: 13
ctrlKey: false
currentTarget: button
data: null
delegateTarget: button
eventPhase: 2
fromElement: null
handleObj: Object
isDefaultPrevented: function returnFalse() {
jQuery191011352501437067986: true
metaKey: false
offsetX: 37
offsetY: 11
originalEvent: MouseEvent
pageX: 39
pageY: 13
relatedTarget: null
screenX: 1354
screenY: 286
shiftKey: false
target: button
timeStamp: 1360472840714
toElement: button
type: "mousedown"
view: Window
which: 1
__proto__: Object

  • Este es un ejemplo de arrastre, la pregunta establece una pregunta sobre el evento de clic.

    – Jacobo

    10 de febrero de 2013 a las 4:28

  • En Chrome, en el evento button.click: e muestra (e.originalEvent.type == ‘mousedown’) tanto para un clic con secuencia de comandos como para un clic real. ¿Existen otras propiedades que serán diferentes y consistentes en diferentes navegadores?

    – usuario151402

    11 de febrero de 2013 a las 23:54

  • ¿Qué tal ev.isTrigger?

    –Kyle Weller

    11 de febrero de 2013 a las 23:58

Violín Aquí.

$("button").mousedown( function(e) {
    if(e.which) {
        alert(1);
    }
});
$("button").trigger("mousedown");

O JavaScript:

document.getElementsByTagName('button')[0].onmousedown = function(e) {
 if(e.which) {
    alert(1); // original click
 }
}
document.getElementsByTagName('button')[0].onmousedown();

Puede ver en el violín, no permitirá que la función de activación llame, pero solo cuando el mouse esté presionado en el botón. Si se activa un clic automático en el botón, entonces e.which es indefinido que puede ser atrapado fácilmente.

ACTUALIZAR : Violín para Javascript

  • Este es un ejemplo de arrastre, la pregunta establece una pregunta sobre el evento de clic.

    – Jacobo

    10 de febrero de 2013 a las 4:28

  • En Chrome, en el evento button.click: e muestra (e.originalEvent.type == ‘mousedown’) tanto para un clic con secuencia de comandos como para un clic real. ¿Existen otras propiedades que serán diferentes y consistentes en diferentes navegadores?

    – usuario151402

    11 de febrero de 2013 a las 23:54

  • ¿Qué tal ev.isTrigger?

    –Kyle Weller

    11 de febrero de 2013 a las 23:58

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad