JavaScript: Является ли set-cookie и обработка ответов атомарной операцией?

Question

Я использую следующий шаблон для аутентификации без сохранения состояния с защитой CSRF:

1. Создание нового файла cookie JWT для каждого обработанного запроса
2. Создание нового токена CSRF для каждого обработанного запроса. Включите его в токен JWT и в заголовок ответа
3. . Утвердите, что токен CSRF в заголовке запроса совпадает с токеном в токене JWT

Код на стороне клиента извлекает токен CSRFот каждого ответа и включает его в каждый запрос. Свежий токен хранится в хранилище сессии браузера. Я немного обеспокоен тем, как cookie и токен перестают синхронизироваться на стороне клиента.

Рассмотрен следующий упрощенный пример

return axios.post(uri, payload, { headers: { 'X-CSRF-TOKEN': sessionStorage.getItem('X-CSRF-TOKEN') }})
    .then(response => sessionStorage.setItem('X-CSRF-TOKEN', response.headers['X-CSRF-TOKEN']))

Является ли обновление cookie браузера и обработка ответа обработкойатомарная операция с учетом модели цикла событий JavaScript? Или другие асинхронные запросы XHR могут использовать устаревшее значение токена для текущего файла cookie в предельном временном окне?

Answer 1

Модель цикла обработки событий позволяет запускать другой код до фактического выполнения response => sessionStorage.setItem('X-CSRF-TOKEN', response.headers['X-CSRF-TOKEN']), поскольку этот обратный вызов будет поставлен в очередь при получении ответа HTTP. Некоторые другие обратные вызовы, вызванные сетевым событием, таймером или пользовательским событием на странице, могли быть помещены в очередь.

Предполагается, что ваш сервер возвращает 403, когда не получает токен CSRF, поэтому вы можете реализоватьлогика «повторных попыток» для решения вашей проблемы.