Вчера нашим ежедневным проектом было создание формы входа. Я отписал, что очень растерялся. Я хочу пройтись по некоторым основным частям, которые меня действительно сбивали с толку, и попытаться объяснить это.
Я собираюсь пройтись по блокам кода, не обязательно сверху вниз, но таким образом, который описывает последовательность происходящих действий.
app.use( function (req, res, next) { if (req.session.user){ next() } else { res.redirect('/login'); } });
Первое, что должно решить приложение, — вошел ли пользователь в систему или нет. Это была работа некоторого промежуточного программного обеспечения. После проверки того, вошел ли пользователь в систему, он будет перенаправлен либо на next(), либо на страницу входа. Идея промежуточного программного обеспечения поначалу меня очень сбивала с толку. Мое элементарное понимание этого сейчас заключается в том, что это в основном то, что приложение делает до фактического выполнения GET или POST. В этом случае я проверяю, есть ли у сеанса логин от пользователя. Req.session.user также действительно сбил меня с толку. Я до сих пор не до конца это понимаю, но если я отношусь к этому как к билету, который пользователь носит с собой, который я ему дал, то это, кажется, имеет смысл. Поскольку я запускаю локальный node.js без какой-либо базы данных, у меня никогда не бывает постоянных входов в систему, поэтому первая часть оператора if, которая имеет next(), никогда не сработает. Пользователь всегда будет перенаправлен на логин.
Идея next() была немного объяснена сегодня. Суть в том, что мы можем сделать ряд «вещей», а затем отправить их на страницу до того, как произойдет GET. Это кажется очень расплывчатым и «бессмысленным», но это все, что у меня есть на данный момент.
Я также столкнулся с большой ошибкой здесь. Это первый раз, когда я столкнулся с Javascript, где порядок появления кода в текстовом редакторе имел значение. Если app.use находится на строке перед app.get(‘/login’), то я получаю ошибку заголовков. Я не совсем понимаю, почему, кроме того, что страница должна быть «отрисована», прежде чем на нее можно будет перенаправить.
var users = [ {userName: 'josh', password: '123'}, {userName: 'jess', password: 'password'} ] app.post('/authenticate', function(req, res){ let user = false; for (var i = 0; i < users.length; i++) { if (users[i].userName === req.body.userName) { if (users[i].password === req.body.password) { user = users[i] } } } if (user){ console.log("Found user: ", user) req.session.user = user; res.redirect("/index") } else { console.log("did not find user ", user) res.render("login") } })
Следующий фрагмент кода — это то, что я никогда бы не подумал написать самостоятельно. Вверху блока я добавил способ хранения пользовательской информации. Опять же, я еще не работаю с базой данных, поэтому я просто храню информацию о пользователе в своем JS-файле.
На странице входа я создал элемент HTML-формы с действием для запуска аутентификации. При отправке этой формы этот блок app.post запускается. Во-первых, предполагается, что пользователь не существует, используя user = false. Поскольку пользователи находятся в массиве, я использую цикл for для сканирования по нему в поисках любого из имен пользователей, которые соответствуют вводу пользователя в HTML (это обозначается req.body.UserName). Как только имя пользователя найдено, я проверяю правильность пароля. Если проверка имени пользователя и пароля, я устанавливаю user = для объекта, который содержит имя пользователя и пароль. Теперь пользователь больше не фальшивый.
В следующем операторе if я проверяю, что пользователь существует. У меня есть пользователь в исходном состоянии false, поэтому, если первый оператор if не срабатывает полностью, у меня все еще есть пользователь, установленный на false, и он вызовет оператор else, который регистрирует, что я не нашел пользователя и визуализирует экран входа в систему. Если я нашел пользователя, я установил его в req.session.user = объекту пользователя. По сути, пользователь прошел аутентификацию и направляется к индексу с билетом в руке, показывающим, что он действителен.
Безусловно, аутентификация была для меня самой сложной частью этого проекта. Кто-то провел меня через это, и мне все еще приходилось возвращаться несколько раз, чтобы действительно понять, что происходит. Я создал кнопку выхода из системы для пользователя, которая была так же проста, как вызов функции req.session.destroy().
В целом, сегодняшний день был намного лучше. У меня нет молниеносных моментов ясности, но кажется, что туман медленно рассеивается. Я работал над своим еженедельным проектом по созданию игры про палача и сегодня сделал основную часть, что было очень приятно. Я надеюсь, что мне скоро придется снова создать форму входа, чтобы попрактиковаться с ними.
Завтра я также приму участие в своем первом мероприятии по программированию за пределами Iron Yard. Я и несколько моих одноклассников собираемся на Data Jam. Я чувствую себя немного напуганным этим, но это должно быть весело с моими друзьями, окружающими меня.