JavaScript: храни ключ API в файле .env
Не пиши ключ в код. .env, .gitignore и переменная Vercel.
Все уроки · Уроки JavaScript: учимся с нуля
Ключ не должен быть в коде
Писать ключ внутри JavaScript можно только для тренировки на своём компьютере. Как только он попадёт на GitHub, боты найдут его за секунды. Чужой шлёт запросы твоим ключом, лимит и баланс кончаются. Если ключ в видимой части сайта, его увидит каждый через F12. Запрос должен идти в фоне, на сервере.
Файл .env
Файл называется .env, не ad.env. Он лежит в главной папке проекта. Имя пишется большими буквами, слова разделяются _. Без кавычек, точки с запятой и const. Код читает его через process.env.GEMINI_API_KEY. В чистом Node.js сначала npm install dotenv, потом import "dotenv/config".
GEMINI_API_KEY=acar const apiKey = process.env.GEMINI_API_KEY;
GitHub и Vercel
В .gitignore напиши .env и .env.local. Тогда код уходит, а ключ остаётся на устройстве. В Vercel: Settings, Environment Variables. Имя GEMINI_API_KEY, значение — сам ключ. После правки файла останови терминал и запусти снова, иначе результат будет undefined. В Next.js не пиши NEXT_PUBLIC_ перед ключом: так он попадёт в браузер.
node_modules .env .env.local
Вопросы
Можно ли писать const и кавычки в .env? Нет. Только ИМЯ=ЗНАЧЕНИЕ. Пробел рядом со знаком равенства тоже не ставь.
Почему process.env даёт undefined? Файл только что изменился, а сервер держит старое. Закрой терминал и запусти снова.
Почему NEXT_PUBLIC_ опасно? Это слово отправляет переменную в браузер. На секретном ключе его не используй.
Где должен лежать ключ? На сервере, внутри process.env. Не в коде, который работает в браузере.