EJS и connect-flash не работают должным образом
Я пытаюсь обернуть свой мозг вокруг шаблонов и флеш-сообщений, используя EJS и connect-flash, а также экспресс и экспресс-сессию, но я не могу заставить его работать так, как я хочу или ожидал.
Когда я определяю флэш-сообщение, я его укачиваю, и вижу это прекрасно. Но когда я пытаюсь распечатать его в моем шаблоне, req.flash
является пустым объектом [объект Object].
Флэш-сообщение в console.log после неудачной попытки входа в систему:
flash(): { error: [ 'Brugernavn eller adgangskode er ikke korrekt.' ] }
Но когда я пытаюсь перебрать flash
в моем шаблоне ejs с чем-то вроде
<% flash.forEach(function (message) { %>
<p><%=message%></p>
<% }) %>
Выше возвращается ошибка на
TypeError: C:\path\to\my\stuff\auth-test\views\login.ejs:7
[snippet with line indicator, not important]
flash.forEach is not a function
serve r.js
const myExpress = require('express')
const myApp = myExpress()
const myBodyParser = require('body-parser')
const flash = require('connect-flash')
const mySession = require('express-session')
const myLogger = require('morgan')
const myFs = require('fs')
const myPath = require('path')
const myEjs = require('ejs')
const myLRU = require('lru-cache')
const myAccessLogStream = myFs.createWriteStream(myPath.join(__dirname, 'logs', 'access.log'), { flags: 'a' })
const myPort = process.env.PORT || 1337
const myAuthCheck = function (myRequest) {
if (!myRequest.session || !myRequest.session.authenticated) {
return false
}
else {
return true
}
}
myApp.engine('ejs', require('express-ejs-extend'))
myApp.set('view engine', 'ejs')
myEjs.cache = myLRU(100)
myApp.use(flash())
myApp.use(mySession({ secret: 'meget hemmelig streng', resave: true, saveUninitialized: true }))
myApp.use(myBodyParser.urlencoded({'extended': 'true', limit: '50mb'}))
myApp.use(myBodyParser.json())
myApp.use(myBodyParser.json({ type: 'application/vnd.api+json', limit: '50mb' }))
myApp.use(myLogger('combined', { stream: myAccessLogStream }))
var hourMs = 1000 * 60 * 60
myApp.use(myExpress.static(__dirname + '/public', { maxAge: hourMs }))
require('./routers/frontendRouter')(myApp, myAuthCheck)
myApp.listen(myPort)
console.log('Serveren kører på http://localhost:' + myPort)
frontendRouter.js
(обратите внимание на маршруты.post и.get для '/ login')
const fetch = require('node-fetch')
module.exports = function (myApp, myAuthCheck) {
myApp.get('/', function (myRequest, myResponse) {
myResponse.render('home', { title: 'Hello, World!', data: 'Something wicked this way comes!' })
})
myApp.get('/test', function (myRequest, myResponse) {
myResponse.render('article', { title: 'Dette er en test', data: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor veniam voluptatibus vel omnis nostrum maiores, placeat! Nam ea asperiores, sint, aut reprehenderit eos, facere ipsum in, ratione sunt ab fugiat?'})
})
myApp.get('/profile', function (myRequest, myResponse) {
if (!myAuthCheck(myRequest)) {
myResponse.render('403', { title: 'Adgang forbudt', status: 403 })
}
else {
myResponse.render('profile', { title: 'Profil' })
}
})
myApp.post('/login', function (myRequest, myResponse) {
if (myRequest.body.username && myRequest.body.username === 'admin' && myRequest.body.password && myRequest.body.password === '1234') {
myRequest.session.authenticated = true
myResponse.redirect('/profile')
}
else {
myRequest.flash('error', 'Brugernavn eller adgangskode er ikke korrekt.')
console.log('flash():', myRequest.flash())
myResponse.redirect('/login')
}
})
myApp.get('/login', function (myRequest, myResponse) {
myResponse.render('login', { title: 'Log ind', flash: myRequest.flash() })
})
myApp.get('/logout', function (myRequest, myResponse) {
delete myRequest.session.authenticated
myResponse.redirect('/')
})
}
login.ejs
<% extend('layout') %>
<section>
<h1><%=title%></h1>
<form action="" method="post">
<p><input type="text" name="username" placeholder="Brugernavn"></p>
<p><input type="password" name="password" placeholder="Adgangskode"></p>
<% flash.forEach(function (message) { %>
<p><%=message%></p>
<% }) %>
<button type="submit">Log ind</button>
</form>
</section>
РЕДАКТИРОВАТЬ:
У меня console.log()'ed req.flash() как на отправляющей, так и на принимающей стороне:
myApp.get('/login', function (myRequest, myResponse) {
console.log('flash():', myRequest.flash())
myResponse.render('login', { title: 'Log ind', flash: myRequest.flash() })
})
И результат на приемном конце
flash(): {}
1 ответ
Значение, возвращаемое из flash()
это объект:
{ error: [ 'Brugernavn eller adgangskode er ikke korrekt.' ] }
Таким образом, для обработки и отображения ошибок вы должны использовать что-то вроде этого:
<% (flash.error || []).forEach(function(message) { %>
<p><%=message%></p>
<% }) %>
Или немного более явно (только передавая сообщения об ошибках в шаблон):
// code
res.render('template', { errors : req.flash('error') || [] });
// template
<% errors.forEach(function(message) { %>
<p><%=message%></p>
<% }) %>
Чтобы решить проблему пустого объекта в GET /login
убедитесь, что вы не звоните req.flash()
где-то между установкой и получением (как, например, console.log
об этом). Как только вы позвоните req.flash()
все сохраненные сообщения удаляются (очень недокументированные, но вот как req.flash()
вела себя в Express 2.x, который connect-flash
пытается подражать).