javascript - 使用 express 和 node.js 在 ejs 模板中插入用户名
问题描述
我正在尝试在布局中插入用户名,我正在使用带有 node 和 express 的 ejs 模板。我尝试了以下方法:
MongoDB模型:
const mongoose = require('mongoose')
const Schema = mongoose.Schema;
var uniqueValidator = require('mongoose-unique-validator')
const bcrypt = require('bcrypt')
const UserSchema = new Schema({
username: {
type: String,
required: [true, 'Please provide username'],
unique: true
},
password: {
type: String,
required: [true, 'Please provide password'],
},
dateRegistered: {
type: Date,
default: new Date()
}
//image: String
});
UserSchema.plugin(uniqueValidator);
//encrypt password
UserSchema.pre('save', function(next) {
const user = this
bcrypt.hash(user.password, 10, (error, hash) => {
user.password = hash
next()
});
});
const User = mongoose.model('User', UserSchema);
module.exports = User
编辑:login.js:
module.exports = (req,res) =>{
res.render('login')
}
编辑:loginUser.js
const bcrypt = require('bcrypt')
const User = require('../models/User')
module.exports = (req, res) => {
const {
username,
password
} = req.body;
User.findOne({
username: username
}, (error, user) => {
if (user) {
bcrypt.compare(password, user.password, (error, same) => {
if (same) {
req.session.userId = user._id
res.redirect('/')
} else {
res.redirect('/auth/login')
}
})
} else {
res.redirect('/auth/login')
}
})
}
编辑:authMiddleware.js:
const User = require('../models/User')
module.exports = (req, res, next) => {
User.findById(req.session.userId, (error, user ) =>{
if(error || !user )
return res.redirect('/auth/login')
next()
})
}
编辑:redirectIfAuthenticatedMiddleware.js
module.exports = (req, res, next) =>{
if(req.session.userId){
return res.redirect('/') // if user logged in, redirect to home page
}
next()
}
编辑:index.js:
const loginController = require('./controllers/login')
const loginUserController = require('./controllers/loginUser')
app.get('/auth/login', redirectIfAuthenticatedMiddleware, loginController)
app.post('/users/login',redirectIfAuthenticatedMiddleware, loginUserController)
导航栏.ejs:
<% if(loggedIn) { %>
<p> <%= username %> </p>
<% } %>
结果是一个没有值的空段落编辑:添加的路由,通过控制器管理
解决方案
你的渲染功能在哪里?您需要将变量传递给模板。为此,使用 EJS 的解决方案是:
路由器处理程序
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
在模板页面:index.ejs
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
</body>
</html>
所以在你的情况下它应该是这样的
router.get('/', function(req, res, next) {
res.render('index', {
loggedIn: true
username: res.locals.username
});
});
然后
<% if(loggedIn) { %>
<p> <%= username %> </p>
<% } %>
推荐阅读
- jquery - jquery使用websocket实时拖放:多人同时拖动时出错
- html - 如何从控制器导轨中显示 collection_select 中的选项
- php - 迁移后显示安装页面的 Wordpress 站点
- node.js - 在 Heroku 中签出 GitHub 存储库
- java - 使用 Jsoup 更新 html 文件
- javascript - 即使有元素也无法访问 HTMLCollection
- windows - Windows:获取所有*当前*环境变量
- amazon-cloudformation - 将 CloudFormation 模板 (yaml) 转换为 cdk python 代码
- javascript - 有没有更简洁的方法在顶层定义 React Hooks useState?
- python-3.x - python3中VSCODE中没有终端输出