首页 文章

nuxtjs和后端API之间的授权

提问于
浏览
8

我有一个使用Nuxtjs创建的Vuejs应用程序 . 我也使用Django作为后端服务器,我创建了一个API来与后端服务器(Django)和前端应用程序(Vuejs / Nuxtjs)进行交互 . 任何API相关的提取都在页面的 AsyncData function 中完成,以使用axios在服务器端呈现数据 . 此外,我正在使用json Web令牌身份验证,并且API在成功登录后生成一个jwt令牌,该令牌存储在cookie中 . 因此,在后端,它将始终检查令牌的请求的授权标头 . 如果请求来自登录用户(授权令牌),则返回经过身份验证的json数据,否则返回未经过身份验证的数据 .

问题:

当用户导航到应用程序时,我想检查用户是否经过身份验证 . 如果用户已通过身份验证,请呈现经过身份验证的页面 . 如果没有则显示未经过身份验证的页面 .

我的想法:

当从 AsyncData function 上的应用程序完成提取时,我会检查cookie是否有任何值 . 如果有,则发送带有请求的授权标头的令牌 . 但是,由于页面将首先在服务器上呈现,而不是在客户端(cookie实际上在哪里)呈现,因此它永远不会找到授权令牌 .

如何检查用户是否已登录,以便我可以分别从API获取经过身份验证和未经过身份验证的数据?

Update

当我成功登录(发布授权的电子邮件和密码)后,我得到一个带有令牌的json响应,我在cookie中设置如下:

this.$cookie.set('my_auth_token', this.token, {expires: 15})

如何检索客户端cookie并进入服务器端渲染的nuxt服务器?

2 回答

  • 2

    Cookie通过中间件暴露在(Express)Nuxt服务器中 .

    具体来说,可以从 req.headers.cookie 属性中读取它们 . 您可以在Nuxt documentation中看到此示例实现 .

    关于您的实现:使用Node从API获取特权数据似乎是将会话处理委派给该单个服务(而不是两者)的理想方式,并为您的用户提供SSR .

    如果你需要通过将你的cookie传递到你的 axios 请求 Headers 来've chosen to instead implement your session handling on the Django service then you' .

  • 0

    我使用Firebase身份验证做了类似的事情 . 在Github上有example project以及a blog entry概述了应用程序中使用的重要文件和配置 .

相关问题