As soon as vue refreshes, it returns to the login page.

when writing a project, I encountered a problem, that is, I configured the interceptor and route interception, did not report an error, felt OK, but would log in to the page successfully, after manipulating the data, then habitually click to refresh, and then returned to the login page. I know that I cleared the stored value, but now I feel that if the user refreshes, I will go back to the login page, feeling that the mentality will explode!

// // 
if (!store.state.username) {
  router.push({
    path: "/Login"
  })
}
// 
// storestatestate
router.beforeEach((to, from, next) => {
  // eslint-disable-next-line eqeqeq
  if (to.path === "/Login") {
    sessionStorage.removeItem("username")
  }
  if (store.state.username) {
    if (to.path === "/") {
      next({
        path: "/Member"
      })
    } else {
      next()
    }
  } else {
    next({
      path: "/Login"
    })
  }
  // eslint-disable-next-line eqeqeq
})

this is configured in main.js

// http
axios.interceptors.request.use(config => {
  return config
}, error => {
  return Promise.reject(error)
})

// http
axios.interceptors.response.use(data => {
  // eslint-disable-next-line eqeqeq
  if (data.data.code == 3) {
    router.push({
      path: "/Login",
      query: {
        redirect: location.hostname
      }
    })
    sessionStorage.removeItem("username")
  }
  return data
}, error => {
  return Promise.reject(error)
})

interceptor

with the help of the boss, what"s the problem? The
route doesn"t have a rediction. I don"t know what the problem is. Elsewhere, there"s no way to refresh and jump back to the login page!

May.31,2022

if you use vuex, the page refresh state data will be lost. This is also the reason why you refresh and jump back to the login page after login

this is my data backup code to see if it is helpful to you

created () {  //store
    if (localStorage.cmstoken) {
      this.$router.replace("/data");
    }else {
      this.$router.replace("/");
    }
    if (sessionStorage.getItem("store") ) { //sessionStorage
        this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
    }
    window.addEventListener("beforeunload",()=>{ //vuexsessionStorage
        sessionStorage.setItem("store",JSON.stringify(this.$store.state))
    })
  },

guess that store.state.username is empty after refresh, so execute

all the time.
if (!store.state.username) {
  router.push({
    path: '/Login'
  })
}

you can assign the value in sessionStorage to store.state.username as the initial value


break point to see how to execute debugger


should be your problem if (store.state.username) , console.log this value

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-7b441c-1e9a7.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-7b441c-1e9a7.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?