Hier ist ein sehr einfaches Beispiel für die JWT-Bearer-Token-Autorisierung mit Angular als Front-End und ASP.NET Core als Backend. ASP.NET Core3.1 angle7.2.1 mit systemjs. (Stellen Sie sicher, dass Sie Dotnet Core 3.1 + und Angular7.2.1 installiert haben)
(Warum systemjs nicht Webpack? Persönliche Meinung: Webpack ist einfach zu kompliziert, um es für kleine, einfache Anwendungen zu verwenden. Ich habe es eher als effizient angesehen, damit die meisten Programmierer meinen Beispielcode lesen können.)
Jetzt können Sie Google stoppen und herausfinden, wie Sie die Bear-JWT-Token-Authentifizierung durchführen. Es ist ganz einfach!
Im Backend: MS$ stellt die Middleware AddAuthentication().AddJwtBearer() für die Bear-JWT-Token-Authentifizierung bereit, sodass die Dinge so einfach sind wie das Hinzufügen der Middleware bei Startup.cs
Am Frontend (in diesem Fall eckig): Speichern Sie das Token in sessionStorage und legen Sie bei der Kommunikation mit dem Backend den Header der http-Anfrage (https für die Produktion) wie folgt fest:
let headers = new HttpHeaders()
.set('Content-Type','application/json')
.set("Authorization", "Bearer " + token);
Angular & Material 7.2.1 in ASP.NET Core 3.1 (VS2019 oder csproj-Version) mit JWT-Lösung.
Stellen Sie sicher:
ASP.NET CORE 3.1 wurde installiert. Wenn nicht, finden Sie es hier: https://www.microsoft.com/net/download/core
nodejs wurde installiert. Wenn nicht, laden Sie es von https://nodejs.org/en/download/ herunter.
Gehen Sie nach dem Herunterladen dieses Repositorys zum Ordner mit der Datei ASPNETCoreAngularJWT.csproj und führen Sie den folgenden Befehl aus:
>dotnet restore
>npm install
>npm start
Starten Sie schließlich Dotnet und den Browser http://localhost:5000
>dotnet run
Und vergessen Sie nicht, „npm start“ auszuführen, nachdem Sie Typoskriptdateien geändert haben.
Sie können dies für die Angular-Kompilierung und die Dotnet-Ausführung ausführen
>npm run runall
Außerdem kann es sowohl mit Visual Studio 2017 als auch mit Visual Studio Code geöffnet werden. Stellen Sie nach dem Öffnen durch VS2017 und vor der Ausführung als Debug sicher, dass Projekt->Eigenschaft ->Debug- und App-URL = „http://localhost:5000“ ist, und erstellen Sie es erneut, bevor Sie mit dem Debuggen beginnen