Для хранения токена на период времени в 5 минут я бы порекомендовал использовать следующий подход:
1. Во-первых, вы можете сохранить токен в локальном хранилище браузера с помощью объекта localStorage. Токен будет сохраняться на стороне клиента и оставаться доступным даже после перезагрузки страницы. Для сохранения токена в localStorage вы можете использовать следующий код:
// Сохранение токена в localStorage
localStorage.setItem('token', YOUR_TOKEN_VALUE);
2. Во-вторых, вы можете связать хранение токена с временным ограничением, чтобы он автоматически удалялся через 5 минут. Для этого вам потребуется использовать функцию setTimeout() и метод removeItem() объекта localStorage. Пример кода:
// Сохранение токена в localStorage
localStorage.setItem('token', YOUR_TOKEN_VALUE);
// Удаление токена через 5 минут
setTimeout(function() {
localStorage.removeItem('token');
}, 5 * 60 * 1000); // 5 минут в миллисекундах
Этот код устанавливает таймер, который после 5 минут удалит токен из localStorage. Если пользователь закроет вкладку или перезагрузит страницу, то таймер будет сохраняться, и токен будет удален через заданное время.
3. Не забудьте также добавить проверку наличия токена при каждом обновлении страницы или переходе между различными компонентами в вашем приложении Vue.js. Используйте метод getItem() объекта localStorage, чтобы проверить наличие сохраненного токена:
// Проверка наличия токена в localStorage
var token = localStorage.getItem('token');
if (token) {
// Токен найден - выполнить нужные действия
} else {
// Токен отсутствует - выполнить действия для неавторизованного пользователя
}
Таким образом, использование localStorage с таймером setTimeout() позволяет сохранить токен в течение 5 минут и автоматически удалить его после истечения этого времени. Это обеспечивает безопасность хранения токена и предотвращает его использование после истечения срока действия.