Behebung von 401 Unauthorized-Antworten bei HTTP POST mit Angular und ASP.NET Core JWT-Autorisierung

Erfahren Sie, wie Sie das Problem von `401 Unauthorized`-Antworten bei der Verwendung von HTTP POST in Angular mit ASP.NET Core 3.1 JWT-Autorisierung lösen können. Befolgen Sie diese Schritte, um ein korrektes Verhalten bei allen HTTP-Methoden sicherzustellen.
---
Dieses Video basiert auf der Frage https://stackoverflow.com/q/62286301/ gestellt von dem Nutzer 'Carson Wiens' ( https://stackoverflow.com/u/6509281/ ) sowie auf der Antwort https://stackoverflow.com/a/62286441/ bereitgestellt von dem Nutzer 'mr. pc_coder' ( https://stackoverflow.com/u/2576254/ ) auf der Website 'Stack Overflow'. Vielen Dank an diese großartigen Nutzer und die Stackexchange-Community für ihre Beiträge.

Besuchen Sie diese Links, um den Originalinhalt und weitere Details zu sehen, z. B. alternative Lösungen, aktuelle Entwicklungen zum Thema, Kommentare, Versionsverlauf usw. Der ursprüngliche Titel der Frage lautete beispielsweise: HTTP GET works, but other HTTP methods return 401 - Angular 9 Asp.Net Core 3.1 JWT authorization

Außerdem steht der Inhalt (außer Musik) unter der Lizenz CC BY-SA https://meta.stackexchange.com/help/l...
Der ursprüngliche Fragenbeitrag steht unter der Lizenz 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ), und der ursprüngliche Antwortbeitrag steht unter der Lizenz 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ).

Falls Ihnen irgendetwas auffällt oder Unstimmigkeiten bestehen, schreiben Sie mir bitte an vlogize [AT] gmail [DOT] com.
---
Behebung von 401 Unauthorized-Antworten bei HTTP POST mit Angular und ASP.NET Core JWT-Autorisierung

Wenn Sie mit Angular und ASP.NET Core arbeiten, kann es vorkommen, dass HTTP GET-Anfragen erfolgreich sind, während andere Methoden wie POST, PUT und DELETE 401 Unauthorized-Fehler zurückgeben. Dies kann besonders ärgerlich sein, da es so scheint, als funktioniere die Autorisierung für GET-Anfragen einwandfrei.

In diesem Blogbeitrag gehen wir auf dieses Problem ein, untersuchen sowohl die Symptome als auch deren Behebung, um eine nahtlose Datenkommunikation über verschiedene HTTP-Methoden zu gewährleisten.

Das Problem verstehen

Symptome

Typischerweise zeigt sich dieses Problem durch folgende Merkmale:

JWT-Autorisierung funktioniert wie erwartet: Nicht autorisierte Benutzer können nicht auf geschützte Methoden zugreifen, und gültige JWT-Bearer-Token ermöglichen den Zugriff für GET-Anfragen.

GET-Anfragen funktionieren: Clients können GET-Anfragen erfolgreich senden und erhalten die erwarteten Antworten.

POST-, PUT-, DELETE-Anfragen sind nicht autorisiert: Obwohl korrekt gebildet, geben diese Anfragen einen 401 Unauthorized-Fehler zurück.

Erfolg mit anderen Tools: Werkzeuge wie Fiddler oder Postman können POST-Anfragen erfolgreich ausführen, was darauf hindeutet, dass das Server-Seite-Problem unwahrscheinlich ist.

Beispiel: Funktionierende GET-Anfrage

So sieht eine funktionierende GET-Anfrage aus:

Client-seitig:

[[Siehe Video, um diesen Text oder Codeausschnitt anzuzeigen]]

Server-seitig:

[[Siehe Video, um diesen Text oder Codeausschnitt anzuzeigen]]

Beispiel: Nicht funktionierende POST-Anfrage

Im Gegensatz dazu sieht eine problematische POST-Anfrage folgendermaßen aus:

Client-seitig:

[[Siehe Video, um diesen Text oder Codeausschnitt anzuzeigen]]

Server-seitig:

[[Siehe Video, um diesen Text oder Codeausschnitt anzuzeigen]]

Lösung

Die unterschiedliche Verhaltensweise zwischen GET- und POST-Anfragen liegt häufig daran, wie diese in Angular aufgebaut sind.

Korrekturschritte

So beheben Sie das Problem:

POST-Methode anpassen: Der erste Parameter sollte immer die URL sein, der zweite der Body (kann null sein, falls kein Inhalt übergeben wird) und der dritte Parameter sind die Optionen (inklusive Header). Hier das korrigierte Beispiel:

Client-seitige POST-Anfrage:

[[Siehe Video, um diesen Text oder Codeausschnitt anzuzeigen]]

Warum das funktioniert

Diese Anpassung ist entscheidend, da sie sicherstellt, dass die POST-Anfrage korrekt formatiert ist und den Erwartungen der HTTP-Anfragen in Angular entspricht. Indem Sie null als Body übergeben, geben Sie explizit an, dass kein Payload mitgesendet wird, während Sie die erforderlichen Autorisierungsheader beibehalten.

Fazit

Wenn Sie die oben genannten Schritte befolgen, können Sie effektiv die 401 Unauthorized-Fehler bei HTTP POST-Anfragen in Ihren Angular-Anwendungen beheben, die ASP.NET Core 3.1 JWT-Autorisierung verwenden.

Stellen Sie stets sicher, dass der Aufbau Ihrer Anfragen den erwarteten Konventionen des Angular HTTP-Clients entspricht, um eine reibungslose und erfolgreiche Kommunikation mit Ihren Backend-Diensten zu gewährleisten.

Sollten weiterhin Schwierigkeiten auftreten, lohnt es sich, die Autorisierungseinstellungen auf Serverseite zu überprüfen und sicherzustellen, dass das JWT-Token gültig ist, um das Problem weiter einzukreisen.

Mit diesen Anpassungen sind Sie auf dem besten Weg, durchgängig Erfolg mit allen HTTP-Methoden in Ihren Anwendungen