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

const express = require('express');
const jwt = require('jsonwebtoken');

const app = express();

// 其他中间件和路由定义

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

app.post('/login', (req, res) => {
  // 在此处验证用户的凭证

  // 如果凭证有效，则生成JWT令牌
  const token = jwt.sign({ user_id: 'user_id_value' }, 'your_secret_key');

  // 将令牌发送给客户端
  res.json({ token });
});

const verifyToken = (req, res, next) => {
  const token = req.headers['authorization'];

  if (!token) {
    return res.status(401).json({ message: 'No token provided' });
  }

  jwt.verify(token, 'your_secret_key', (err, decoded) => {
    if (err) {
      return res.status(403).json({ message: 'Failed to authenticate token' });
    }

    req.user_id = decoded.user_id;
    next();
  });
};

// 使用中间件验证JWT令牌
app.get('/protected', verifyToken, (req, res) => {
  // 在此处执行需要身份验证的操作
  res.json({ message: 'Protected route' });
});

fetch('/login', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ username: 'your_username', password: 'your_password' })
})
.then(response => response.json())
.then(data => {
  const token = data.token;
  // 将令牌保存到本地或使用其他方式存储
  // 发送带有JWT令牌的请求来访问受保护的路由
});