时间戳

首页 > 解决方案 > 如何在使用 JWT 进行身份验证后呈现

javascript - 如何在使用 JWT 进行身份验证后呈现

问题描述

在 Nodejs 和 Express 中的应用。使用 JWT 进行身份验证。我已经使用 JWT 和 Postman 实现了身份验证系统，它运行良好。当通过请求身份验证中间件并通过管理我要呈现的页面的 GET 的控制器后，问题就出现了，我收到响应并处理返回文本字符串的 res.text()。在文本字符串中，我得到了我想要的完整页面，我用 document.write (resBody) 渲染它，这会用新页面更新内容，但既不更新历史记录也不更新浏览器窗口，这有点拙劣。有什么方法可以在 javascript 中呈现响应？谢谢

// index.hbs
...
...
...
<form id="enter"  enctype="multipart/form-data" name="enter">
    <input type="submit" value="Entrar"> 
</form>

<script type="text/javascript">
    const formEnter = document.querySelector('#enter')
    formEnter.addEventListener('submit',function(event){
        token = "Bearer " + localStorage.getItem('token')
        fetch('/api/brands',{
            method:'get',
            headers: {
                'Content-Type':'application/json;charset=UTF-8',
                'Authorization': token
            }
    .then(function(response) {
       return response.text()
    }).then(resBody => {
       document.write(resBody)  //<--- resBody tiene la página que quiero renderizar
    })
</script>


//brandCtrl.js

...
...


function getBrands(req,res){
    Brand.find({}, (err,brands) => {
        if (err) return res.status(500).send({message: `Error en la petición: ${err}`})
        if (!brands) return res.status(404).send({message: `No se existen Marcas en la BD`})

        res.locals.brands = brands
        res.render("brands/brands",res.locals.brands)
    })
}


...
...

标签： javascriptnode.jsexpressjwt

解决方案

不确定“在 javascript 中呈现响应”是什么意思。您可以期望您的节点应用程序返回一个 json 响应（使用 res.json(YOUR RESPONSE JSON)）或在验证成功时呈现一个模板（res.render('some template')）。

您没有正确使用 fetch API。您的请求需要 JSON 响应，但您发送的是 html 字符串作为响应。

如果您想使用 javascript 呈现 html 页面。你可以使用jquery：

$('body').load( url,[data],[callback] );

您可以在此处查看文档。http://api.jquery.com/load/#urldatacallback

然后，您可以使用 history.pushState 更改浏览器历史记录。但是所有这些都已经由任何前端框架完成。因此，要么使用一个，要么手动执行此操作。

推荐阅读