防止用户进入某个页面，直到满足条件为止

Question

我正在使用带有Vue的Vue。我是一个具有字段名称，地址，已验证的代理表。我想防止已登录的用户访问主页，除非已验证用户。已验证是用户标签中的布尔值字段。以下是我的router.js文件的外观。我不知道要这样做。

import VueRouter from 'vue-router';
import Vue from 'vue/dist/vue.js';
import Axios from 'axios';
import MyProfile from 'views/profile.vue';
import HomePage from 'views/homepage.vue';

Vue.use(VueRouter);
const routes = [
 { 'path': '/homepage', component: HomePage },
 { 'path': '/views/profile', component: MyProfile, meta: { requiresAuth: true }},
]
router.beforeEach(function(to, from, next) {
  if (to.matched.some(record => record.meta.requiresAuth)) {
    axios.get('/verified.json')
      .then(function() {
        if (to.path === '/loginin' || to.path === '/changepassword') {
          next('/');
          return;
        }
        next();
      })
      .catch(function() {
        if (to.path.match(/views/)) {
          next('/');
          return;
        }
        next();
      });
  }
  else {
    next();
  }
});

Answer 1

无论验证结果如何，您的逻辑似乎都会执行next，我看到有一些转到root，但重要的是运行next。

我假设catch正在处理4xx禁止的响应，如果是这种情况，则对next();的调用允许了不必要的继续，请删除next()中的cache以使用户留在原处或进行更改next('/')或其他路径将其重定向到权限问题或其他内容。

我将删除next以使用户停留在原处并显示拒绝权限的弹出窗口。