Как создать сеанс авторизации nuxt с PHP API - PullRequest
Новая
       36

Как создать сеанс авторизации nuxt с PHP API

0 голосов

У меня проблема с сохранением сеанса авторизации пользователя. Я использую «vuex-persistedstate» для сохранения состояний сайтов между обновлениями. Проблема в том, что я делаю входящий вызов PHP API с введенными от пользователя именем пользователя и паролем. PHP (Back-end) устанавливает токен аутентификации в локальном хранилище браузера, если вход выполнен успешно. Токен авторизации, имя пользователя и адрес электронной почты также сохраняются в состояниях магазина (чтобы они были доступны из любого места). Пользователь может взаимодействовать с сайтом, когда он вошел в систему, но после обновления промежуточное программное обеспечение отображает ошибку, определенную для несанкционированного доступа.

Самое сложное для меня - получить этот токен аутентификации из локального хранилища / состояния промежуточного программного обеспечения, чтобы я мог условно отобразить определенный шаблон / перенаправить пользователя соответствующим образом.

После обновления промежуточное ПО видит состояние магазина в качестве начальных значений, таких как {authToken: null, userName: null, email: null, etc ...}. Другая проблема заключается в том, что я не могу получить доступ к локальному хранилищу через «бэкэнд» nuxt.

Я попытался настроить начальный токен авторизации состояний хранилища, но после обновления промежуточное ПО всегда получает состояния хранилища в виде значений NULL.

промежуточный слой / auth.js 

export default function ({ store, redirect, rootState }) {
  if (!store.state.userToken) {
    return redirect('/login')
  }
}

магазин / index.js 

userId: null,
userEmail: null,
userToken: null

persistedState.js 

import createPersistedState from 'vuex-persistedstate'

export default ({ store, isHMR }) => {
  // In case of HMR, mutation occurs before nuxReady, so previously saved state
  // gets replaced with original state received from server. So, we've to skip HMR.
  // Also nuxtReady event fires for HMR as well, which results multiple registration of
  // vuex-persistedstate plugin
  // @see https://webpack.js.org/concepts/hot-module-replacement/
  // @see https://github.com/robinvdvleuten/vuex-persistedstate/issues/137
  if (isHMR) return

  if (process.client) {
    window.onNuxtReady((nuxt) => {
      // vuex plugins can be connected to store, even after creation
      createPersistedState()(store)
    })
  }
}

Я хочу сохранить сеанс авторизации пользователя после обновления.

...