반응이 오류인데 왜 약속은 .그러면()으로 들어가는가? - 라라벨

반응이 오류인데 왜 약속은 .그러면()으로 들어가는가? - 라라벨

나는 vue.js와 vuex와 vue 라우터로 Laravel에서 SPA를 만들고 있다.내 상점에서 로그인을 위해 조치를 취했지만, 잘못된 자격 증명으로 로그인하면 정말 이상한 일이 일어난다.올바른 자격 증명으로 로그인하면 잘 작동한다.

그래서 그것은 다음의 것들을 논박한다.

로그 인.

app.js:279 POST http://127.0.0.1:8000/api/auth/login 401(승인되지 않음)

app.js:58018 로그인 성공

app.js:58023 로그인 실패

app.js:43201 Uncaught (in promise) NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack: "Error↵ at new NavigationDuplicated (http://127.…)↵ at http://127.0.0.1:8000/js/app.js:57159:12"} message: "Navigating to current location ("/") is not allowed"name: "NavigationDuplicated" _name: "NavigationDuplicated" stack: "Error↵ at new NavigationDuplicated (http://127.0.0.1:8000/js/app.js:43124:14)↵ at HTML5History.confirmTransition (http://127.0.0.1:8000/js/app.js:43240:18)↵ at HTML5History.transitionTo (http://127.0.0.1:8000/js/app.js:43184:8)↵
HTML5History.push(http://127.0.0.1:8000/js/app.js:43515:10)에서 http:///127.0.1:8000/js/app.js:43929:22pats에서 vueRouter에서 새 약속() ().http:////fts.0.1:8000/js/app.js:43928:12)push(/////ft.0.1:8000/js/app.js:57159:12" proto:오류

나에게 미친 것은 그 약속이 .den()과 console.logs "로그인 성공"으로 간다는 것이다.그러면 절대 .()에 들어가면 안 되는 거 맞지?자격 증명이 잘못되었기 때문에 .catch()만 사용해야 한다.그러나 더욱 이상한 것은 .g를 디버그한 다음 ()(?의 두 번째 콘솔.log(response.data)를 디버그한다는 점이다.또한 나는 중복된 항법을 이해할 수 없다.

자격 증명은 {username, password}에 불과하다.나는 JWT를 사용하고 있으며 /login 루트는 표준 jwt authcontroller 로그인 방법으로 이어진다.

Login.vue 구성 요소 방법

methods: {
    login() {
        this.$store
            .dispatch("tryLogin", this.form)
            .then(response => {
                this.$router.push({ path: "/home" });
            })
            .catch(error => {
                this.logginError = error;
            });
    }
}

스토어 액션

tryLogin(context, credentials) {
    context.commit("login");
    console.log("login");
    return new Promise((resolve, reject) => {
        axios
            .post("/api/auth/login", credentials)
            .then(response => {
                console.log("login succes");
                console.log(response.data);
                context.commit("loginSucces", response.data);
                resolve(response.data);
            })
            .catch(error => {
                console.log("login failed");
                context.commit("loginFailed", error);
                reject(error);
            });
    });
}

AuthController 로그인 기능

/**
 * Get a JWT via given credentials.
 *
 * @return \Illuminate\Http\JsonResponse
 */
public function login()
{
    $credentials = request(['email', 'password']);

    if (!$token = auth('api')->attempt($credentials)) {
        return response()->json(['error' => 'Unauthorized'], 401);
    }

    return $this->respondWithToken($token);
}

그래, 내가 설명하려고 노력할게(영어 미안해)다음은 정상 작동하며, 잘못된 자격 증명으로 로그인하면 멋진 JSON 응답을 반환한다.

 if (!$token = auth('api')->attempt($credentials)) {
        return response()->json(['error' => 'Unauthorized'], 401);
    }

. 그런 이유로 그것은 실패가 아니다..then그리고 인쇄하다401 (Unauthorized)그런 다음 context.log("로그인 성공")를 인쇄한 다음 context.commit("loginSucces", response.data)를 호출하려고 하면 실패하고 캐치(catch)로 가서 다음과 같이 말함app.js:58023로그인 실패.

그냥 물어보는 걸로 해결할 수 있어.then

axios
    .post("/api/auth/login", credentials)
    .then(response => {
         if (response.data.status === "error") {
             console.log(response.data);
         }
         else{
             context.commit("loginSucces", response.data);
             resolve(response.data);
         }
})

참조URL: https://stackoverflow.com/questions/58322879/why-does-promise-go-into-the-then-when-the-response-is-an-error-laravel