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

Храним ключи и настройки вне кода и не даём секретам утечь в браузер.

Переменные окружения задаются в файле .env; по умолчанию они доступны только на сервере, а в браузер попадают лишь те, чьё имя начинается с NEXT_PUBLIC_.

Зачем выносить настройки

API-ключи, строки подключения к БД, адреса сервисов нельзя писать прямо в коде: они утекут в репозиторий и в браузерный бандл. Их выносят в .env, который не коммитят:

DATABASE_URL=postgres://user:pass@localhost:5432/app
STRIPE_SECRET_KEY=sk_live_secret_value
NEXT_PUBLIC_SITE_URL=https://example.com

Серверные и публичные переменные

Это ключевое правило безопасности:

Любая переменная без префикса NEXT_PUBLIC_ остаётся на сервере. Префикс — это явное разрешение «можно показать в браузере». Поэтому секретные ключи никогда не называют с NEXT_PUBLIC_.

Как использовать в коде

Читают через process.env. На сервере доступны все, на клиенте — только публичные:

// серверный компонент или Server Action
const db = connect(process.env.DATABASE_URL); // ок, секрет на сервере

// клиентский компонент
const url = process.env.NEXT_PUBLIC_SITE_URL; // ок, публичная
// process.env.STRIPE_SECRET_KEY здесь будет undefined — и это правильно

Проверим логику доступа

Смоделируем правило «видна ли переменная в браузере» на чистом JS:

function isPublic(name) {
  return name.startsWith("NEXT_PUBLIC_");
}

console.log("DATABASE_URL ->", isPublic("DATABASE_URL"));
console.log("NEXT_PUBLIC_SITE_URL ->", isPublic("NEXT_PUBLIC_SITE_URL"));
console.log("STRIPE_SECRET_KEY ->", isPublic("STRIPE_SECRET_KEY"));

Вывод:

DATABASE_URL -> false
NEXT_PUBLIC_SITE_URL -> true
STRIPE_SECRET_KEY -> false

Файлы окружения

Next.js поддерживает несколько файлов: .env.local (личные секреты, не коммитят), .env.development, .env.production. Общее правило — секреты в .env.local, а сам файл добавляют в .gitignore.

Итог

• Настройки и ключи выносите в .env, не пишите их в коде.
• Только переменные с префиксом NEXT_PUBLIC_ попадают в браузер.
• Секреты (БД, платёжные ключи) никогда не называют с NEXT_PUBLIC_.