On-Page Editing
Встраивает редактирование Payload-страниц прямо в Next.js-фронтенд, сохраняет правки как черновики и выдаёт ссылки для предпросмотра.
Установка
pnpm add @payload-onpage/plugin Описание
Плагин добавляет inline-редактирование для коллекций и глобалов, перечисленных в опциях `collections` и `globals`. Редактор кликает по тексту на отрендеренной странице, вносит правки, и изменения сохраняются как черновик. Плагин регистрирует эндпоинты для входа в режим редактирования, переключения режимов, выхода и генерации ссылок на предпросмотр. Для всех них нужен адаптер `session`. Документированный вариант для Next.js это `nextSession()` из `@payload-onpage/next/session`. Сохранения идут через REST API Payload, а не через отдельный канал, поэтому контроль доступа, хуки, валидация, черновики и версии работают так же, как для любой другой записи. Права на редактирование проверяются через `docAccessOperation`. Хуки `beforeValidate` и `beforeChange` удаляют служебные маркеры редактора. `beforeChange` также запускает защиту от устаревшей записи: сохранение отклоняется, если документ изменился после того, как редактор его загрузил. Хук `afterRead` применяет автомаппинг, когда он запрошен. В админке для каждого включённого документа появляются кнопка "Edit on page" и контрол "Copy preview link", которые подключаются через `beforeDocumentControls`. Для каждого документа можно задать `fields` и `url`, а также опции `access`, `encode`, `previewLinkTTL`, `validatePreviewLink`, `secret`, `authCookie`, `routePrefix` и `enabled`. Плагин требует peer-зависимости: `payload` ^3.90.2, `@payloadcms/ui`, `@payloadcms/translations` и `react` ^19. Если `serverURL` не задан в production, плагин выводит предупреждение, потому что редиректы, ссылки на предпросмотр и cookie с флагом Secure требуют публичного origin. При отсутствии `session` или пустом `secret` плагин выбрасывает `InvalidConfiguration`.
О пакете
- Имя пакета
@payload-onpage/plugin- Последняя версия
0.6.0- Размер
- 303 кБ
- Лицензия
- MIT
- Загрузок в неделю
- 1,7 тыс.
- Последняя публикация
- 13 окт. 2026 г.
Ещё от jellologic
Профиль автораonpage for TanStack Start
Подключает плагин payload-onpage к сайту на TanStack Start, чтобы редакторы правили контент и смотрели черновики прямо на странице.
Lexical Inline Rich Text Editor
Добавляет редактирование полей richText Payload прямо на странице: клик по тексту открывает редактор без перехода в админку.
OnPage for Next.js App Router
Адаптер для Next.js App Router, который добавляет inline-редактирование и предпросмотр черновиков для страниц на Payload.
onpage core
Фреймворк-независимое ядро onpage для кликабельного редактирования черновых превью с сохранением через REST API Payload.
On-Page React Editor
Добавляет на React-страницы Payload визуальный редактор: тулбары, панели и редакторы полей поверх отрисованной страницы.