2014-07-17 16 views
77

L'app su cui sto lavorando contiene vari stati (utilizzando ui-router), in cui alcuni stati richiedono l'accesso, altri sono disponibili pubblicamente.

Ho creato un metodo che controlla validamente se un utente ha effettuato l'accesso, quello che sto attualmente avendo problemi è in realtà reindirizzamento alla nostra pagina di accesso quando necessario. Va notato che la pagina di accesso non è attualmente inserita nell'app AngularJS.

app.run(function ($rootScope, $location, $window) { 


    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) { 

     if (toState.data.loginReq && !$rootScope.me.loggedIn) { 
      var landingUrl = $window.location.host + "/login"; 
      console.log(landingUrl); 
      $window.open(landingUrl, "_self"); 
     } 
    }); 
}); 

Il file console.log mostra correttamente l'URL desiderato. La linea dopo, ho provato praticamente tutto da $ window.open a window.location.href e non importa cosa ho provato, nessun redirect accade.

EDIT (risolti):

Trovato il problema.

var landingUrl = $window.location.host + "/login"; 
$window.open(landingUrl, "_self"); 

La landingUrl variabile è stata impostata su 'domain.com/login', che non avrebbe lavorato con $ window.location.href (che era una delle cose che ho provato). Tuttavia dopo aver modificato il codice in

var landingUrl = "http://" + $window.location.host + "/login"; 
$window.location.href = landingUrl; 

ora funziona.

+0

Probabilmente dovrebbe aggiungere anche l'autenticazione lato server sui dati, quindi quanto sopra non è l'unica autenticazione, è più una questione di convenienza per reindirizzare alla pagina di accesso, invece di mostrare una pagina prevalentemente vuota. –

+1

è necessario l'oggetto 'location' nativo usando' $ window.location = ... ' – charlietfl

+0

In alternativa si potrebbe considerare di rendere tutto un AngularJS compresa l'autenticazione - vedi questo post http://frederiknakstad.com/2013/01/21/authentication-in-single-page-applications-with-angular-js/ – Soren

risposta

63

Credo che il modo per farlo è $location.url('/RouteTo/Login');

Modifica per chiarezza

Dire il mio percorso per il mio punto di vista accesso era /Login, direi $location.url('/Login') per navigare a quel percorso.

Per località al di fuori della app angolare (cioè nessun percorso definito), pianura vecchio JavaScript volontà server:

window.location = "http://www.domain.com/login" 
+0

Ho appena provato. Sfortunatamente, questo reindirizza a www.domain.com/app/RouteTo/login piuttosto che www.domain.com/login –

+0

Giusto, ciò non significava essere letterale. Non so cosa tu abbia definito come percorso per la tua vista di accesso. Colloca qualunque percorso potrebbe trovarsi nell'argomento per il metodo $ location.url(). Ho modificato la risposta per chiarezza. –

+0

Ah, giusto. Il problema qui è che $ location.url reindirizza ancora a un percorso secondario dell'app. Quindi, utilizzando $ location.url ('/ login') reindirizza a www.domain.com/app/login piuttosto che www.domain.com/login –

17

Potrebbe aiutare! demo

AngularJs Codice-campione

var app = angular.module('urlApp', []); 
app.controller('urlCtrl', function ($scope, $log, $window) { 
    $scope.ClickMeToRedirect = function() { 
     var url = "http://" + $window.location.host + "/Account/Login"; 
     $log.log(url); 
     $window.location.href = url; 
    }; 
}); 

HTML Codice-campione

<div ng-app="urlApp"> 
    <div ng-controller="urlCtrl"> 
     Redirect to <a href="#" ng-click="ClickMeToRedirect()">Click Me!</a> 
    </div> 
</div> 
28

Sembra che per la pagina completa ricarica $window.location.href è il modo preferito.

Non provoca il ricaricamento di una pagina intera quando l'URL del browser viene modificato. Per ricaricare la pagina dopo aver modificato l'URL, utilizzare l'API di livello inferiore, $ window.location.href.

https://docs.angularjs.org/guide/$location

-8

devi mettere:

< html ng-app = "urlApp" ng-Controller = "urlCtrl">

In questo modo la funzione angolare può accedere in oggetto "finestra"

4

Non sicuro da quale versione, ma io uso 1.3.14 e puoi semplicemente usare:

window.location.href = '/employee/1'; 

Non c'è bisogno di iniettare $location o $window nel controller e senza bisogno di ottenere l'indirizzo host corrente.