Обработка аутентификации в Django + GraphQL + Vuejs

В настоящее время я разрабатываю приложение (SPA) с этим стеком:Django - GraphQL (graphene-django) - Apollo - VueJS

Я оказался в точке, где я хочу настроить аутентификацию, и чувствую себя совершенно потерянным.

Думаю, есть 2 способа:

  1. Используя встроенную систему сеансов от Django, но я не знаю, как получить ее состояние (вошел ли я в систему или нет) во внешнем интерфейсе (VueJS, где я мог бы иметь переменную состояния в Vuex) и даже если это возможно.

  2. Использование JWT

В настоящее время я пробую JWT, но снова чувствую себя полностью потерянным, поскольку прочитал много статей, в которых говорится, что хранить токены в localStorage или в sessionStorage - не лучшая идея. Я начал с этого, следуя нескольким руководствам, и столкнулся с одной проблемой: как мне получить токен, когда истечет срок действия первого? Что касается состояния, я мог бы обрабатывать переменную состояния в Vuex, которая просматривала localStorage,... Но поскольку я читал, что это плохо (атаки XSS,...), я решил сделать это с помощью файлов cookie. Опять я заблудился! Хотя мне удалось получить cookie один раз с помощью jwt_cookie():

Срок его действия истекает довольно быстро, и я не знаю, как обрабатывать его обновление или состояние должным образом (я вошел в систему?)

В настоящее время я сделал это:

URL с jwt_cookie:

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 с токенами в каждом запросе? или в куки? И как?

Ребята, мне очень нужна ваша помощь.

Заранее спасибо.

0 ответов

Другие вопросы по тегам