Как скрыть и использовать ключи API при размещении веб-приложения на Netlify аналогично файлам .env

Если вы здесь, вы, вероятно, знакомы с использованием переменных .env-файлов. Если нет, перейдите сюда, чтобы прочитать мою другую статью, которая поможет вам создать .env файлы для безопасного хранения API ключей и других переменных для локальной разработки.

Давайте создадим переменные окружения, аналогичные .env файлам в Netlify:

Шаг 1: Перейдите в Netlify -> Выберите свой сайт -> Затем выберите Deploys в верхней навигационной панели.
Шаг 2: Затем выберите Deploy Settings -> теперь выберите Environment в левой панели.

Шаг 3: В Environment в разделе Environment Variables -> добавьте переменные окружения с их значениями, как показано ниже, и не забудьте следовать формату REACT_APP, за которым следует имя переменной в змеином регистре, так как React требует их в этом формате для использования и нажмите сохранить:

Шаг 4: В вашем приложении вы должны иметь возможность использовать в компоненте следующее:

const ApiKey = process.env.REACT_APP_API_KEY 
Войти в полноэкранный режим Выйти из полноэкранного режима

Вот и все, теперь вы должны иметь возможность использовать скрытый API ключ в своем приложении, даже если оно размещено на Netlify.

Оцените статью
devanswers.ru
Добавить комментарий