我正在尝试实现一种只允许授权管理员在我的Web App / API中访问包含敏感信息的页面的方法。我目前正在使用带有Express的Node.JS来处理路由。使用Jade / Pug View Engine生成视图。使用github上的请求框架处理CORS请求。 (https://github.com/request/request)
目前,客户端存储在MongoDB集合中。当他们输入登录信息时,他们的密码将与存储在数据库中的哈希进行比较。如果所有内容都检出,则会为用户生成JWT并保存在客户端数据库中,并在localStorage.token
中存储在浏览器中。
然后将用户重定向到具有身份验证功能作为中间件的启动页面。身份验证功能以三种形式接受令牌:
var token = req.body.token || req.query.token || req.headers['x-access-token'];
我觉得重定向的处理方式有点笨拙。我正在使用window.location = route?token = [token]
令牌被移交给req.query.token中的身份验证功能,但这是在URL中公开的。这是我的登录功能:
function submitLogIn() {
var credentials = {
email: logInForm.userEmail.value,
password: logInForm.pwField.value
}
fetch('/login', {
headers:{
'Content-Type': 'application/json'
},
method: 'POST',
body: JSON.stringify(credentials)
}).then(function(res){
if(!res.ok) alert("Error!")
else return res.json().then(function(result){
localStorage.token = result.token;
//This is how I'm doing redirecting:
window.location = '/selection?token=' + result.token;
}).catch(function(err){
console.log(err);
throw err;
});
});
仅供参考,这是它在端口3001上的前端路由,它作为反向代理请求将其转换为3000:
router.post('/login', function(req, res, next) {
request.post({
url: 'http://localhost:3000/authorize',
form: req.body
}).pipe(res)
});
我的主要问题是:如何在fetch调用中处理前端的重定向?
我的启动画面基本上是一个按钮菜单,可以将用户带到不同的页面。这些页面将包含只有管理员才能看到的信息。我们想说我想点击这个导航按钮。它转到/ GET路由,需要将令牌发送到OK状态。如果没有令牌,则返回403.
router.get('/main', authorize.adminRequired, function(req, res, next) {
request.get({
url: 'http://localhost:3000/menus'
}, function(response, sensitiveItems) {
return res.render('index', {menu: JSON.parse(sensitiveItems)});
});
});
authorize.adminRequired函数需要查询,x-access-token或req.body形式的令牌。无法在GET请求中发送正文。不想在URL中公开,所以:
这是我尝试过的。我有这个重定向提取调用作为onclick函数。
function redirectToSensitivePage() {
fetch('/main', {
headers: {
'x-access-token': localStorage.token
},
method: 'GET'
});
};
这给了我一个200,好的。但是我没有加载页面。路线中的res.render(索引)不会触发。响应确实包含所有数据,但我没有重定向到可视化表示。
我可以使用window.location = / main?token = [token]执行相同的hacky重定向,但我不想公开URL令牌。我可以在登录时加载我需要的所有内容而不是单独的页面,将这些div隐藏在视线之外,直到按下按钮使div成为主要的可见div,但我宁愿弄清楚如何通过重定向来实现。
我仍然在使用Node,但如果我做了任何愚蠢的明显疏忽,请告诉我。
编辑:我应该试试吗
var token = localStorage.token || req.body.token || req.query.token || req.headers['x-access-token'];
从每个请求中自动从localStorage中抓取是否有任何不利之处?