nuxt auth this.$auth.user outdated

Question

I wrote a little login register tool with nuxt and everything works fine but if im changing the data with a put request, nuxt auth dont "see" the change and stays with outdated data.

In my Dashboard the user data is shown by:

<div id="userInfos">
        Name: {{ this.$auth.user.firstname }}, {{ this.$auth.user.lastname }} <br />
        Username: {{ this.user.username }} <br />
</div>

My put request is like that (wrote it in a javascript helper file)

export async function changeData(id, body) {
    try {
        await axios.put(`http://localhost:8000/users/${id}`, body, {
            headers: {
                'Content-Type': 'application/json',
                'Authorization': localStorage.getItem('auth._token.local')
            }
        });
        return true;
    }
    catch (e) {
        return false;
    }
}

I already tried things like refreshTokens() but there was also not change. The data is only changing after a logout and login again. Is there a way to update the this.$auth.user data updated after changing it?

//EDIT Now im trying to get the new data from my backend to override the $auth.user. But it still sends me the old data which dont exist on the backend anymore?

My function:

async getData() {
      this.$auth.refreshTokens()
      try {
        let res = await this.$axios.get(`http://localhost:8000/userinfo/`, {
          headers: {
            'Content-Type': 'application/json',
            Authorization: localStorage.getItem('auth._token.local'),
          },
        })
        console.log(res.data)
      } catch (e) {
        console.log(e)
      }
    },
    
//Starts in
beforeMount() {
    this.getData()
  },

And my backend code where i ask for the data:

server.get("/userinfo", (req, res) => {
  const decodedToken = jwt.decode(req.headers.authorization.split(' ')[1])
  const userInfo = {
    id: decodedToken.id,
    firstname: decodedToken.firstname,
    lastname: decodedToken.lastname,
    username: decodedToken.username,
    roles: decodedToken.roles,
    password: decodedToken.password,
  }

  res.status(200).json(userInfo)
})

Seems like there is something wrong with the token? The backend shows me also a 304 error code

Give a try to that one: https://stackoverflow.com/a/68081536/8816585 — kissu, Nov 01 '22 at 10:40
Okay, now im setting the user after changing the data and it works till im refreshing the site. Then i see my old data in the dashboard again — Chopper, Nov 01 '22 at 10:51
Then, it's a matter of persistency: https://stackoverflow.com/a/66872372/8816585 — kissu, Nov 01 '22 at 11:01
Do you need more help for this question or can I post an answer? — kissu, Nov 01 '22 at 11:14
Its still not working, even if i load my new data from my backend i still get the old one, i will edit above — Chopper, Nov 01 '22 at 11:23
Yes im currently saving the data in a json file and there its updated. — Chopper, Nov 02 '22 at 13:30
So, is it not getting the new data from the HTTP call on client-side? — kissu, Nov 02 '22 at 14:10
Correct, it seems like there is something with the cache. It only changes if the user logs out and in again — Chopper, Nov 02 '22 at 14:13
Is your network request cached in the network tab (it's written if it is)? — kissu, Nov 02 '22 at 14:19
if im using async fetch() its there, if im not its not there. But with fetch it replies also the old data and shows me the 304 error in my backend — Chopper, Nov 02 '22 at 14:23
The error is about the data not being properly updated, so it's not a token issue but more of what you're sending/receiving. — kissu, Nov 02 '22 at 14:41

score 0 · Accepted Answer · edited Nov 07 '22 at 09:30

0

Fixed it myself, problem was in the backend. Needed to read the json file in my backend correct like this:

const userList = JSON.parse(fs.readFileSync('./users.json', 'UTF-8'))
const userinfo = userList.users.find((user) => user.id === decodedToken.id)

edited Nov 07 '22 at 09:30

kissu

40,416
14
65
133

answered Nov 07 '22 at 09:28

Chopper

63
7

nuxt auth this.$auth.user outdated

1 Answers1