Свойство ctx.params

В библиотеке Page.js объект контекста маршрута (ctx) содержит всю информацию о текущем маршруте, включая путь, состояние, параметры и другие метаданные. Одним из ключевых свойств является ctx.params, которое используется для работы с динамическими сегментами URL.


Что такое ctx.params

ctx.params — это объект, содержащий пары ключ-значение, соответствующие именованным параметрам маршрута. Эти параметры задаются в пути маршрута через двоеточие (:). Например:

page('/user/:id', ctx => {
  console.log(ctx.params.id);
});

При переходе на URL /user/42 в консоль будет выведено:

42

Таким образом, ctx.params позволяет извлекать данные из URL, которые определяются динамическими сегментами маршрута.


Определение параметров маршрута

Параметры задаются с помощью синтаксиса :имя. Можно использовать несколько параметров в одном маршруте:

page('/post/:postId/comment/:commentId', ctx => {
  console.log(ctx.params.postId);    // идентификатор поста
  console.log(ctx.params.commentId); // идентификатор комментария
});

При переходе на /post/10/comment/5 объект ctx.params будет следующим:

{
  postId: "10",
  commentId: "5"
}

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

const postId = Number(ctx.params.postId);

Необязательные параметры

Page.js поддерживает необязательные параметры, которые указываются через знак вопроса ?. Они могут отсутствовать в URL, и в этом случае значение будет undefined.

page('/search/:query?', ctx => {
  console.log(ctx.params.query);
});
  • /search/javascriptctx.params.query = "javascript"
  • /searchctx.params.query = undefined

Параметры с регулярными выражениями

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

page('/user/:id(\\d+)', ctx => {
  console.log(ctx.params.id);
});

В этом примере маршрут сработает только если id состоит из цифр. Попытка перейти на /user/abc не вызовет этот маршрут.


Группировка параметров

В сложных маршрутах удобно использовать несколько параметров вместе. ctx.params всегда содержит только именованные параметры, независимо от их позиции в URL:

page('/shop/:category/:itemId', ctx => {
  const { category, itemId } = ctx.params;
  console.log(category, itemId);
});

При переходе на /shop/electronics/123 будет:

{
  category: "electronics",
  itemId: "123"
}

Доступ к ctx.params в нескольких middleware

Page.js поддерживает цепочку функций-обработчиков. Каждый обработчик получает один и тот же объект ctx, включая ctx.params. Это позволяет обращаться к параметрам на любом этапе маршрута:

page('/profile/:username', checkAuth, loadProfile, renderProfile);

function checkAuth(ctx, next) {
  if (!ctx.user) return page.redirect('/login');
  next();
}

function loadProfile(ctx, next) {
  console.log(ctx.params.username); // доступ к параметру
  // загрузка данных пользователя
  next();
}

function renderProfile(ctx) {
  document.body.textContent = `Профиль: ${ctx.params.username}`;
}

Динамические маршруты и ctx.params

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

page('/:lang/docs/:page', ctx => {
  const { lang, page } = ctx.params;
  loadDocumentation(lang, page);
});
  • /en/docs/installationctx.params = { lang: "en", page: "installation" }
  • /ru/docs/startctx.params = { lang: "ru", page: "start" }

Такой подход сокращает количество маршрутов и упрощает структуру приложения.


Резюме ключевых особенностей ctx.params

  • Содержит только именованные параметры из URL.
  • Значения параметров всегда строки.
  • Поддерживаются необязательные параметры (?).
  • Можно использовать регулярные выражения для ограничения формата.
  • Доступно во всех middleware и обработчиках маршрута.
  • Позволяет динамически строить маршруты и избегать дублирования кода.

Использование ctx.params делает маршрутизацию в Page.js гибкой, понятной и удобной для создания SPA с динамическими URL.