auth-module: Logout does not clear the tokens

Version

v4.5.1

Reproduction link

Steps to reproduce

logout then login

What is expected ?

Logout should clear the old access tokens. As per this issue ( https://github.com/nuxt-community/auth-module/issues/57 ) here, its fixed in version 4.0 .

What is actually happening?

Hello, I am facing this issue while trying to log in after a logout. After login api is called and the access token it is set in both localstorage and cookie. But the fetchUser() method is using the previous access token. I am using version 4.5.1. I even manually set the axios headers to null.

        async logout() {
                await this.$auth.logout({
                    data: {
                        device_id: this.device_id
                    }
                });

                this.$axios.setHeader('Authorization', null);
                this.$toast.show('Successfully logged out');
            }

Request response flow: Login Request:

Request URL: http://localhost:3000/api/users/login
Request Method: POST
Status Code: 200 OK
Remote Address: 127.0.0.1:3000
Referrer Policy: no-referrer-when-downgrade

Response

{
    "data": { 
         "access_token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6Ijk3M2QyZWEzZWUyMzI0OWM4NThkMWQ2OTYyMThjZTlkN2IwZTk0NDAwOTljZDZiMzg4ZWMwYTZlOTNhYjllYjJiMzFhZTk1MGJiOGE4MGFhIn0.eyJhdWQiOiIxIiwianRpIjoiOTczZDJlYTNlZTIzMjQ5Yzg1OGQxZDY5NjIxOGNlOWQ3YjBlOTQ0MDA5OWNkNmIzODhlYzBhNmU5M2FiOWViMmIzMWFlOTUwYmI4YTgwYWEiLCJpYXQiOjE1MzAxNjk2OTksIm5iZiI6MTUzMDE2OTY5OSwiZXhwIjoxODQ1Nzg4ODk5LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.B9T9h5X6dSZs3MFIl4xEOsIp66T-B4H9UFTYx7EDnp8b_2yeNdSNmrfKTo6cercpW0AAAlw_xFUOswpqZuOrRpDhGxSiL0Uz3LPelXC2VeTUvfDT75CCODyOWQP-nUPh49Nqp_GCizBmL219IiQLwXtYlEuEJbpXuHiN2LFS7N_xeELLLSPVGfc4PIgJ4rCCVnmOKYPXQHP_Vn7OsqpVyYWPi2yzjnmlIVbYdt8W7KycC6VZfJBJcgRVU-yi4G17PI9sFCuYgCU8Uh-bneGDgaWm9VLTOAIc_dMaDt0PnOt90oh6EeBLEdsa8MYh3v7iDeKIzM6pLBuGUGrvPM9lu-OmD1Q0mQsUgsd-oPYPANLpgZErlcZzD-sfqvc8ryt-s2SGlc882WcLgrpDxSVaxXXkcLWp7PhuLfrzoTRUJig8Gw-rrxV6cUMc551ItTWdFmZNUWJLa_UlgSfQEn4aH9rLTlvkFPocdSqBeCw4Br0QnjBS7fznw6Mw17dKCSMmxVVfhFTll3-60jWAnN7KA0hDGIjppUQZs5ADlSkcmPc_OzoOAk8v115zKrD93fKYRL0rKFHpildu_SrVRhwjkViSqbgBjh6YDSKd69H6HwJzBrhDiuCLdkDgRuRnn9p-1zCKlR0QQTWSUVm8Bq3bd7ZOPTMGfprdJqaP6pfGQgQ" 
    }
}

Logout Request

Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,bn;q=0.8
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6Ijk3M2QyZWEzZWUyMzI0OWM4NThkMWQ2OTYyMThjZTlkN2IwZTk0NDAwOTljZDZiMzg4ZWMwYTZlOTNhYjllYjJiMzFhZTk1MGJiOGE4MGFhIn0.eyJhdWQiOiIxIiwianRpIjoiOTczZDJlYTNlZTIzMjQ5Yzg1OGQxZDY5NjIxOGNlOWQ3YjBlOTQ0MDA5OWNkNmIzODhlYzBhNmU5M2FiOWViMmIzMWFlOTUwYmI4YTgwYWEiLCJpYXQiOjE1MzAxNjk2OTksIm5iZiI6MTUzMDE2OTY5OSwiZXhwIjoxODQ1Nzg4ODk5LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.B9T9h5X6dSZs3MFIl4xEOsIp66T-B4H9UFTYx7EDnp8b_2yeNdSNmrfKTo6cercpW0AAAlw_xFUOswpqZuOrRpDhGxSiL0Uz3LPelXC2VeTUvfDT75CCODyOWQP-nUPh49Nqp_GCizBmL219IiQLwXtYlEuEJbpXuHiN2LFS7N_xeELLLSPVGfc4PIgJ4rCCVnmOKYPXQHP_Vn7OsqpVyYWPi2yzjnmlIVbYdt8W7KycC6VZfJBJcgRVU-yi4G17PI9sFCuYgCU8Uh-bneGDgaWm9VLTOAIc_dMaDt0PnOt90oh6EeBLEdsa8MYh3v7iDeKIzM6pLBuGUGrvPM9lu-OmD1Q0mQsUgsd-oPYPANLpgZErlcZzD-sfqvc8ryt-s2SGlc882WcLgrpDxSVaxXXkcLWp7PhuLfrzoTRUJig8Gw-rrxV6cUMc551ItTWdFmZNUWJLa_UlgSfQEn4aH9rLTlvkFPocdSqBeCw4Br0QnjBS7fznw6Mw17dKCSMmxVVfhFTll3-60jWAnN7KA0hDGIjppUQZs5ADlSkcmPc_OzoOAk8v115zKrD93fKYRL0rKFHpildu_SrVRhwjkViSqbgBjh6YDSKd69H6HwJzBrhDiuCLdkDgRuRnn9p-1zCKlR0QQTWSUVm8Bq3bd7ZOPTMGfprdJqaP6pfGQgQ
build: 0.1
client-type: WEB
Connection: keep-alive
Content-Length: 52
Content-Type: application/json;charset=UTF-8
Cookie: auth.strategy=local; auth._refresh_token.local=false; auth._token.local=Bearer%20eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6Ijk3M2QyZWEzZWUyMzI0OWM4NThkMWQ2OTYyMThjZTlkN2IwZTk0NDAwOTljZDZiMzg4ZWMwYTZlOTNhYjllYjJiMzFhZTk1MGJiOGE4MGFhIn0.eyJhdWQiOiIxIiwianRpIjoiOTczZDJlYTNlZTIzMjQ5Yzg1OGQxZDY5NjIxOGNlOWQ3YjBlOTQ0MDA5OWNkNmIzODhlYzBhNmU5M2FiOWViMmIzMWFlOTUwYmI4YTgwYWEiLCJpYXQiOjE1MzAxNjk2OTksIm5iZiI6MTUzMDE2OTY5OSwiZXhwIjoxODQ1Nzg4ODk5LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.B9T9h5X6dSZs3MFIl4xEOsIp66T-B4H9UFTYx7EDnp8b_2yeNdSNmrfKTo6cercpW0AAAlw_xFUOswpqZuOrRpDhGxSiL0Uz3LPelXC2VeTUvfDT75CCODyOWQP-nUPh49Nqp_GCizBmL219IiQLwXtYlEuEJbpXuHiN2LFS7N_xeELLLSPVGfc4PIgJ4rCCVnmOKYPXQHP_Vn7OsqpVyYWPi2yzjnmlIVbYdt8W7KycC6VZfJBJcgRVU-yi4G17PI9sFCuYgCU8Uh-bneGDgaWm9VLTOAIc_dMaDt0PnOt90oh6EeBLEdsa8MYh3v7iDeKIzM6pLBuGUGrvPM9lu-OmD1Q0mQsUgsd-oPYPANLpgZErlcZzD-sfqvc8ryt-s2SGlc882WcLgrpDxSVaxXXkcLWp7PhuLfrzoTRUJig8Gw-rrxV6cUMc551ItTWdFmZNUWJLa_UlgSfQEn4aH9rLTlvkFPocdSqBeCw4Br0QnjBS7fznw6Mw17dKCSMmxVVfhFTll3-60jWAnN7KA0hDGIjppUQZs5ADlSkcmPc_OzoOAk8v115zKrD93fKYRL0rKFHpildu_SrVRhwjkViSqbgBjh6YDSKd69H6HwJzBrhDiuCLdkDgRuRnn9p-1zCKlR0QQTWSUVm8Bq3bd7ZOPTMGfprdJqaP6pfGQgQ
DNT: 1
Host: localhost:3000
Origin: http://localhost:3000
Referer: http://localhost:3000/
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
version: 0.0.1

Now when I login again, the access token is changed. Login 2 Response

{
    "data": { 
         "access_token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6ImQ2N2RjYWZkYWJhZWEwYTUzZDBiODQwYjRjMWYxNWVmMTVjNWE5NTg2N2Q2MjkxM2FlMWJjOGI1YjIyNmY0Zjk3MGJhODM5NzE1N2NlNmFiIn0.eyJhdWQiOiIxIiwianRpIjoiZDY3ZGNhZmRhYmFlYTBhNTNkMGI4NDBiNGMxZjE1ZWYxNWM1YTk1ODY3ZDYyOTEzYWUxYmM4YjViMjI2ZjRmOTcwYmE4Mzk3MTU3Y2U2YWIiLCJpYXQiOjE1MzAxNzA4NjgsIm5iZiI6MTUzMDE3MDg2OCwiZXhwIjoxODQ1NzkwMDY4LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.YxfdrtdHpDMZTuh5qLkIS6zKqJhqhJAnIqT9UZMMyc8caqA8pZMk0C648c2K55DLnomZnvFqTRtQfatGKpAPM1ku0-Nzpmxfn-2lsOB_cXehsw-OB15W0y3Bor2kFImokBWhW3qsHgkouOx8D3KSNHtIrtrdz3W8O9WwXiWEcPn3rtgZ-5qg6VBPcC9SHay1Bbaeqz3tjWGptMKPQFEpB7bKNbNlQjwtj4B-WbmRAz-s6X24RqOJsUS1frAe6eDn85RUY5lsQuZfsK8TL3mEC75Wcpc863nrf2AVTrtH6uBaKxlV6BQIDVBSTWquTH2DRRexzeEADYJwleaWr4H2eJN-C3kOcDF7pSInIsC3Q81-AAWjrWq6dfy2UKzif9bS265gnC3itNHeT2wySZYC7KulRzuDW1mhwM8jgX-ilk9Qg8xqr-Vh7eCF0igWwP2UHGNxrGd-f8j5Uc6eIw8guzZqqSveUmF83LOHe4Cy9RBybF7RdJHo8KZ6i4D8sR4kGP-1VhXirIQ3-DBZS-I5Eq3J8ZH_8z6ioLmlBxTx6ePwoQqrtyyaSiWbdvQl5RSVFH3ngOBcQB4KmHoPIYy2PqPoe1-XMhfsh94YgPrEAWSqAlHn6xRPLxyWdoV5OoVYG7BVGaWbfZnlg9PUFQxPJYqfm0_WHvqBO-Lwxyb8QsE" 
    }
}

And this token is set both on cookie and localstorage. But the $auth.fetchUser() api uses the old access token so login is not being completed. Refreshing the page fixes this as the access token stored in the cookie is a valid one.

Fetch User Request

Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,bn;q=0.8
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6Ijk3M2QyZWEzZWUyMzI0OWM4NThkMWQ2OTYyMThjZTlkN2IwZTk0NDAwOTljZDZiMzg4ZWMwYTZlOTNhYjllYjJiMzFhZTk1MGJiOGE4MGFhIn0.eyJhdWQiOiIxIiwianRpIjoiOTczZDJlYTNlZTIzMjQ5Yzg1OGQxZDY5NjIxOGNlOWQ3YjBlOTQ0MDA5OWNkNmIzODhlYzBhNmU5M2FiOWViMmIzMWFlOTUwYmI4YTgwYWEiLCJpYXQiOjE1MzAxNjk2OTksIm5iZiI6MTUzMDE2OTY5OSwiZXhwIjoxODQ1Nzg4ODk5LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.B9T9h5X6dSZs3MFIl4xEOsIp66T-B4H9UFTYx7EDnp8b_2yeNdSNmrfKTo6cercpW0AAAlw_xFUOswpqZuOrRpDhGxSiL0Uz3LPelXC2VeTUvfDT75CCODyOWQP-nUPh49Nqp_GCizBmL219IiQLwXtYlEuEJbpXuHiN2LFS7N_xeELLLSPVGfc4PIgJ4rCCVnmOKYPXQHP_Vn7OsqpVyYWPi2yzjnmlIVbYdt8W7KycC6VZfJBJcgRVU-yi4G17PI9sFCuYgCU8Uh-bneGDgaWm9VLTOAIc_dMaDt0PnOt90oh6EeBLEdsa8MYh3v7iDeKIzM6pLBuGUGrvPM9lu-OmD1Q0mQsUgsd-oPYPANLpgZErlcZzD-sfqvc8ryt-s2SGlc882WcLgrpDxSVaxXXkcLWp7PhuLfrzoTRUJig8Gw-rrxV6cUMc551ItTWdFmZNUWJLa_UlgSfQEn4aH9rLTlvkFPocdSqBeCw4Br0QnjBS7fznw6Mw17dKCSMmxVVfhFTll3-60jWAnN7KA0hDGIjppUQZs5ADlSkcmPc_OzoOAk8v115zKrD93fKYRL0rKFHpildu_SrVRhwjkViSqbgBjh6YDSKd69H6HwJzBrhDiuCLdkDgRuRnn9p-1zCKlR0QQTWSUVm8Bq3bd7ZOPTMGfprdJqaP6pfGQgQ
build: 1.1
client-type: I
Connection: keep-alive
Cookie: auth.strategy=local; auth._refresh_token.local=false; auth._token.local=Bearer%20eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6ImQ2N2RjYWZkYWJhZWEwYTUzZDBiODQwYjRjMWYxNWVmMTVjNWE5NTg2N2Q2MjkxM2FlMWJjOGI1YjIyNmY0Zjk3MGJhODM5NzE1N2NlNmFiIn0.eyJhdWQiOiIxIiwianRpIjoiZDY3ZGNhZmRhYmFlYTBhNTNkMGI4NDBiNGMxZjE1ZWYxNWM1YTk1ODY3ZDYyOTEzYWUxYmM4YjViMjI2ZjRmOTcwYmE4Mzk3MTU3Y2U2YWIiLCJpYXQiOjE1MzAxNzA4NjgsIm5iZiI6MTUzMDE3MDg2OCwiZXhwIjoxODQ1NzkwMDY4LCJzdWIiOiIxMyIsInNjb3BlcyI6W119.YxfdrtdHpDMZTuh5qLkIS6zKqJhqhJAnIqT9UZMMyc8caqA8pZMk0C648c2K55DLnomZnvFqTRtQfatGKpAPM1ku0-Nzpmxfn-2lsOB_cXehsw-OB15W0y3Bor2kFImokBWhW3qsHgkouOx8D3KSNHtIrtrdz3W8O9WwXiWEcPn3rtgZ-5qg6VBPcC9SHay1Bbaeqz3tjWGptMKPQFEpB7bKNbNlQjwtj4B-WbmRAz-s6X24RqOJsUS1frAe6eDn85RUY5lsQuZfsK8TL3mEC75Wcpc863nrf2AVTrtH6uBaKxlV6BQIDVBSTWquTH2DRRexzeEADYJwleaWr4H2eJN-C3kOcDF7pSInIsC3Q81-AAWjrWq6dfy2UKzif9bS265gnC3itNHeT2wySZYC7KulRzuDW1mhwM8jgX-ilk9Qg8xqr-Vh7eCF0igWwP2UHGNxrGd-f8j5Uc6eIw8guzZqqSveUmF83LOHe4Cy9RBybF7RdJHo8KZ6i4D8sR4kGP-1VhXirIQ3-DBZS-I5Eq3J8ZH_8z6ioLmlBxTx6ePwoQqrtyyaSiWbdvQl5RSVFH3ngOBcQB4KmHoPIYy2PqPoe1-XMhfsh94YgPrEAWSqAlHn6xRPLxyWdoV5OoVYG7BVGaWbfZnlg9PUFQxPJYqfm0_WHvqBO-Lwxyb8QsE
DNT: 1
Host: localhost:3000
Referer: http://localhost:3000/
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36
version: 2.0

<div align="right">_{This bug report is available on Nuxt community (#c165)}</div>

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 7
Comments: 36 (1 by maintainers)

Most upvoted comments

The scenario I’m facing could be related:

Steps:

✅ Log in as userA (token received, all good)
✅ User details api fires and I receive details for userA
Log out using this.$auth.logout() (looks logged out in Vuex 👀)
✅ Try Log in as userB (login API fires, response contains new token 👍)
⚠️ User details api fires automatically but sends userA’s old token.
👎 I’m now logged in as userA again 😖.
🤯 Refresh the browser, now logged in as userB.

All I can think is that, although Vuex looks cleared, there is a token stored somewhere that is persisting after clicking log out.

Does anyone think this could be part of the same issue?

+13

mkstix6 on Dec 11, 2018

The token persists in Authorization header. If you remove it before a new login, it works as expected:

this.$auth.strategies.local.options.endpoints.user.headers['Authorization'] = null

olibia on Jul 1, 2019

@Chathula The problem code is outlined in this related issue: https://github.com/nuxt-community/auth-module/issues/213

Essentially, if a user object is empty (i.e., in nuxt.config.js auth config, user: false), then the loggedIn state variable will ALWAYS be true, thus giving the appearance of never logging you out.

See this line: https://github.com/nuxt-community/auth-module/blob/dev/lib/core/auth.js#L233

nathanchase on Aug 10, 2018

@codeofsumit I’m testing here and seems to be working. I think an easier solution is to use this.$auth.logout() instead of manually remove tokens.

async logout({ state, commit }) {
    await this.$auth.logout()
    window.location = `https://${process.env.VUE_APP_AUTHDOMAIN}/v2/logout?returnTo=${window.location.origin}/logout`
},

JoaoPedroAS51 on May 3, 2020

@codeofsumit Oh sorry I forgot to mention that setToken and setRefreshToken requires strategy as first parameter. Try this.$auth.setToken('auth0', false) and this.$auth.setRefreshToken('auth0', false)

JoaoPedroAS51 on May 3, 2020

@codeofsumit Thanks. I will make some tests and see if I can find the issue 😃

You can clear the tokens using this.$auth.setToken('auth0', false) and this.$auth.setRefreshToken('auth0', false) And to clear axios header, use this.$axios.setHeader('Authorization', false)

JoaoPedroAS51 on May 3, 2020

Here is our logout function:

const handleLogout = () => {
    this.$auth.strategies.local.reset();
    this.$router.go();
}

That wipes the token out and reloads the current page which triggers the auth middleware which redirects the user to the login page using the Nuxt Auth middleware. https://auth.nuxtjs.org/guide/middleware/

You can console.log(this.$auth) or console.log(this.$auth.strategies) to see what’s available, and look for the reset function. Ours is called local because that’s what our strategy is called in the nuxt.config.js file.

agm1984 on Jan 7, 2022

if u are using nuxt auth u can try

this.$auth.strategy.token.reset();

Benyaminrmb on Apr 28, 2021

Hey All. So in my case I was using Auth0, I was having very similar symptoms and just could not figure it out. None of these solutions worked, except for the fact that it was required to call window.location ‘http://{auth0 domain}/v2/logout…’ The one thing I was forgetting was to add the client_id to the url… That was required for Auth0 to be able and delete those cookies.

belgianMuscle on Jun 10, 2020

@JoaoPedroAS51 thanks for reminding me. I tried this in the past but somehow it wasn’t working as expected so I removed it. It’s working fine now and is the best solution of course ❤️ Thanks a lot.

Looking forward to the next version where tokens are refreshed 🎉

codeofsumit on May 4, 2020

Thanks @JoaoPedroAS51 - this is my logout action now:

async logout({ state, commit }) {
    this.$auth.setToken(false)
    this.$auth.setRefreshToken(false)
    this.$axios.setHeader('Authorization', false)

    window.location = `https://${process.env.VUE_APP_AUTHDOMAIN}/v2/logout?returnTo=${window.location.origin}/logout`
},

However, after returning from auth0’s logout endpoint, the token is still set in axios.

Seems like the Cookie isn’t cleared

codeofsumit on May 3, 2020