在Django + GraphQL + Vuejs中处理身份验证

问题描述

我目前正在使用此堆栈开发应用程序（SPA）： Django - GraphQL (graphene-django) - Apollo - VueJS

我最终要进行身份验证，感觉完全迷失了。

我认为有两种方法：

使用来自Django的内置Session系统，但我不知道如何在前端（VueJS中可以在Vuex中拥有状态变量）中获取它的状态（无论是否登录），并且即使有可能。
使用JWT

我目前正在尝试JWT，但是我再次感到完全迷失，因为我读过许多文章说将令牌存储在localStorage或sessionStorage中不是一个好主意。我以这种方式学习了几本教程，然后遇到了一个问题，当第一个过期时，如何获得令牌？就状态而言，我可以在Vuex中处理一个状态变量，该变量调查了localStorage，... 但是由于我读过这种方法不好（XSS攻击，...），所以我决定使用cookie来完成。再一次，我迷路了！当我设法通过jwt_cookie（）获得一次cookie时：

它很快过期，我不知道如何处理它的刷新，也不知道状态是否正确（我是否登录？）

目前，我是这样做的：

带有jwt_cookie的URL：

urlpatterns = [
    ...
    path('graphql',jwt_cookie(csrf_exempt(GraphQLView.as_view(graphiql=True,schema=schema)))),...
]

login（）方法：

    login () {
      this.$apollo.mutate({
        mutation: GET_TOKEN_AUTH,variables: {
          username: this.form.username,password: this.form.password
        }
      }).then(result => {
        this.LOGIN()
        this.$router.push({ name: 'Home' })
      }).catch(error => {
        console.log('error : ',error)
      })
    }

GET_TOKEN_AUTH突变：

const GET_TOKEN_AUTH = gql`
  mutation getTokenAuth (
    $username: String!,$password: String!
  ) {
    tokenAuth (
      username: $username,password: $password
    ) {
      token
    }
  }
`

LOGIN（）方法（vuex）：

    LOGIN: (state) => {
      state.isLoggedIn = true
    },

导航员：

router.beforeEach((to,from,next) => {
  if (to.matched.some(route => route.Meta.requiresAuth)) {
    if (store.state.isLoggedIn) {
      next()
      return
    }
    next('/login')
  } else {
    next()
  }
})

如果缺少代码部分，我可以为您提供更清晰的代码。在这里，我给出了最低要求。

我该怎么办？

尝试使用Django会话？在每个请求中都使用带有令牌的JWT吗？还是饼干？又如何？

我真的需要你的帮助。

谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

django django django-graphql-jwt graphene-django jwt jwt vue.js