0Pricing
JavaScript Academy · Урок

Переменные среды и схемы конфигурации

Настраивайте приложения с небольшими значениями по умолчанию, безопасным чтением переменных среды и явными объектами. Не допускайте утечки секретов в браузере. Удобные для начинающих приёмы

«Переменные среды и схемы конфигурации» — бесплатный урок JavaScript Academy на CoddyKit. Это урок 3 из 3. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения JavaScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс JavaScript Academy содержит 3 уроков всего.

Общая картина

Цель: безопасно читать конфигурацию в любой среде выполнения.

  • Сначала значения по умолчанию
  • Проверяйте наличие переменных окружения (не предполагайте наличие process.env)
  • Разбирайте строки в числа и логические значения
  • Не храните секреты в браузерных сборках
Переменные среды и схемы конфигурации — иллюстрация 1

Безопасное чтение окружения

Используйте проверку наличия возможности, чтобы читать переменные окружения только при их наличии. Для запускаемых примеров предоставьте небольшое демонстрационное хранилище.

// Read an env var if available; otherwise use a fallback
function readEnv(name, fallback) {
  // detect Node-like env
  const hasProcessEnv = typeof process !== "undefined" && process && process.env && typeof process.env === "object";
  if (hasProcessEnv && typeof process.env[name] === "string") {
    return process.env[name];
  }
  // demo fallback store so this snippet runs everywhere
  const DEMO = { API_URL: "https://api.example.com", NODE_ENV: "development" };
  if (typeof DEMO[name] === "string") return DEMO[name];
  return fallback;
}

console.log("API_URL:", readEnv("API_URL", "https://fallback.local"));
Переменные среды и схемы конфигурации — иллюстрация 2

Конфигурация из defaults и окружения

Сначала используйте defaults, затем переопределяйте их значениями из окружения. Явно преобразуйте строки в числа/логические значения.

// Build config from defaults, then override via env when present
function buildConfig() {
  const defaults = {
    apiUrl: "https://api.example.com",
    port: 3000,
    debug: false
  };

  // env values are strings; parse to right types
  const apiUrl = readEnv("API_URL", defaults.apiUrl);
  const portStr = readEnv("PORT", String(defaults.port));
  const debugStr = readEnv("DEBUG", defaults.debug ? "1" : "0");

  return {
    apiUrl: apiUrl,
    port: Number.parseInt(portStr, 10),
    debug: debugStr === "1" || debugStr === "true"
  };
}

const cfg = buildConfig();
console.log("config:", cfg);
Переменные среды и схемы конфигурации — иллюстрация 3

Явный параметр конфигурации

Передавайте функциям небольшой объект конфигурации. Это позволяет избежать глобального состояния и неожиданных эффектов.

// Pass config into functions explicitly (easier to test)
function startApp(config) {
  // use values directly
  const mode = config.debug ? "debug" : "prod";
  return "Starting " + mode + " at " + config.apiUrl + " on :" + config.port;
}

console.log(startApp(cfg));
Переменные среды и схемы конфигурации — иллюстрация 4

Безопасный разбор окружения

Значения окружения — это строки. Напишите небольшие анализаторы для логических значений и целых чисел, чтобы избежать ошибок.

// Helpers to parse common env shapes safely
function toBool(s, fallback) {
  if (typeof s !== "string") return fallback;
  const v = s.trim().toLowerCase();
  if (v === "1" || v === "true" || v === "yes") return true;
  if (v === "0" || v === "false" || v === "no") return false;
  return fallback;
}

function toInt(s, fallback) {
  const n = Number.parseInt(s, 10);
  return Number.isFinite(n) ? n : fallback;
}

console.log("toBool:", toBool("yes", false), toBool("no", true));
console.log("toInt :", toInt("8080", 3000), toInt("oops", 3000));
Переменные среды и схемы конфигурации — иллюстрация 5

Секреты и клиентский код

Важно:

  • Не помещайте секреты в клиентский JS: пользователи смогут их прочитать.
  • Оставляйте в браузере только безвредные флаги и URL.
  • В Node читайте настоящие секреты из process.env или хранилища секретов.
  • Всегда сохраняйте конфигурацию по умолчанию для локального запуска.
Переменные среды и схемы конфигурации — иллюстрация 6

Тест по основам окружения и конфигурации

Быстрая проверка: переносимый шаблон конфигурации.

Переменные среды и схемы конфигурации — иллюстрация 7

Повторение

Повторение: создавайте конфигурацию из defaults и безопасно считываемых переменных окружения, parse строки и передавайте явный объект config. Никогда не включайте secrets в клиентский код.

Переменные среды и схемы конфигурации — иллюстрация 8

Часто задаваемые вопросы

Урок «Переменные среды и схемы конфигурации» бесплатный?

Да — полный текст урока «Переменные среды и схемы конфигурации» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс JavaScript Academy, подпишись на CoddyKit PRO. Курс JavaScript Academy содержит 3 уроков всего.

Чему я научусь в уроке «Переменные среды и схемы конфигурации»?

Настраивайте приложения с небольшими значениями по умолчанию, безопасным чтением переменных среды и явными объектами. Не допускайте утечки секретов в браузере. Удобные для начинающих приёмы Ты практикуешь JavaScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать JavaScript Academy?

Предыдущий опыт не требуется. JavaScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 3.

Сколько времени занимает урок «Переменные среды и схемы конфигурации»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке JavaScript Academy?

Да. Каждый урок JavaScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Глобальные объекты, доступность fetch, файловые и сетевые API
  2. Особенности загрузчика ESM, различия путей и URL
  3. Переменные среды и схемы конфигурации
← Назад к JavaScript Academy