Question

我已经创建了一个node.js应用程序，并成功定义了带有令牌的受保护路由。我可以通过POSTMAN运行它。我试图了解如何将其集成到HTML页面中，然后登录并调出受保护的路由以在HTML页面上显示而不是使用POSTMAN。我正在创建一个html网站并希望用户登录，然后他们可以访问页面中的某些链接。

我的app.js

app.post('/api/posts', verifyToken, (req, res) => {  
jwt.verify(req.token, secretKey, (err, authData) => {
  if(err) {
    res.sendStatus(403);
  } else {
    res.json({
      message: 'Post created...',
      authData : authData,
      
    });
    
  }
});

}）;

app.post（'/ api / login'，（req，res）=> { //模拟用户

var email=req.body.email;
var password=req.body.password;

const userdata = {
   
 email: email,
 password: password
}

console.log(userdata);
jwt.sign({userdata}, secretKey, (err, token) => {
  res.json({
    token
  });
});

}）;

我的HTML

<html>
<head>

</head>
<body>
    <div>
        <h1>Portal API Test site</h1> 
        
        <form action="/api/posts", method="POST">
            <h2>Getting from Header</h2>
            <input type="submit" value="Submit", >
        </form>
    </div>
</body>

Answer 1

首先，我建议您至少使用一个小型框架来简化工作，例如react，svelte ...否则，您可以使用jQuery来做到这一点。

要登录用户，您需要将JWT保存在cookie或localStorage中。这不是一项艰巨的任务，但请记住使用Bearer Token设置受保护路由上每个请求的标头

您可以按照以下示例操作：https://github.com/chaofz/jquery-jwt-auth/blob/master/index.html

localStorage.setItem('token', yourTokenresponseFromExpress);

如何将HTML页面与JWT Node JS Auth集成？

1 个答案: