Question

我已经克隆了vue-hackernews-2.0，这是一个具有SSR和vuex的Vue.js应用程序。

此应用listens on port 8080，而我的api服务器在本地开发环境中侦听3000。我正在尝试使用jwt在其中实现用户身份验证。

当客户端从api服务器接收令牌时，客户端状态会使用令牌进行更新，但是如何使服务器端状态知道用户已登录？

通常，如何同步客户端和服务器端状态？

我想到的一个丑陋的技巧是，当用户使用正确的凭据登录时，api服务器应该打开与 8080 服务器的套接字连接，并在服务器端触发状态更新？它是可接受/可扩展的解决方案吗？关于此的最佳实践是什么？

更多详细信息。 （a）在路由器中，我实现了导航卫士：

      ....
      if (router.app.$store.getters.isLoggedIn)  next()
      else  next('/login')
      ...

现在在“登录”页面上登录后，我将一个操作发布到我的api服务器（而不是端口8080上的vue服务器），并将令牌存储在客户端状态。但是，当我重新加载登录的仪表板页面时，它无法在服务器端状态找到令牌，上面的函数isLoggedIn返回false，并尝试呈现登录页面请参见上面的代码< / strong>，因此客户端DOM与服务器呈现的页面不匹配，并且客户端尝试在客户端重新呈现DOM。

Answer 1

好吧，你写你正在使用jwt。

因此服务器不需要知道用户是否已登录。

只要客户端在每个请求（标题，cookie，（正文））上都提供此jwt，服务器就可以授权这些请求。

要正确处理jwt，可以使用npm软件包：

const JWT = require('jsonwebtoken')

发行令牌：

const token = JWT.sign({
    userId: user.id,
    moreData: undefined,
  },
   'somRandomLongPrivateKey123', // protect it, env var?
  {
    expiresIn: '2d',
  })

用于验证令牌的中间件：

module.exports = async (req, res, next) => {
try {
  const payload = JWT.verify(token, 'yourprivatekey') 
  req.user = User.find(payload.userId) 

  next()

} catch(e) {
  return res.status(401).send('no valid token')  
}

将客户端Vuex状态同步到服务器端状态的最佳做法？

1 个答案: