Javascript 使用jwt身份验证时如何在登录后重定向

我有一个Node.js后端服务器，它使用JWT进行身份验证。当我发送登录请求并接收令牌时，为应用程序构建前端时，我将其存储在浏览器的localStorage中，之后我想重定向到仪表板，但我面临的问题是，由于仪表板路由受保护，它需要令牌，但Js redirect方法不允许任何头。那么，我应该如何解决这个问题呢

const submit = document.getElementById("submit");

if (!localStorage.getItem("token"))
    localStorage.setItem("token", "");

submit.addEventListener('click' , (e) => {
   const email = document.getElementById("email").value;
   const password = document.getElementById("password").value;
   e.preventDefault();
   const data = {
      email,
      password
   }
   axios.post('/api/user/login', data)
      .then((res) => {
            document.getElementById('login_form').reset();
            console.log(res.data);
            if (res.data.success) {
               localStorage.setItem("token", res.data.token);
               document.window.location.href = '/organizer/dashboard';
            }
         })
      .catch((err) => {
         console.log(err);
         })
});

成功登录请求后收到的JSON：

{
    "success": true,
    "token": "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjViNTQzMWE1OTA0ZjkzMDQwOWM2OWU0NCIsIm5hbWUiOiJyYXNpayByYWoiLCJlbWFpbCI6ImZpc3J0QGdtYWlsLmNvbSIsImFjY190eXBlIjoib3JnYW5pc2VyIiwiaWF0IjoxNTMyMjQ4Mjc3LCJleHAiOjE1MzIyNTE4Nzd9.RHBMlVXXo-1YpwxnJbPdZ2VJ6Yt7aqTNJ3o6OzbXk4M"
}

---

我想你在找这个

 <Switch>
  <PrivateRoute exact path="/dashboard" component={Dashboard} />
 </Switch>

您可以将您的私有路由包装在交换机中，然后只要输入您希望它通过身份验证的路径以及要加载的组件即可

看看这个，这会很有帮助的

---

这里是一个自定义中间件及其用法的示例

创建令牌并在cookie中设置它：

function createAuthToken(id, agent, guidUser) {
    var sign = config[env].signature;
    var package = { 'device': id, 'access': 'authenticated', 'agent': agent, 'user': guidUser }
    return jwt.sign(package, sign, { expiresIn: '90 days' });
};

app.post('/authenticate', function (req, res) {
    var body = req.body;
    var updatedToken = createAuthToken(body.device, body.userAgent, body.user);
    var newDate = new Date();
    var expDate = newDate.setMonth(newDate.getMonth() + 3)
    res.cookie('id', updatedToken, { sameSite: true, maxAge: expDate });
    res.send({ Success: true})
});

中间件（Nodejs）：

然后在所有要使用此身份验证的路由上：

app.post('/authedcall', authenticateRoute, function (req, res) {
    res.send({ Success: true })
});

app.post('/unauthedcall', function (req, res) {
    res.send({ Success: true })
});

经过身份验证的路由：

app.use('/loginroute', express.static(__dirname + "/login")); //no auth
app.use('/dashboard', authenticateRoute, express.static(__dirname + "/dash")); //auth route

---

dashboard是来自node的路由吗？@Ohjay44是的，我正在为FrontEnd使用模板引擎（hbs）。如果您将令牌存储为安全cookie，则可以使用middleware@Ohjay44然后使用该中间件检索令牌并将其添加到每个请求头中？是，一旦你有了中间件，你就可以在你想要令牌的每个路由中使用它。我有一个我使用的自定义中间件。我可以提供一个例子，如果你想我没有使用react，它只是香草javascriptYikes，我不知道为什么我认为你在使用react。这样做容易多了

app.use('/loginroute', express.static(__dirname + "/login")); //no auth
app.use('/dashboard', authenticateRoute, express.static(__dirname + "/dash")); //auth route