Chuyển hướng đến trang được yêu cầu sau khi đăng nhập bằng vue-router

Question

Trong ứng dụng của tôi, một số tuyến đường chỉ có thể truy cập được đối với người dùng được xác thực.
Khi người dùng chưa được xác thực nhấp vào liên kết mà anh ấy phải đăng nhập, anh ấy sẽ được chuyển hướng đến thành phần đăng nhập.

Nếu người dùng đăng nhập thành công, Tôi muốn chuyển hướng anh ấy đến URL anh ấy yêu cầu trước khi anh ấy phải đăng nhập. Tuy nhiên, cũng phải là tuyến đường mặc định, trong trường hợp người dùng không yêu cầu URL khác trước khi đăng nhập.

Làm cách nào để đạt được điều này bằng bộ định tuyến?

---

Mã của tôi mà không cần chuyển hướng sau khi đăng nhập

router.beforeEach(
    (to, from, next) => { 
     if(to.matched.some(record => record.meta.forVisitors)) { 
      next() 
     } else if(to.matched.some(record => record.meta.forAuth)) { 
      if(!Vue.auth.isAuthenticated()) { 
       next({ 
        path: '/login' 
        // Redirect to original path if specified 
       }) 
      } else { 
       next() 
      } 
     } else { 
      next() 
     } 
    }   
) 

chức năng đăng nhập của tôi trong phần đăng nhập của tôi

login() { 
    var data = { 
     client_id: 2, 
     client_secret: '**************', 
     grant_type: 'password', 
     username: this.email, 
     password: this.password 
    } 
    // send data 
    this.$http.post('oauth/token', data) 
     .then(response => { 
      // authenticate the user 
      this.$auth.setToken(response.body.access_token, 
      response.body.expires_in + Date.now()) 
      // redirect to route after successful login 
      this.$router.push('/') 
      }) 

tôi sẽ rất biết ơn đối với bất kỳ loại Cứu giúp!

Answer 1

Theo cách khác, bạn có thể thực hiện bằng cách thêm thông số truy vấn trong tuyến đường khi bạn muốn chuyển hướng và sau đó kiểm tra khi bạn đăng nhập nếu tham số được đặt; Nếu được thiết lập bạn sử dụng nó hoặc nếu không bạn dự phòng trên root.

Trong mã nên tìm một cái gì đó như thế này:

Đặt một hành động để liên kết của bạn ví dụ:

onLinkClicked() { 
    if(!isAuthenticated) { 
    // If not authenticated, add a path where to redirect after login. 
    this.$router.push({ name: 'login', query: { redirect: '/path' } }); 
    } 
} 

Tên đăng nhập nộp action

submitForm() { 
    AuthService.login(this.credentials) 
    .then(() => this.$router.push(this.$route.query.redirect || '/')) 
    .catch(error => { /*handle errors*/ }) 
} 

Hy vọng nó giúp.