Блог

Главная - Вопросы по программированию - Как управлять процессом обслуживания с помощью React

Как управлять процессом обслуживания с помощью React

#reactjs #react-router #maintenance #maintenance-plan #maintenance-mode

Вопрос:

Вот текущий способ управления процессом обслуживания моего приложения:

У меня есть переменная среды для статуса приложения:

 REACT_APP_SITE_MODE=“LIVE” | “MAINTENANCE”

Я использую react-router для маршрутизации приложения:

 switch (process.env.REACT_APP_SITE_MODE) {
  case "MAINTENANCE":
    return (
      <Switch>
        <Route component={MaintenancePage} />
      </Switch>
    );
  default:
    return (
      <Switch>
        {/* Default routes */}
      </Switch>
    );
}

Это работает нормально, но когда мы просто переключаем его в режим обслуживания, некоторые пользователи все еще могут получить доступ к приложению с маршрутами по умолчанию (это нехорошо, когда серверная часть отключена), я думаю, это из-за кэша браузера или чего-то в этом роде.

Мой вопрос таков:

  1. Как запретить пользователям доступ к приложению в течение периода обслуживания? (заставить их очистить свой кэш в это конкретное время?)
  2. Есть ли лучший способ справиться с процессом технического обслуживания?

Спасибо.

Комментарии:

1. Одним из вариантов было бы всякий раз, когда вы запрашиваете серверную часть, обнаруживать конкретную ошибку, указывающую режим обслуживания, и отображать там соответствующую ошибку.

2. это хорошая идея, в этом случае мне нужно знать, как BE ведет себя во время обслуживания, а затем решить, что делать с пользователем (перенаправить, перезагрузить или показать ошибку). хорошо, я понял, спасибо.

Ответ №1:

Я думаю, что вам лучше всего иметь состояние обслуживания как для BE, так и для FE:

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

Таким образом, в случае кэширования браузера (ваш сценарий), даже если он может перейти на обычные маршруты, в следующий раз, когда FE отправит запрос, он будет перенаправлен на вашу страницу обслуживания.

Метки: