Kullanıcı, tarayıcı sekmesinde kullanıcı URL'sini el ile değiştirdiğinde açılı olarak yönlendirmeyi engelle

Question

Kullanıcı, tarayıcı sekmesindeki rotayı manuel olarak değiştirdiğinde ve presler girildiğinde oluşan bir sorunla karşılaşıyorum. Bu, ui yönlendiricimi/angular2 yönlendiriciyi kullanıcı tarafından girilen duruma gitmeye zorlar. Bunu engellemek ve sadece web sitemdeki buton tıklamaları ile uyguladığım akış üzerinden yönlendirmeye izin vermek istiyorum.

Answer 1

Onun 2018! Açısal 5 burada ve bu sorunun çözümü de var. BAMM CanActivate Arabirim, bir sinyalin, bir rotanın etkinleştirilip etkinleştirilemeyeceğine karar vermek için uygulanabileceği arabirimdir.

Bu işlevselliği ekleyebilir ve tanımladığımız koşullara bağlı olarak bazı rotalarımıza erişilmesini engelleyebiliriz. Rota konfigürasyonuna CanActivate arayüzünü uygulayan ve canActivate metodunu tanımlayan AuthGuard için bir servis eklenebilir. İşte

const appRoutes: Routes = [ 
    { path: 'crisis-center', component: CrisisListComponent }, 
    { 
    path: 'heroes', 
    canActivate: [AuthGuard], 
    component: HeroListComponent, 
    data: { title: 'Heroes List' } 
    }, 
    { path: '', 
    redirectTo: '/heroes', 
    pathMatch: 'full' 
    }, 
    { path: '**', component: PageNotFoundComponent } 
]; 

rota heroes ve tüm çocukların gurad katmanı vardır: biz bazı duruma karşı erişimi korumak isteyen bir rota varsa aşağıdaki gibi

class Permissions { 
    canGoToRoute(user: UserToken, id: string): boolean { 
    return true; 
    } 
} 

@Injectable() 
class AuthGuard implements CanActivate { 
    constructor(private permissions: Permissions, private currentUser: UserToken) {} 

    canActivate(
    route: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
): Observable<boolean>|Promise<boolean>|boolean { 
    return this.permissions.canGoToRoute(this.currentUser, route.params.id); 
    } 
} 

, biz nöbet eklemek bitir. Dolayısıyla, AuthGuard servisi tarafından döndürülen boolean değerine dayanarak, kullanıcıya bu rotaya erişime izin verilir veya erişim reddedilir. Bazı kirli yol kullanmadan

Answer 2

Bu kodu app.js. olarak yazın.

.run(['$rootScope', '$state', '$stateParams','LoginStatusService',function($rootScope, $state, $stateParams,LoginStatusService) { 
    $rootScope.$state = $state; 
    $rootScope.$stateParams = $stateParams; 

    $rootScope.$on('$stateChangeSuccess', function(event, toState) { 
     //Write Routes login here 
     if(LoginStatusService.getUserStatus()===false){ 
      $state.go('core.login'); 

     } 
    }); 
}]) 

Answer 3

$stateChangeStart olay bu işlemek için uygun bir yerdir. Bu olay, URL'a gitmeye çalıştığınızda tetiklenir. Bu noktada, kullanıcının kimliğinin doğrulanıp doğrulanmadığını kontrol edip, yapamayacağınızı geri çekebilirsiniz.

Böyle olayı kanca olacaktır:

angular 
    .module('myApp') 
    .run(function ($rootScope, $state, authFactory) { 
    $rootScope.$on('$stateChangeStart', function() { 
     //if user is not logged in 
     if(!authFactory.isAuthed()){ 
     $state.go('login') 
     } 
    }) 
    }); 

yardımcı olur Umut.