Ich versuche eine AngularJS-App zu erstellen, bei der sich Benutzer anmelden müssen.
Wenn sie das Programm zum ersten Mal besuchen, werden sie auf eine Login-Seite weitergeleitet ( Ссылка ). Wenn der Benutzer seinen Benutzernamen und sein Passwort eingibt, wird ein Webservice aufgerufen ( Ссылка ) die JSON-Daten mit der ID, dem Namen usw. des Benutzers zurückgibt, die irgendwo gespeichert werden müssen (cookies / localstorage?).
Wie könnte ich das tun? Müsste ich einen Server erstellen (vielleicht auf nodejs), um die Anfragen an den Web Service zu bearbeiten, oder würde ein angularjs Service ausreichen?
%Vor%Meine Idee war, einen Dienst in eckigen zu erstellen, der die ganze Arbeit erledigen würde (create / Eintrag im lokalen Speicher), während der Login-Controller den Benutzer mit $ http authentifizieren würde.
Ich habe in Sachen Passport mit lokaler Strategie oder Beispielen wie Ссылка nachgeschaut, aber das tue ich nicht denke, sie decken ab, was ich erreichen will, oder ich kann sie nicht einfach verstehen.
Ich hoffe, dies ist keine allgemeine Frage und danke im Voraus für die Antworten.
Ich habe hier eine ähnliche Frage beantwortet: AngularJS Authentication + RESTful API
Ich habe ein AngularJS-Modul für UserApp , das ziemlich genau das tut, was Sie wollen. Du könntest entweder:
Es unterstützt geschützte / öffentliche Routen, Umleitung bei An- / Abmeldung, Heartbeats für Statusprüfungen, speichert das Sitzungstoken in einem Cookie, Ereignisse usw.
Wenn Sie UserApp verwenden, müssen Sie keinen serverseitigen Code für den Benutzerkram schreiben (mehr als nur ein Token validieren). Nimm den Kurs über die Codecademy , um es auszuprobieren.
Hier einige Beispiele, wie es funktioniert:
Anmeldeformular mit Fehlerbehandlung:
%Vor%Anmeldeformular mit Fehlerbehandlung:
%Vor%So legen Sie fest, welche Routen öffentlich sein sollen und welche Route das Anmeldeformular ist:
%Vor% Die Route .otherwise() sollte auf die Stelle festgelegt werden, an die Ihre Benutzer nach der Anmeldung weitergeleitet werden sollen. Beispiel:
$routeProvider.otherwise({redirectTo: '/home'});
Link abmelden:
<a href="#" ua-logout>Log Out</a>
(Beendet die Sitzung und leitet zum Login-Pfad um)
Zugriff auf Benutzereigenschaften:
Auf Benutzereigenschaften wird mit dem Dienst user zugegriffen, z. B .: user.current.email
Oder in der Vorlage: <span>{{ user.email }}</span>
Elemente ausblenden, die nur sichtbar sein sollten, wenn Sie angemeldet sind:
<div ng-show="user.authorized">Welcome {{ user.first_name }}!</div>
Ein Element basierend auf Berechtigungen anzeigen:
<div ua-has-permission="admin">You are an admin</div>
Und um sich bei Ihren Back-End-Diensten zu authentifizieren, verwenden Sie einfach user.token() , um das Sitzungstoken zu erhalten und es mit der AJAX-Anfrage zu senden. Verwenden Sie im Back-End die UserApp-API (wenn Sie UserApp verwenden), um zu überprüfen, ob das Token gültig ist oder nicht .
Wenn Sie Hilfe brauchen, lassen Sie es mich wissen:)
Lesen Sie diesen Artikel .
Der Ansatz, den ich verwendet habe, ist, verschiedene Authentifizierungsschichten (Webapp und Webservice) zu betrachten und die echte Authentifizierung nur im Webservice zu betrachten. Webapp verhält sich nur so, wie der Benutzer im Falle einer Authentifizierung erwartet.
Hoffe, das hilft.
Tags und Links javascript angularjs authentication rest