로컬 전략을 사용하여 nuxtjs/auth를 구현하는 데 문제가 있습니다.

로컬 전략을 사용하여 nuxtjs/auth를 구현하는 데 문제가 있습니다.

nuxtjs 튜토리얼을 따르고 있는데 nuxtjs/auth loginWith 구현에 문제가 있습니다.이것은 매우 간단하지만 왜 나에게 효과가 없는지 모르겠다. 우체부에게 테스트하면 API는 토큰으로 응답한다.

문제없이 토큰을 쿠키와 로컬 스토리지에 저장합니다.가입도 가능하지만 로그인하지 않습니다.Vue dev 도구를 사용하여 검사하면 로그인 false가 표시되고 사용자 개체가 예상될 때 사용자가 정의되지 않았습니다.뭐가 잘못됐나요?

현재 로그인 방법은 다음과 같습니다.표시하다

async onLogin() {
  try {
      this.$auth.loginWith("local", {
        data: {
          email: this.email,
          password: this.password
        }
      });
      this.$router.push("/");
    
  } catch (err) {
    console.log(err);
  }
}

여기 nuxt.config.display도 있습니다.

const URL = 'http://localhost:3000'
export default {



    /*
    ** Nuxt rendering mode
    ** See https://nuxtjs.org/api/configuration-mode
    */
    mode: 'universal',
    /*
    ** Nuxt target
    ** See https://nuxtjs.org/api/configuration-target
    */
    target: 'server',
    /*
    ** Headers of the page
    ** See https://nuxtjs.org/api/configuration-head
    */
    head: {
        title: process.env.npm_package_name || '',
        meta: [
            { charset: 'utf-8' },
            { name: 'viewport', content: 'width=device-width, initial-scale=1' },
            { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
        ],
        link: [
            { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
            { rel: 'stylesheet', href: '/css/font-awesome/css/all.css' },
            { rel: 'stylesheet', href: '/css/default.css' }
        ]
    },
    /*
    ** Global CSS
    */
    css: [],
    /*
    ** Plugins to load before mounting the App
    ** https://nuxtjs.org/guide/plugins
    */
    plugins: [],
    /*
    ** Auto import components
    ** See https://nuxtjs.org/api/configuration-components
    */
    components: true,
    /*
    ** Nuxt.js dev-modules
    */
    buildModules: [],
    /*
    ** Nuxt.js modules
    */
    modules: [
        // Doc: https://bootstrap-vue.js.org
        'bootstrap-vue/nuxt',
        // Doc: https://axios.nuxtjs.org/usage
        '@nuxtjs/axios',
        '@nuxtjs/pwa',
        '@nuxtjs/auth',
        // Doc: https://github.com/nuxt/content
        // '@nuxt/content',
    ],
    /*
    **Axios Module config
    ** See https://axios.nuxtjs.org/options
    */
    axios: {
        proxy: true,
        baseURL: URL
    },
    proxy: {
        "/api": URL
    },
    /*
    ** Build configuration
    ** See https://nuxtjs.org/api/configuration-build/
    */
    build: {
        extend(config, ctx) {}
    },

    auth: {
        strategies: {
            local: {
                endpoints: {
                    login: {
                        url: "/api/auth/login",
                        method: "post",
                        propertyName: "token"
                    },
                    user: {
                        url: "/api/auth/user",
                        method: "get",
                        propertyName: "token"
                    },
                    logout: true
                }
            }
        }
    }

};

이것을 시험해 보세요.

auth: {
        strategies: {
            local: {
                endpoints: {
                    login: {
                        url: "/api/auth/login",
                        method: "post",
                        propertyName: "data.token"
                    },
                    user: {
                        url: "/api/auth/user",
                        method: "get",
                        propertyName: "data.user"
                    },
                    logout: true
                }
            }
        }
    }

api로부터의 응답은 데이터 내부에서 수신되기 때문에, axios를 사용할 경우.

네, 브라우저 전체를 새로 고친 후에만 업데이트가 됩니다.핫 새로고침으로 충분하다고 생각했지만 작동했습니다.이것은 나의 인증 전략 설정이다.

auth: {
    strategies: {
        local: {
            endpoints: {
                login: {
                    url: "/api/auth/login",
                    method: "post",
                    propertyName: "data.token"
                },
                user: {
                    url: "/api/auth/user",
                    method: "get",
                    propertyName: "data.user"
                },
                logout: true
            }
        }
    }
}

댓글 달아주셔서 감사합니다.그것은 나의 자신감과 문제 해결 능력에 도움을 주었다.

언급URL : https://stackoverflow.com/questions/62753022/problem-implementing-nuxtjs-auth-using-local-strategy