@Vlad999777

Как использовать секретные переменные окружения на GitHub в приложении React?

В ветке main rent-car/.github/workflows
/deploy.yml я прописал переменную REACT_APP_PASSWORD, вот файл
name: Build and deploy to GitHub Pages

on:
  push:
    branches: [main]

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout ️
        uses: actions/checkout@v2.3.1
        env:
          REACT_APP_PASSWORD: ${{ secrets.REACT_APP_PASSWORD }}
      - name: Install, lint, build 
        run: |
          npm install
          npm run lint:js
          npm run build
       
      - name: Deploy 
        uses: JamesIves/github-pages-deploy-action@4.1.0
        with:
          branch: gh-pages
          folder: build


Переменную определил в секреты репозитория ..на гитхабе
Вот часть файла где испоьзуется переменная

const PASSWORD = process.env.REACT_APP_PASSWORD;

const HeroSection = () => {
  const [result, setResult] = useState("");
  const { t } = useTranslation();
  const handleSubmit = async (e) => {
    e.preventDefault();
    setResult("Sending....");

    const formData = new FormData(e.target);
    formData.append("access_key", PASSWORD);

Локально все ок, а на гитхабе не видит этой переменной и все ...причина?
  • Вопрос задан
  • 105 просмотров
Решения вопроса 1
У вас этот файл явно исполняется на клиенте (есть состояние и обработчик события), а на клиенте никакого process.env нет (при этом я не понимаю как может быть "локально всё ок"). А даже если бы и был, все эти телодвижения лишены смысла - вы свой секретный токен передаёте на клиент и там вставляете в данные формы, то есть он уже совсем никакой не секретный.
Что либо секретное не должно покидать сервер и, соответственно, без сервера не реализовать ничего секретного.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы