Использование регулярных выражений

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


Определение маршрутов с регулярными выражениями

В Universal Router каждый маршрут определяется объектом с ключом path и обработчиком action. Значение path может быть не только строкой с динамическими сегментами (:id), но и регулярным выражением:

import UniversalRouter from 'universal-router';

const routes = [
  {
    path: /^\/user\/(\d+)$/,
    action: ({ path, params }) => {
      return `Пользователь с ID: ${params[0]}`;
    }
  },
  {
    path: /^\/article\/(\d+)\/([a-z-]+)$/,
    action: ({ params }) => {
      const [id, slug] = params;
      return `Статья ${id}, ${slug}`;
    }
  }
];

const router = new UniversalRouter(routes);

router.resolve('/user/42').then(console.log); // Пользователь с ID: 42
router.resolve('/article/10/javascript-basics').then(console.log); // Статья 10, javascript-basics

Ключевые моменты:

  • Регулярное выражение используется вместо строкового шаблона.
  • Параметры захватываются через группы ().
  • Все совпавшие группы передаются в массив params обработчика.

Комбинирование строковых маршрутов и регулярных выражений

Universal Router позволяет смешивать стандартные строковые маршруты и регулярные выражения. Это удобно для построения сложной схемы маршрутизации, где часть URL фиксирована, а часть динамическая:

const routes = [
  { path: '/home', action: () => 'Главная страница' },
  { path: /^\/profile\/(\w+)$/, action: ({ params }) => `Профиль: ${params[0]}` }
];

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


Передача параметров из регулярных выражений

Когда путь определяется через регулярное выражение, Universal Router автоматически передаёт массив совпадений в объект params. Для более сложной логики часто используют деструктуризацию:

{
  path: /^\/products\/(\d+)\/(\w+)$/,
  action: ({ params }) => {
    const [productId, category] = params;
    return `Товар ${productId}, категория: ${category}`;
  }
}

Регулярные выражения обеспечивают гибкость в том числе для валидации URL. Например, можно разрешить только цифры для ID или ограничить набор допустимых символов для слага.


Использование опциональных сегментов

Регулярные выражения позволяют реализовать маршруты с опциональными сегментами, чего невозможно достичь с обычной строковой схемой :param?. Пример:

{
  path: /^\/blog(?:\/(\d+))?$/,
  action: ({ params }) => {
    if (params[0]) return `Блог пост #${params[0]}`;
    return 'Список всех блогов';
  }
}

Символ (?: ... ) создаёт необязательную группу, которая не попадает в params, а отдельные захватывающие группы () передают значения в обработчик.


Применение сложных условий маршрутизации

С помощью регулярных выражений можно строить маршруты, которые зависят от формата URL или дополнительных условий:

{
  path: /^\/order\/(completed|pending|cancelled)\/(\d+)$/,
  action: ({ params }) => {
    const [status, orderId] = params;
    return `Заказ #${orderId}, статус: ${status}`;
  }
}

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


Обработка всех оставшихся маршрутов

Регулярные выражения удобно использовать для маршрута «catch-all», который ловит все неизвестные URL:

{
  path: /.*/,
  action: () => 'Страница не найдена'
}

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


Практические рекомендации

  1. Начинайте с конкретных маршрутов, а регулярные выражения используйте для динамических или сложных паттернов.
  2. Минимизируйте использование глобальных регулярных выражений (/g), они не нужны для маршрутизации и могут привести к неожиданным результатам.
  3. Используйте именованные группы для удобства, если требуется более читаемая работа с параметрами:
{
  path: /^\/user\/(?<id>\d+)$/,
  action: ({ params }) => `Пользователь ID: ${params.id}`
}
  1. Документируйте паттерны, особенно когда регулярные выражения сложные, чтобы поддержка маршрутов оставалась прозрачной.
  2. Комбинируйте с другими возможностями Universal Router, например с вложенными маршрутами и асинхронными действиями, чтобы строить мощные SPA и серверные маршрутизаторы.

Регулярные выражения в Universal Router — это инструмент, который открывает полный контроль над сопоставлением URL, позволяя реализовать гибкие, динамичные и валидационные маршруты без ограничения на формат входящего пути.