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: () => 'Страница не найдена'
}
В сочетании с конкретными регулярными выражениями для известных маршрутов это позволяет строить надёжную систему маршрутизации.
/g), они не нужны для маршрутизации и
могут привести к неожиданным результатам.{
path: /^\/user\/(?<id>\d+)$/,
action: ({ params }) => `Пользователь ID: ${params.id}`
}
Регулярные выражения в Universal Router — это инструмент, который открывает полный контроль над сопоставлением URL, позволяя реализовать гибкие, динамичные и валидационные маршруты без ограничения на формат входящего пути.