В какой момент проверять валидность и срок жизни токена vue.js?

Question

[DaBags]

Изучаю vue.js и имеется функционал регистрации / авторизации по api. Бэк находится на другом сервере и хотелось бы перед отправкой запроса сделать сначала проверку токена на фронте (валидность и срок жизни), хотя бы насколько этой возможно. Для декодирования токена использую jwt-decode

Пока в голову приходит только такое

const token = localStorage.getItem('token');
        if (token) {
            const decoded = jwt_decode(token);

            if (typeof decoded !== 'object') {
                // если маршрут требует авторизации, то отправляем на страницу авторизации
            } else {
                let shelfLife = decoded.exp * 1000, 
                    currentDate = new Date();

                if (shelfLife < currentDate) {
                    // делаем запрос на обновление токена
                }
            }
        }

И выполнять этот код глобальных навигационных хуках router.beforeEach

Правильный ли это подход и как вообще делать проверку токена в таких случаях? Либо стоит просто в любом случае отправлять запрос на бэк и уже там проверять токен?

Answer 1

[WbICHA]

Зачем создавать себе геморой на ровном месте, когда можно дождаться ответа от сервера и обработать его ответ? Тем более, что эту проверку тебе придётся делать при КАЖДОМ запросе, иначе в ней вообще нет смысла. И та же самая проверка будет проводиться сервером.
Так для чего тащить логику бека на фронт?

Comments

[WbICHA]

И да, причём здесь вью?

[DaBags]

В этом и состоит вопрос. Стоит ли заниматься таким на фронте? Не получит ли обычный пользователь доступ туда куда не нужно (какие то страницы для администратора, кнопки), пусть и даже если у него функционал не будет работать?

[WbICHA]

DaBags, во-первых, каким образом пользователь вообще сможет увидеть админскую панель, если не будет копаться в коде? Такого, естественно, допускать нельзя, но не из-за "безопасности", а из-за пользовательского опыта, который от некачественного продукта ухудшается. То есть именно обычный пользователь увидеть админку не должен.
Во-вторых, увидел пользователь админку без возможности её воспользоваться и что дальше? Как это повлияет на безопасность?
В-третьих, каким образом ты вообще собрался полноценно валидировать токен на фронте? А точнее каким образом ты собрался это делать безопасно? И, главное, зачем? Какой в этом вообще плюс? Даже если бы это было безопасно, это двойная работа, двойная имплементация одного и того же функционала.

[DaBags]

WbICHA,
1. Исхожу из того опыта что есть люди которые любят копаться в коде и пытаются что-то стащить себе или найти баги/дыры. Соответственно хотелось бы сделать какую то защиту, пусть и минимальную
2. Возможность увидеть какие-либо данные, которые ему видеть не следует (данные пользователей, статистика)
3. В первом сообщении привел пример разбора токена и проверки. Т.к. опыта подобной разработки у меня нет я и пришел сюда за советом, возможно разъяснениями как лучше поступить в данном случае.

Вас я услышал, спасибо.

[WbICHA]

DaBags,
1. Люди, которые любят копаться в коде, над минимальной защитой максимум посмеются. Что им помешает вырезать эту проверку с фронта?
2. И каким образом юзер может увидеть дополнительную инфу, к которой у него нет доступа? Только если сервер дырявый и не авторизирует пользователя при каждом запросе.
3. Ещё раз, любая проверка креденшилов на фронте, это защита на уровне этой калитки:

[DaBags]

WbICHA, спасибо за разъяснения, пожалуй так и буду делать (проверку только на бэке).

Ещё вопрос к вам: при использовании групп пользователей (ролей: админ, модератор, юзер) их передавать в токене и стоит ли их отдельно куда-либо записывать (в тот же localstorage) или оставлять в токене и декодить каждый раз для вывода к примеру кнопок доступных только для определенной группы?

[WbICHA]

Перед ответами на данные вопросы сразу скажу, что я не архитектор, и разработчиком с 10+ летним стажем я не являюсь, к тому же ещё и бекендер в первую очередь, так что ниже, возможно, я несовсем прав.

при использовании групп пользователей (ролей: админ, модератор, юзер) их передавать в токене

DaBags, нет. Если ты подобную инфу будешь хранить в токене, то ты ей либо не будешь пользоваться вообще, либо она рано или поздно окажется устаревшей. И второе принесёт тебе много проблем, когда один из пользователей или не дай бог модератор начнёт буйствовать, ты его забанишь, но он по прежнему будет творить дичь, поскольку все проверки закончатся на токене и до проверки в базе, где будет висеть инфа о бане, дело не дойдёт. В итоге до тех пор, пока жвт жив, у человека будет полный доступ к сайту.

стоит ли их отдельно куда-либо записывать (в тот же localstorage) или оставлять в токене и декодить каждый раз

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