Как отследить жест свайпа назад в JavaScript

Оффтоп javascript
1

Проблема с обработкой жеста свайпа назад

Привет всем! У меня есть задача для мобильной версии сайта. Мне нужно отследить, когда пользователь выполняет свайп назад (backswipe) для навигации.

Моя цель

Я не хочу отключать стандартное поведение браузера, а просто планирую запустить свою функцию одновременно с обычным возвратом назад.

Пример кода

// Например, вот такой код
function handleBackSwipe() {
    console.log('Пользователь выполнил свайп назад');
    // Здесь будет мой код
}

// Как поймать этот жест?
window.addEventListener('???', handleBackSwipe);

Есть ли способ сделать это? Буду признателен за любые советы или готовые решения.

2

Попробуй использовать события touchstart и touchend. Засекай начальную и конечную позиции пальца - если движение слева направо и достаточно быстрое, это твой свайп назад. На каких устройствах уже тестировал? Были ли какие-то проблемы с этим на разных браузерах?

3

Был такой же случай! Использовал popstate - срабатывает когда юзер жмет назад или делает свайп. Не различает обычное нажатие от свайпа, но мне хватило. Вот так: window.addEventListener('popstate', handleBackSwipe). Только учти - событие срабатывает только при реальном изменении истории браузера.

4

Попробуй beforeunload с touchmove - следи за координатами касания по X, и если видишь движение от левого края вправо, то это свайп назад. Но работает не везде одинаково, в Safari особенно могут быть проблемы.