2

我有一个小问题。

我正在 Vue 2 上使用羽毛和 vuex 制作一个项目。

在这个项目中有一个仪表板，其中包含我所有的个人项目/经验/和消息。

当我登录并重定向到仪表板时，所有数据都被检索，但是当我刷新页面时，我收到一个 Feathers 错误，说我没有通过身份验证

错误：羽毛错误图像

这是我的 store/index.js ：

import Vue from 'vue'
import Vuex from 'vuex'
import { FeathersVuex } from '../feathers-client'
import auth from './store.auth'
import createPersistedState from "vuex-persistedstate";

Vue.use(Vuex)
Vue.use(FeathersVuex)

const requireModule = require.context(
  // The path where the service modules live
  './services',
  // Whether to look in subfolders
  false,
  // Only include .js files (prevents duplicate imports`)
  /\.js$/
)
const servicePlugins = requireModule
  .keys()
  .map(modulePath => requireModule(modulePath).default)

export default new Vuex.Store({
  state: {},
  mutations: {},
  actions: {},
  plugins: [...servicePlugins, createPersistedState({storage: window.localStorage}), auth]
})

这是 Vue package.json 文件：

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@feathersjs/authentication-client": "^4.5.11",
    "@feathersjs/feathers": "^4.5.11",
    "@feathersjs/socketio-client": "^4.5.11",
    "@vue/composition-api": "^1.1.3",
    "core-js": "^3.6.5",
    "feathers-hooks-common": "^5.0.6",
    "socket.io-client": "^2.4.0",
    "feathers-vuex": "^3.16.0",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vue-spinner": "^1.0.4",
    "vuex": "^3.4.0",
    "vuex-persistedstate": "^4.0.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  }
}

还有我的登录功能：

methods: {
        ...mapActions('auth', ['authenticate']),
        login() {
            var email = this.$refs.emailInput.value
            var password = this.$refs.passInput.value

            this.authenticate({strategy: 'local', email, password})
            .then(() => this.$router.push({name: 'Dashboard'}))
            .catch((err) => {
                let type = err.className
                err = Object.assign({}, err)
                err.message = 
                    type === 'not-authenticated'
                        ? 'Incorrect email or password'
                        : 'An error prevented login'
                console.error(err.message)
            })
        }
    }
4

1 回答 1

0

有一个非常棒的项目可以节省你的时间：它让你可以毫不费力地使用羽毛和 vuex。

查看项目：https ://vuex.feathersjs.com/

于 2021-08-30T15:32:21.560 回答