Heim  >  Artikel  >  Web-Frontend  >  Wie sichert man separate Angular-Apps mit der UI-Router-Authentifizierung?

Wie sichert man separate Angular-Apps mit der UI-Router-Authentifizierung?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-10-30 22:42:30760Durchsuche

How to Secure Separate Angular Apps with ui-router Authentication?

So integrieren Sie die AngularJS-UI-Router-Authentifizierung in separate Abschnitte

Im dargestellten Szenario haben Sie zwei Abschnitte, eine Homepage und ein Dashboard , mit verschiedenen Winkel-Apps. So integrieren Sie die Autorisierung mithilfe des UI-Routers:

  1. Erstellen Sie einen Hauptdienst:

    • Speichert die Benutzeridentität und stellt Methoden für Authentifizierung und Rolle bereit Überprüfung.
  2. Erstellen Sie einen Autorisierungsdienst:

    • Bestimmt, ob ein Benutzer berechtigt ist, auf einen Status zuzugreifen.
    • Weiterleitungen zu Anmelde- oder Zugriffsverweigerungsseiten nach Bedarf.
  3. $stateChangeStart-Ereignis anhören:

    • Überprüfen Sie die Autorisierung, wenn eine Statusänderung eingeleitet wird.
  4. Stellen Sie sicher, dass die Benutzeridentität aufgelöst ist:

    • Verwenden Sie „Auflösen in“. übergeordneter Staat, um die Identitätsauflösung vor jeder Zustandsänderung zu erzwingen.
  5. Autorisierung an zwei Stellen implementieren:

    • Authentifizierungsprüfungen durchführen sowohl in „resolve“ als auch in „$stateChangeStart“.
  6. Bestimmte Zustände einschränken:

    • Daten mit Rollen zu Zuständen hinzufügen, die eine Autorisierung erfordern.
  7. Integration mit View-Controllern:

    • Injizieren Sie Prinzipale in Controller, um Elemente basierend auf Authentifizierung oder Rolle bedingt anzuzeigen.

Erstellen Sie in Ihrem Beispiel einen Home-Status, der es nicht authentifizierten Benutzern ermöglicht, die Homepage anzuzeigen. Unterzustände für das Dashboard können von einem Zustand erben, der eine Authentifizierung und eine bestimmte Rolle erfordert, z. B. „Benutzer“.

Das obige ist der detaillierte Inhalt vonWie sichert man separate Angular-Apps mit der UI-Router-Authentifizierung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn