JS властивість Event.isTrusted
Загальний опис
isTrusted – це властивість об’єкта Event у JavaScript, яка визначає, чи подія була ініційована користувачем (натисканням миші, натисканням клавіші тощо) або була створена скриптом. Це булеве значення: true, якщо подія була викликана дійсними діями користувача, та false, якщо подія була створена скриптом через методи на кшталт dispatchEvent, Event.initEvent, або ж аналогічними. Властивість isTrusted доступна для всіх об'єктів, які є підкласами Event, таких як MouseEvent, KeyboardEvent, тощо.
Коли відбувається подія, JavaScript автоматично передає в обробник подій об’єкт події, який містить деталі про те, як і де подія сталася. Наприклад, якщо користувач натискає кнопку, isTrusted буде дорівнювати true, а якщо ви викличете click подію на тій самій кнопці через код, isTrusted поверне false.
document.querySelector('button').addEventListener('click', (event) => {
if (event.isTrusted) {
console.log('Подія ініційована користувачем');
} else {
console.log('Подія створена скриптом');
}
});
// Викличемо подію програмно
document.querySelector('button').click();
У цьому прикладі, коли користувач натискає кнопку, ви побачите повідомлення "Подія ініційована користувачем". Якщо ж подію викликати через button.click(), то виведеться "Подія створена скриптом".
isTrusted особливо корисний, коли потрібно відрізнити події користувача від подій, ініційованих скриптами. Це допомагає захистити інтерактивні функції, які повинні виконуватися лише для справжніх дій користувача, наприклад, для запобігання небажаних автоматизованих дій, що можуть змінювати сторінку.
| Порада: | Щоб відловлювати не лише "trusted" події, але й обробляти їх різними шляхами, створюйте умовні оператори, що відрізняють різні типи подій. Це дасть більше гнучкості в обробці. |
| Порада: | В деяких випадках можна використовувати |
| Порада: |
|
Синтаксис
event.isTrustedЗначення
Return
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
46 |
1.5 |
10 |
33 |
12 |
| Переглядач | ||||
|---|---|---|---|---|
46 |
46 |
4 |
10 |
| Переглядач | ||
|---|---|---|
14.5.0 |
1.0 |
Приклади
Цей скрипт слухає подію click на кнопці. Якщо подія є "trusted", буде виведено повідомлення про натискання справжнім користувачем. Через 2 секунди після завантаження сторінки скрипт автоматично викликає подію click, щоб продемонструвати, як isTrusted розпізнає програмний виклик, який не ініційований користувачем.
Цей приклад демонструє, як заборонити надсилання форми, якщо подія була створена програмно. Це може бути корисно для форм, що вимагають дій користувача для надсилання, оскільки автоматизоване надсилання може бути неавтентичним.
document.querySelector('form').addEventListener('submit', (event) => {
if (!event.isTrusted) {
event.preventDefault();
alert('Неможливо надіслати форму автоматично.');
} else {
console.log('Форма успішно надіслана');
}
});Тут використовується isTrusted, щоб дозволити лайки лише від реальних користувачів. Якщо лайк поставлений програмно, виведеться повідомлення про спробу накрутки лайків. Це може бути корисним для соціальних мереж або подібних платформ, щоб запобігти маніпуляціям з популярністю контенту.
document.querySelector('.like-button').addEventListener('click', (event) => {
if (!event.isTrusted) {
console.log('Спроба накрутки лайків зупинена.');
} else {
event.target.classList.toggle('liked');
console.log('Користувач натиснув "Подобається".');
}
});