Konstantin
2022-06-12 07:13
Спасибо! Ждем новых эпизодов)
Переменные окружения в React
Для компонента аутентификации нам осталось доделать возможность входа через OAuth-провайдер на другом домене или поддомене. Для указания хоста мы можем использовать переменные окружения как мы делаем в бэкенде.
Но работа с окружением во фронтенде сильно отличается тем, что JavaScript код выполняется не на севрере, а в браузере, где никаких переменных нет. И для динамической подстановки значений в момент запуска сервера нам придётся использовать особые подходы.
Поэтому сегодня разберём внутреннюю работу и использование переменных окружения в React при разработке и при деплое с Docker. Заодно познакомимся с аргументами для пробрасывания ключей доступа к приватным репозиториям в процессе сборки контейнеров:
- 00:01:57 Переменные окружения в React App
- 00:04:09 Использование переменных в продакшене
- 00:06:06 Простановка значений в Dockerfile
- 00:08:08 Использование аргументов сборки
- 00:11:13 Передача ключей для приватных репозиториев
- 00:13:57 Подстановка значений при запуске
- 00:14:18 Использование заглушек значений
- 00:15:59 Подстановка значений в docker-entrypoint
- 00:18:29 Проверка работы
- 00:20:44 Сокрытие паролей
- 00:21:47 Подведение итогов
Скрытый контент (код, слайды, ...) для подписчиков. Открыть →
Дмитрий Елисеев
elisdn.ru
Чтобы не пропускать новые эпизоды подпишитесь на наш канал @deworkerpro в Telegram
Комментарии (7)
Руслан
2022-06-15 12:39
Спасибо!
Arunas
2022-07-02 10:22
спасибо.
Руслан
2023-08-17 18:02
Дима, добрый день, в локальном окружении именно переменные с секретами не подставляются на фронт почему-то, передает /run/secrets/secret_file_name, что мог упустить? Спасибо!
Дмитрий Елисеев
2023-08-24 14:47
Да, так и есть. В переменных окружения оказываются эта строка с именем файла.
В PHP-бэкенде мы сами читаем файлы по этим именам через file_get_contents в функции env().
В JS-фронденде мы тоже должны их сами считать в docker-entrypoint.sh командой cat в переменные как мы делали в скрипте бэкапа:
#!/bin/bash
if [ -f "$REACT_PASSWORD_FILE" ]; then
export REACT_PASSWORD="$(cat "$REACT_PASSWORD_FILE")"
fi
Руслан
2023-08-24 17:01
Все понял, спасибо, примерно так и сделал, правда решил избавиться от суффиксов _FILE и обновлять в подставном entrypoint значение переменных окружения содержимым файла секрета, если текущее значение совпадает с паттерном адреса секрета, получился более универсальный подход на большинство сервисов и без суффиксов в переменных:
# Паттерн пути секретов
SECRETS_PATH="/run/secrets"
# Читаем все переменные окружения, которые переданы контейнеру
while IFS='=' read -r name value; do
# Если значение переменной окружения начинается с "/run/secrets/", это секрет.
if echo "$value" | grep -q "^$SECRETS_PATH/"; then
# Получаем реальное имя файла секрета
secret_filename=${value##*/}
# Если файл секрета существует, читаем его содержимое
if [ -f "$SECRETS_PATH/$secret_filename" ]; then
secret_value=$(cat "$SECRETS_PATH/$secret_filename")
export "$name"="$secret_value"
else
echo "Warning: Secret file $value not found"
fi
else
# Просто экспортируем переменную окружения, если это не секрет
export "$name"="$value"
fi
done < <(env)
# Передаем управление предварительно сохраненному оригинальному docker-entrypoint.sh
exec docker-entrypoint-original.sh "$@"
Спасибо!