javascript - Regarding development using axios and vue. When the mobile browser returns, it reads the cache and cannot execute js and vue components.

Question

A mobile website has tested login restrictions on a page. If you are not logged in, you will go to the login page. However, when you reach the login page and press the return key, you can still return to the first page without reading any data or pictures. How can I do this? When he goes back, he refreshes the web page instead of reading the cached website

Answer 1

The window.location.replace() parameter writes the routing address you want to jump to (this page will not generate a cache, and the browser will not have a back option. If you need to generate a back option, replace "replace" with assign);

Answer 2

If you use vue-router in your project, you can use router.beforeEach
Refer to the code below

router.beforeEach((to, from, next) => {
  store.commit('SET_MODULE', to.meta.module)
  if (to.matched.some(record => record.meta.requiresAuth === true)) {
    if (store.getters.token === '') { 
      next({
        path: '/sign',
        query: {redirect: to.fullPath}
      })
    } else {
      next()
    }
  } else if (to.matched.some(record => record.meta.requiresAuth === false)) {
    if (store.getters.token !== '') {
      next(to.query.redirect || '/m')
    } else {
      next()
    }
  } else {
    next()
  }
})

https://github.com/ycloud/cno...

If vue-router is not used, you can put the login judgment in beforeCreate for detection