Начало работы

Это руководство поможет вам быстро начать работу с Nuxt Render Cache.

Установка

Установите Nuxt Render Cache в ваш проект Nuxt 3:

npm

npm install nuxt-render-cache

yarn

yarn add nuxt-render-cache

pnpm

pnpm add nuxt-render-cache

bun

bun add nuxt-render-cache

Базовая настройка

1. Добавление модуля

Добавьте модуль в файл nuxt.config.ts:

export default defineNuxtConfig({
  modules: ['nuxt-render-cache'],

  renderCache: {
    ttl: {
      softDefault: 60, // 1 минута - фоновое обновление
      hardDefault: 300, // 5 минут - полное истечение кеша
      renderTimeout: 10000, // 10 секунд - таймаут рендеринга
    },
  },
});

2. Настройка Redis

Убедитесь, что Redis сервер запущен и доступен. По умолчанию используется redis://localhost:6379.

Запуск Redis локально:

Docker

docker run -d -p 6379:6379 redis:alpine

Homebrew (macOS)

brew install redis
brew services start redis

Ubuntu/Debian

sudo apt update
sudo apt install redis-server
sudo systemctl start redis-server

3. Переменные окружения

Создайте файл .env для настройки подключения к Redis и API токена:

# Redis подключение
REDIS_URL=redis://localhost:6379

# API токен для управления кешем
RENDER_CACHE_API_TOKEN=your-super-secret-token-here

# Опционально: настройки Redis кластера
# REDIS_CLUSTER_HOSTS=redis://host1:6379,redis://host2:6379

Расширенная настройка

Конфигурация TTL

export default defineNuxtConfig({
  modules: ['nuxt-render-cache'],

  renderCache: {
    ttl: {
      // Для высоконагруженных приложений
      softDefault: 30, // 30 секунд фонового обновления
      hardDefault: 600, // 10 минут полного кеша
      renderTimeout: 5000, // 5 секунд таймаут
    },
  },
});

Настройка Redis кластера

export default defineNuxtConfig({
  modules: ['nuxt-render-cache'],

  renderCache: {
    redis: {
      // Для Redis кластера
      cluster: {
        enableOfflineQueue: false,
        redisOptions: {
          password: process.env.REDIS_PASSWORD,
        },
      },

      // Или для одиночного Redis с авторизацией
      host: 'localhost',
      port: 6379,
      password: process.env.REDIS_PASSWORD,
      db: 0,
    },
  },
});

Настройка API безопасности

export default defineNuxtConfig({
  modules: ['nuxt-render-cache'],

  runtimeConfig: {
    // API токен для управления кешем
    renderCacheApiToken: process.env.RENDER_CACHE_API_TOKEN,

    // Дополнительные настройки безопасности
    renderCache: {
      // Максимальное количество запросов в минуту
      rateLimit: 100,

      // Разрешенные IP адреса для API
      allowedIps: ['127.0.0.1', '192.168.1.0/24'],
    },
  },
});

Проверка установки

Тестовый компонент

Создайте простой тестовый компонент для проверки работы кеширования:

<template>
  <div>
    <CacheRender cache-key="test:page" :hard-ttl="60" :soft-ttl="30">
      <div>
        <h1>Тестовая страница</h1>
        <p>Время рендеринга: {{ new Date().toISOString() }}</p>
        <p>Случайное число: {{ Math.random() }}</p>
      </div>
    </CacheRender>
  </div>
</template>

Проверка API

Проверьте работу API управления кешем:

# Получить список ключей
curl -H "x-render-cache-api: your-token" http://localhost:3000/api/render-cache/keys

# Получить статистику
curl -H "x-render-cache-api: your-token" http://localhost:3000/api/render-cache/stats

Устранение неисправностей

Проблемы с Redis

Ошибка подключения к Redis:

# Проверьте доступность Redis
redis-cli ping

Решение проблем с памятью Redis:

# Увеличьте максимальный размер памяти
maxmemory 256mb
maxmemory-policy allkeys-lru

Проблемы с производительностью

Высокое использование CPU:

• Уменьшите renderTimeout
• Увеличьте TTL значения
• Оптимизируйте компоненты для рендеринга

Высокое использование памяти:

• Настройте политику вытеснения Redis
• Уменьшите TTL для редко используемых данных
• Используйте сжатие данных в Redis

Логи и отладка

Включите подробные логи для отладки:

export default defineNuxtConfig({
  // ... другие настройки

  runtimeConfig: {
    renderCache: {
      debug: true, // Включить отладочные логи
      logLevel: 'debug',
    },
  },
});