Question

除了在希望继续进入url之前要检查与该页面相关的权限对象的情况之外，我的路由在各个方面都有效。

我已经将权限检查的逻辑分离到一个函数中，并通过控制台将其注销，所有元素都在工作，因为它在数组中找到了正确的对象，找到了正确的键和值，并相应地允许或阻止了。

我的问题是，当我通过此路线点击此功能时，它会无限循环并导致浏览器崩溃。我认为我的总体逻辑很好，但是我是否在某个地方搞砸了它的实现？

function guard (to, from, next) {

var loggedin_state = store.state.user.auth.loggedin // Boolean
var user = store.state.user.user // Array
var token = store.state.user.auth.token // String
var entryUrl // String

if(entryUrl == null || entryUrl == undefined){
    entryUrl = to.path
}

if(loggedin_state == true) {
    // Is the user profile blank
    if(user == null) {
        this.$store.dispatch('user/get_user_information', null)
    }
    // If they tried a route before logging in that would have been stored
    if(entryUrl) {
        // Store the url before wiping it
        let url = entryUrl;
        // Wipe the entry url variable
        entryUrl = null;
        // Carry on to permission checking function
        return go_to_url(url);
    } else {
        // Go to stored url
        return next(to.path)
    }
} else {
    // Is there a token assigned? If so they are approved and just need the profile information
    if(token !== null) {
        loggedin_state = true
        this.$store.dispatch('user/get_user_information', null)
        return go_to_url(to.path);
    } else {
        // Store entry url before redirect for use after login
        entryUrl = to.path
        // Re-route to login page
        return next("/login");
    }
}

function go_to_url(url) {
    // Find matching object in user.permissions based upon url
    var view_permissions = [
        { "area": "all", "read": 1, "create": 0, "edit": 0, "delete": 0 },
        { "area": "dashboard", "read": 1, "create": 0, "edit": 0, "delete": 0 }
    ];
    // var view_permissions = store.state.user.permissions
    var view_permission = view_permissions.find(view => view.area === to.name);
    if(view_permission.read == 1) {
        // Go to url
        next(url);
    } else {
        // Re-route to somewhere
    }
};

};

Answer 1

我的问题是将值传递给next（）函数调用。通过删除它，可以正常工作：

function guard (to, from, next) {

  console.log('To:')
  console.log(to)
  console.log('From:')
  console.log(from)
  console.log('EntryUrl: ' + entryUrl)

  // 1 - If no entry path was provided then set to 
  if(entryUrl == null || entryUrl == undefined){
    entryUrl = to.path
    console.log('EntryUrl: ' + entryUrl)
  }

  // 2 - Check if the user is marked as being logged in
  var loggedin_state = store.state.user.auth.loggedin
  if(loggedin_state == undefined) {
    store.commit('user/set_delete_session', null)
    return next("/login");
  }

  // 3 - If they are marked as logged in continue
  var user = store.state.user.user
  var token = store.state.user.auth.token
  if(loggedin_state == true) {

    // If the user isn't authorised with a token then send them to the log in page
    if(token == null) {
      store.commit('user/set_delete_session', null)
      return next("/login");
    }

    // If they've got a token but no user profile data acquire it
    if(user == null) {
      UserApi.get_user_information(response.data.token)
      .then(response => {
          store.commit('user/set_user', response.data)
      })
    }

    // If they tried a route before logging in that would have been stored
    if(entryUrl) {
      console.log('Go to saved URL')
      // Store the url before wiping it
      let url = entryUrl;
      // Wipe the entry url variable
      entryUrl = null;
      // Go to stored url
      return go_to_url(url);
    } else {
      console.log('Go to pointed url')
      // Carry on to permission checking function
      return go_to_url(to.path);
    }
  } else {

    // The user is not logged in. Store the URL they were trying to visit and redirect them to the login page
    entryUrl = to.path
    console.log('EntryUrl: ' + entryUrl)
    return next("/login");

  }

  function go_to_url(url) {
    console.log(url)

    // 1 - Grab the user permissions from the user profile
    var permissions_array = null
    if(user !== null) {
      permissions_array = user.permissions
    }
    console.log(permissions_array)

    // 2 - Check and route
    if(permissions_array !== null) {

      // Find the relevant permission object based upon the route name and the area key
      var view_permissions = permissions_array.find(view => view.area === to.name);
      console.log(view_permissions)

      // If a permission object was found check its status, if no object found assume it is okay to view
      if(view_permissions !== undefined) {
        // If set to 1 the user can view this route, else reroute to a permissions denied page 
        if(view_permissions.read == 1) {
          // Go to url
          console.log('GUARD - PROCEED')
          console.log(to.name)
          next();
        } else {
          console.log('GUARD - BLOCKED')
          return next("/permission-denied");
        }
      } else {
        return next()
      }

    }

  };

};

导航卫士不断循环播放

1 个答案: