Аутентификация пользователя с помощью веб-токенов JSON
В рамках совместного проекта я недавно имел удовольствие помогать проектировать и разрабатывать TailMe, веб-приложение, которое помогает профессиональным собаководам управлять своими клиентами. TailMe - это приложение Node.js с внутренним интерфейсом Express.js и интерфейсом React.js. Чтобы выделиться среди других услуг для собаководов, мы хотели сосредоточиться на перспективах собаководов, позволяя им управлять своим расписанием, управлять своими собственными тарифами и приглашать своих клиентов использовать веб-сайт. Мой вклад состоял в том, чтобы реализовать аутентификацию пользователей безопасным способом, сводя к минимуму объем работы, выполняемой приложением или серверами.
Для этого я решил использовать Passport.js, как и в других проектах. Однако на этот раз я хотел повысить безопасность, используя зашифрованные веб-токены JSON, установленные в локальном хранилище, которые можно было передавать в заголовке для всех вызовов на серверную часть и обратно. Passport предлагает модуль для этого, который сочетается с двумя другими ключевыми модулями. Троица - это паспорт, местный паспорт и паспорт-jwt. С использованием еще одного модуля, называемого просто jsonwebtoken, становится несложно аутентифицировать пользователей при регистрации, входе в систему или просто при навигации по веб-приложению.
Короче говоря, веб-токены JSON - это зашифрованные строки, которые представляют объект JavaScript с парами ключ-значение - идеально подходят для хранения чего-то вроде имени пользователя и зашифрованного пароля. Во время процесса регистрации пользователь выбирает свое имя пользователя и пароль, которые запускаются с помощью хэш-функции, которая возвращает неизвестную зашифрованную строку, которая затем отправляется на серверную часть в виде токена в заголовке. На бэкэнде Passport-jwt и jsonwebtoken выполняют работу по расшифровке строки / токена, сравнивая имя пользователя со всеми другими именами пользователей в базе данных, затем шифруют пароль и сохраняют его в базе данных. После всего этого новая информация шифруется как веб-токен JSON и отправляется обратно в заголовке для установки в локальное хранилище.
На каждом этапе навигации по веб-приложению мы, разработчики, хотим убедиться, что пользователь получает обратно только тот контент, который ему подходит. Таким образом, процесс отправки, сравнения и получения веб-токенов JSON происходит перед загрузкой каждой страницы. React.js как интерфейсный фреймворк упрощает это с помощью метода «componentDidMount» с условным рендерингом. Каждая страница, которую посещает пользователь, использует «async-await» с методом «componentDidMount», чтобы убедиться, что вошедший в систему пользователь видит то, что он должен видеть, при этом не позволяя тем, кто не вошел в систему, увидеть то, чего они не должны видеть.
Я многому научился в процессе исследования и внедрения веб-токенов JSON для TailMe. Кажется, что отраслевой стандарт для защищенных пользовательских страниц - это некая разновидность веб-токенов JSON, хранящихся в локальном хранилище, хранилище сеансов или в виде файлов cookie. Если вы ищете безопасную форму регистрации и входа в систему, изучите упомянутые мной модули. Нет необходимости изобретать велосипед. Удачного кодирования :)
