Ограничение редиректов

Navigo — это лёгкая и мощная библиотека для маршрутизации на стороне клиента в JavaScript. Одной из важных особенностей работы с маршрутизатором является контроль редиректов, чтобы избежать бесконечных циклов или избыточных перенаправлений.

Настройка редиректов

Редиректы в Navigo можно реализовать с помощью метода navigate(), который программно меняет текущий маршрут. При этом необходимо учитывать, что частые вызовы navigate() без проверки могут привести к повторным переходам на один и тот же маршрут.

Пример простого редиректа:

const router = new Navigo('/');

router.on('/home', () => {
  console.log('Home page');
});

router.on('/login', () => {
  router.navigate('/home'); // редирект на /home
});

Здесь каждый переход на /login мгновенно перенаправляет на /home. Без дополнительных условий это может вызвать цикл, если /home также содержит редирект обратно на /login.

Предотвращение циклических редиректов

Для ограничения редиректов часто используют флаг состояния или проверку текущего маршрута перед навигацией.

let redirectInProgress = false;

router.on('/login', () => {
  if (!redirectInProgress) {
    redirectInProgress = true;
    router.navigate('/home');
  }
});

Ключевой момент — контроль флага состояния, чтобы переход выполнялся только один раз. После завершения перехода флаг можно сбросить, если ожидаются новые переходы.

Ограничение количества последовательных редиректов

В больших приложениях может возникнуть ситуация, когда редиректы идут цепочкой. Чтобы избежать бесконечной последовательности, удобно ограничивать количество редиректов через счётчик:

let redirectCount = 0;
const MAX_REDIRECTS = 3;

router.on('/start', () => {
  if (redirectCount < MAX_REDIRECTS) {
    redirectCount++;
    router.navigate('/step1');
  } else {
    console.warn('Достигнут лимит редиректов');
  }
});

После выполнения перехода счётчик можно сбрасывать, чтобы новая цепочка могла начаться корректно.

Использование параметров для контроля переходов

Navigo позволяет передавать параметры через URL или через объект опций при вызове navigate(). Это удобно для контроля состояния редиректа, без глобальных переменных.

router.on('/step1', ({ query }) => {
  const attempts = query.attempts || 0;
  if (attempts < 2) {
    router.navigate('/step2', { attempts: attempts + 1 });
  } else {
    console.log('Редиректы ограничены');
  }
});

Параметры обеспечивают изоляцию логики редиректов и позволяют создавать безопасные последовательности переходов.

Проверка текущего маршрута перед навигацией

Метод getCurrentLocation() возвращает текущий путь, что позволяет избежать лишних редиректов на тот же маршрут:

router.on('/dashboard', () => {
  const current = router.getCurrentLocation();
  if (current !== '/dashboard') {
    router.navigate('/dashboard');
  }
});

Этот подход особенно полезен при динамических редиректах на основе состояния пользователя или данных сервера.

Применение middleware для контроля редиректов

Navigo поддерживает промежуточные обработчики (before) для маршрутов, что даёт возможность проверять условия до навигации:

router.on('/profile', () => {
  console.log('Профиль пользователя');
}).before((done, params, current) => {
  if (!user.isLoggedIn) {
    router.navigate('/login');
  } else {
    done();
  }
});

Механизм before позволяет централизованно ограничивать нежелательные редиректы и добавлять проверки безопасности без изменения логики каждого маршрута.

Выводы по ограничению редиректов

  • Использование флагов и счётчиков предотвращает циклы.
  • Параметры URL помогают контролировать количество переходов.
  • Проверка текущего маршрута снижает вероятность избыточных редиректов.
  • Middleware предоставляет централизованный способ управления навигацией.

Эти техники совместно обеспечивают стабильную и предсказуемую работу маршрутизатора Navigo даже при сложной логике переходов.

Оглавление