这个需求很常见,我们浏览自己写的博客文章的时候发现有些错误,此时想修改一下,所以必须得先登录才行。点击登录按钮后跳转到登录页面,登录成功后自动跳转到之前文章所在页面。
实现方法就是在登录页面通过document.referrer获取进入到此页面前的地址,然后将地址写入到隐藏的表单元素中,提交表单后地址自然就传到后台了,后台判断登录成功后跳转到传过来的地址就可以了。
signin.html页面
html代码,表单元素中增加
<form class="form-signin" action="/user/signin" method="post">
...
<input id="referrer" type="text" name="referrer" class="form-control" style="display:none;">
<button id="signin" class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
...
</form>
script中增加
$('#referrer').val(document.referrer);
路由
app.use(route.post('/user/signin', User.reqSignin))
后台处理登录
用户名和密码验证通过后,如果referrer存在则redirect到referrer地址,不存在则跳转到主页
module.exports.reqSignin = async function(ctx) {
const req = ctx.request.body
if (req.username.length == 0 || req.password.length == 0) {
ctx.body = 'username or password error'
} else {
let result = await UsersModel.getUserByName(req.username)
if (!result) {
console.log('user not find')
ctx.redirect('back')
return
}
if (sha1(req.password) !== result.password) {
console.log('password error')
ctx.redirect('back')
return
}
delete result.password
ctx.session.user = result
if (req.referrer) {
ctx.redirect(req.referrer);
} else {
ctx.redirect('/');
}
}
}