DEV Community

Discussion on: PKCE authenticaton for Nuxt SPA with Laravel as backend

 
franfoukal profile image
franfoukal

After several trials, I came up with a solution (not an elegant one I guess) that works.
It's a mix from logout from the API guard (api.php routes with auth:api middleware), revoking the token:

public function logoutAPI(){

        Auth::user()->token()->revoke();
        $tokenId = Auth::user()->token()->id;

        $tokenRepository = app('Laravel\Passport\TokenRepository');
        $refreshTokenRepository = app('Laravel\Passport\RefreshTokenRepository');
        $tokenRepository->revokeAccessToken($tokenId);
        $refreshTokenRepository->revokeRefreshTokensByAccessTokenId($tokenId);

        return response()->json([
            'msg' => 'You have been succesfully logged out'
        ],200);
    }
Enter fullscreen mode Exit fullscreen mode

And in the web guard (web.php routes), kill the session:

    public function logoutSession(Request $request){
        Auth::guard('web')->logout();
        Session::flush();
        //the frontend sends a logout_uri query string to redirect
        return response()->redirectTo($request->query('logout_uri'));
    }
Enter fullscreen mode Exit fullscreen mode

In the frontend I send an axios post request to the logoutAPI route and then call the logoutSession route. Here is the code using the @nuxtjs/auth-next module.

        logout(){
            this.$axios.get('/api/logout')
            .then(response => {
                this.$auth.reset(); //deletes tokens in nuxt app
                this.$auth.logout(); //redirects to logoutSession 
                this.$axios.setHeader('Authorization', null); 
            })
            .catch(error => console.log(error.response));
        }
Enter fullscreen mode Exit fullscreen mode

This way, every time I logout from the app and login again, the credentials are required and doesn't persists.

Thanks for your replies, I hope this helps someone!